Minimize use of websocket connections from the frontend

Background / Context

We need to optimize how changes get synced from the frontend to the backend in multi-tab scenarios.

Current behavior

Each tab in which a Studio channel is open, creates its own websocket connection with the backend. This includes tabs that have the same channel open, meaning the frontend would receive duplicate change objects from the backend.

Desired behavior

There are a few different approaches, the following are two:

1. Move change syncing and websocket connections to a service worker, and have each tab send messages to the worker which synchronizes them to the backend. Since the service worker would be controlling the websocket connections for each open channel, it could de-duplicate multiple connections.
2. Simply use a service worker to relay changes from one tab to another where the websocket connection is open. This is similar to how we initially had the sync polling, but could be problematic because of the browser's timer throttling or memory saver.

Start by mapping how each Studio tab creates its websocket connection and how changes are synchronized between the frontend and backend in multi-tab scenarios. Compare the service-worker approaches described in the issue, including their behavior under browser timer throttling and memory-saving; done means an agreed design that avoids duplicate connections or change objects.