How To Do Cross-Tab Communication With JavaScript

There's a couple different ways we can go about this.

1. LocalStorage | MDN

   First, we'll be going over cross-tab communication with LocalStorage. This method is best if you need to support older browsers, it has support back to IE8. It's also the only method that has decent mobile browser support.

2. SharedWorker | MDN

   Second, we'll cover using a SharedWorker. This method is similar to using a WebWorker, except the worker is sharable across browser contexts (windows, tabs, frames). Using this approach is great if you're doing some heavy lifting because all the worker's code will be run in the background by the browser. Meaning, it's not running on the same thread as our application.

3. BroadcastChannel | MDN

   Last, we'll cover using a BroadcastChannel. This is a native browser API to achieve exactly what we want. The down side is there's no Safari support.