I’m currently using async generators to stream some results. I’m inspecting the first item of the array to save time, but the cell keeps refreshing, collapsing the JSON inspector. This is expected in a way, but it would be great if the cells could at least do some basic diffing on the value and not refresh the gui if it’s exactly the same as what is already rendered.
In designing the runtime, we deliberately chose to not imbue any semantics about whether two values are the same or different: if a generator yields, any downstream cells are re-evaluated regardless of the previous and the new value. (This is often what you want for generators that are valueless, like buttons, and for generators that yield deeply-mutable objects, like normal JavaScript objects.)
If you don’t want the downstream cells to run, then it’s up to your generator to define whether the value has changed or not, and to yield only when the value changes. For example, here is you could implement a reactive width that notifies if the window is resized horizontally but not if it is resized vertically:
width = Generators.observe(notify => {
let w = notify(window.innerWidth);
function resized() {
const w1 = window.innerWidth;
if (w1 !== w) notify(w = w1);
}
window.addEventListener("resize", resized);
return () => window.removeEventListener("resize", resized);
})
(This is very similar to how the built-in width is implemented.)
Oh, and the fact that the cells collapse when the values refresh is a bug that we’re planning on fixing. We’d like to persist the inspector state across updates so that you can inspect dynamic values (as long as those values don’t change their structure too dramatically).
Yeah, that’s basically the problem I’m having. I’ll try to create some kind of intermediate thing in the mean time, like redux reselect for observablehq or something like that.