TabSub

Offline Javascript PubSub between browser tabs

TabSub offers you an easy to use Javascript PubSub via local storage. No server is required as all messages are shared via the browser built in local storage.

Give the example a try to see what you can build with TabSub.

Is this safe for a lot of concurrent writes? To be honest I have no clue. I tried to break it with 10 concurrent writers and everything worked as expected: No message got lost and the messages where in correct order. No warranty here, use at your own risk 😅

As TabSub uses local store this only works on the same domain, as the browser separates the local storage by domains as security measure.

TabSub is on Github and licensed MIT

Example

Start one of the two songs and than open this site in a second tab. You will see that the playing song time syncs and if you start the other song that the first one stops.

Look into the source code of this site to see how I used TabSub to built this example.

Sad Circus

They say

Usage

Including the script

<script src="https://simon-frey.com/tabsub/tabsub.v1.min.js" 
    integrity="sha384-WhqYceisw/e1nVVrHA5CI/Lt/c3HrNIZLtPE+sWky3NjzRAF6kt9Ivjp8LwoIS/k" >
</script>

Initialization

<script>
    const ts = new TabSub();
</script>

Available functions

publish(topic,msg)

Publish new message. The message can be of any type. Your callback in subscribe has to handle it correctly. TabSub does not take care about that.

<script>
    ts.publish("hello","world");
</script>

subscribe(topic, callback)

Register new listener. Callback is called with the message content if new message arrives

<script>
    ts.subscribe("hello",(msg)=>{
        console.log("Got msg: ",msg);
    });
</script>

state(topic)

Get the current (static) state of a topic. Returns the current data in the local storage for this topic

<script>
    const state = ts.state("hello");
    console.log("Current state: ",msg);
</script>

Find my other projects on simon-frey.com