Understanding Liveview Diff and how best to adapt our code for efficiency

Phoenix Forum Questions / Help
1

Here is my scenario:

  • i have one card per modem
  • I have a PubSub in my modem handler
  • i want the most efficient use of LV to update each card as state changes per card (per modem)

do i make this one topic in the pub-sub - one map of modems?
what is the rule of thumb to ensure that LiveView can efficiently only update the cards when a single field changes - send the minimal payload of the actual change and not each modems full state?

image
image1200×443 29.6 KB

2

How you structure you message passing doesn‘t matter at all. What matters is how you setup your assigns (mostly lists vs maps, keying used for lists, …) and then how you setup you templates (the less things change the better). LV always runs the complete render/1 callback, so it‘s mostly a matter of LV being able to detect that the tree of component called stayed the same and then for each component having the minimal amount of changes possible.

1 Like
3

Thanks.

Thinking further, having LV update for every single field change sound great at first.

I need to figure out a way to aggregate the modem states and push an event once per second (once per set interval) then the LV can do its diff and updates in a batch efficiently.

4

Broadly speaking you can achieve this by synchronizing your assign changes in one go, then LiveView will send all HTML updates in a single message.

For example you can use Process.send_after and handle_info to recompute assigns every X seconds.

1 Like
5

What I eventually did was to use the Modem-Handler GenSerever to aggregate state from different modems then trigger a per second event if we have a dirty_flag == true

Liveview gets one event with a map so it can Diff on the modem-state keys - pushing the minimal update but only once per second , when we actually have updates to send.

the Modem-Handler GenSerever as survives Live view reloads and crashes

1 Like