When will Javascript garbage collector delete variables that are covered by closure relations?

Question

I'm receiving chunks of data asynchronrously via SSE and it is slowly but surely populating a dictionary {UPD.x, UPD.y}, whose contents I want to display with ploty.js. I want to see the graph steadily update as more chunks arrive.

I do the plotly calls similar to this

eventSource.onmessage = function(event) { 
   const data = json.parse(event.data);
   const UPD = data.upd;
   Plotly.update (PLOTTER, UPD, [0]);
}

where PLOTTER is global in the calling program. My thought is that while UPD is local to that function, the update command copies the reference as PLOTTER.data = UPD and so UPD should survive any garbage collection as long as PLOTTER stays alive at least until the next batch of data arrives, when the old UPD would get garbage collected.

A) Do I have that correct?

B) Taking this one step further, I really just want to be sure to display the last graph, I don't really care if I "miss" some plots of partial data. If new data has arrived since the last promise to Plotly.update() was issued then I'd really just want to blow off that earlier call. I think a solution to that could be to make UPD itself global to the function. What are the potential downfalls to that? Worst case that I can see is that it could result in a few extra calls to Plotly.update if the data arrives ahead of the plot. But maybe there could be an obscure race condition if UPD updates in the middle of a plot...

Answer 1

the update command copies the reference as PLOTTER.data = UPD and so UPD should survive any garbage collection as long as PLOTTER stays alive. Do I have that correct?

No, you really need to distinguish between the UPD variable and the object that is referenced by data.upd, UPD and PLOTTER.data.

The UPD variable itself will get garbage-collected as soon as the onmessage function ends, just like the event and data variables. This will remove one reference from UPD to the object, and since the data object is no longer referenced, another reference from its .upd property to the object.

The object that was previously referenced multiple times is however still referenced from the .data property of the PLOTTER object, and as that seems to be a global variable (or at least a variable closed over by the eventSource listener), it will not be garbage-collected.