Multiple Window Data Shared Worker

Program Flow

1. A window is opened and loads the client script (logic.js).
2. It connects to the SharedWorker and registers its unique ID (via window.name).
3. Every 500 ms, the window calculates and sends its current metrics:
   • x, y: screen position
   • width, height: window dimensions
   • centerX, centerY: computed midpoint
4. The SharedWorker stores this data and sends updates to all other windows (except the sender).
5. Windows can manually request:
   • Their own metrics (getMyMetrics)
   • Other windows' metrics (getOtherMetrics)
6. The UI reflects incoming updates with visual changes and logs.

Provided Functionality

• Real-time broadcasting of window metrics to all other connected windows
• Centralized state management for all windows (using IDs)
• Automatic polling and sync of:
  • position (x, y)
  • window size (width, height)
  • center (centerX, centerY)
• Manual querying of:
  • own metrics (getMyMetrics)
  • others' metrics (getOtherMetrics)
• UI integration for displaying and updating live values
• Loose coupling – windows don't know each other directly, only via shared state

Worker Code

This code is executed in the SharedWorker context.

Client Code