Persistent data in the dashboard UI template


#1

What happens with the data from the UI in the dashboard template node when leaving the browser page and returning to it? Or when changing the visible flow inside the node-red dashboard?
For instance if there is a table or a chart in the UI template node, I would like to have the possibility to "reconstruct" the content when returning to that page, or in other cases even to reset the complete content of the html page. Is it possible to access a flow context where the chart or table data stored to or read from when returning to the page or when reloading it? Which events must be handled in the UI template to be notified when the page is getting selected or getting reloaded in browser? Can anybody help with some links to UI template node samples which handle such scenarios?


#2

I believe that Dashboard caches the last set of data sent. This is stored in-memory I think so is lost if Node-RED is restarted.

Do you mean changing the flow? If so, the cached data will be lost on re-deploy if you do a full deploy or flow deploy. If you do a node deploy, just the data from that node will be lost.

If you mean changing tabs in the Dashboard, it is a single page app so all the data from all the tabs is kept in the browser.

That just works - have you tried it?

I think there is a reset capability for charts - from the docs:

Inputting a msg.payload containing a blank array [] will clear the chart.

You can also use the ui_control node to track when clients (browser tabs) connect and use that to take further action if needed.

If you need more control beyond what Dashboard can provide, you might want to check out my node-red-contrib-uibuilder node. With that, you give up the nice, pre-configured widgets that Dashboard provides - you have to build your front-end yourself. However, you get a lot of control including integrated websocket connection (similar to Dashboard) but you also get a control channel as well as a data channel. The control channel includes information for connections and disconnections and for cache-control. The node's WIKI has information on building a simple but effective cache.


#3

Thank you for your answer.
What about the "special case" allowing the caching of the data independently of the browser cookies, based on the node red flow context? Is it possible to read/write to a flow context from the UI template?


#4

Any caching done by Dashboard isn't cookie based. It would be done with internal context variables within the node.

In order to do something from a context/flow/global variable you have to add the variable contents to the msg that feeds the template. Similarly, if you want to do something to that data and then send it back to update the Node-RED context/flow/global variable, you have to do a msg.send() from within your template code (which will run in the browser) and pick it up downstream of the template node.

some-trigger -> 
    change node (add variable to msg.payload) -> 
        Dashboard Template node (with code to process the variable in the browser and code to send back to node-red) -> 
            some-node (to process the returned data - if needed) ->
                change node (to update the variable from the msg.payload)