(newbie question) dynamically add Signal as new data comes in from an EventSource?

[choucavalier]

I have a very specific question regarding a real-time medical research data visualisation app that I am building in a French hospital.

I have a Python backend that consumes data with a high temporal resolution (high frequency) from a Kafka broker, calculates some lower-frequency signals from this data, and then exposes it through an EventSource server.

My Fresh server runs on the same machine as the Python backend, and exposes the real-time visualisation application to doctors.

On the client side, I want the client to directly connect to the Python backend's EventSource server to subscribe to streams of data.

Each data point that is coming through has a "label". Each plot has a specific set of labels that it's going to subscribe to, and use for its particular visualisation.

Plots might share labels (e.g. PlotA and PlotB will both subscribe to label xyz).

I am wondering how to structure this with Fresh. And in particular:

1. Where should my state, that's going to store and cache incoming data, be located? I want the state to be shared from one plot to another, such that switching from one plot to another is not triggering a reload of the data.
2. Should each plot be an island? I have looked at this project but I don't really understand whether the plot components are islands or not.
3. How can I dynamically create new preact Signal as new labels are being subscribed to? My thinking is that a plot should be updated only when data with the labels it's subscribing to received new data. i.e. if label y comes in but the current plot being displayed doesn't care about label y, then it should not be updated (useless recalculation).

In general, being new to (p)react and Fresh, I am still a bit confused by all these concepts.

If someone more experienced with Fresh and preact could give her two cents that would be great!

Thanks :)

[marvinhagemeister]

1. It sounds like the state is mostly global from the app's point of view. In that case you could add it somewhere above the plot components in the tree.
2. Yes, it's each plot should be an island as you want them to react to changes on the client and not just be rendered on the server.
3. You can either create new signals inside components via the useSignal hook or outside of components using the signal function. There are multiple ways to go about modeling your data in a way that fulfils your use case. It's less about the underlying tech like whether signals are used or not, but rather how you structure the data. It often helps to tackle these problems one at a time rather than trying to solve everything at once. A first iteration could be to just pipe the data from the event source into the plots directly. A second iteration could be to store the filter values of the plot somewhere, where the code reading the event source can react to. That way when an event comes in, you could check if there is any plot that cares about that kind of label to begin with. A third iteration could be to now try to cache past event data, etc.