The subscribe() implementation seems suboptimal in the case where there are many different topics:<p><pre><code> subscribe(topic, callback) {
if (this.listeners[topic] == undefined) {
// Not yet any listener for this topic
this.listeners[topic] = [];
window.addEventListener('storage', (e) => {
const dataKey = topic + "_data";
if (e.key === dataKey) {
const data = JSON.parse(e.newValue)[0];
this.listeners[topic].forEach((v, k) => {
v(data);
});
}
}, false);
}
this.listeners[topic].push(callback)
}
</code></pre>
This installs a handler for every single topic, and every time a message is published, the handlers for all topics are called, even though at most one is interested in the change. A more efficient implementation would install a single handler, e.g. (untested):<p><pre><code> window.addEventListener('storage', (e) => {
if (e.key.endsWith('_data')) {
const topic = e.key.substring(0, e.key.length - 5);
const data = JSON.parse(e.newValue)[0];
this.listeners[topic]?.forEach(v => v(data));
}
}, false);</code></pre>