Hi Abhinav Thanks for the response.
And yes Open tabs need to sync this data in real time with each other and only clear the data when browser is closed.

Hi Ajay,

Thanks for clarifying — that makes the requirement much clearer.

Since browsers don't natively distinguish between a tab close and a full browser close, you'll need a combination of two browser APIs to achieve what you want: localStorage for cross-tab communication and sessionStorage for detecting whether the browser itself has been fully closed.

Here's the approach:

The Core Idea

• Use localStorage to store and share your data across tabs (it persists across tabs and survives tab closes).
• Use sessionStorage as a "tab alive" flag (it is unique per tab and is automatically cleared when that specific tab closes).
• On page load, check how many tabs are currently "alive" by tracking them in localStorage. When a tab closes, update the count. When the count reaches zero, it means the last tab (i.e., the whole browser session) was closed — at that point, clear localStorage.

Step-by-step Logic

1. On tab open — add a unique tab ID (e.g., a timestamp or random ID) to a list of active tabs stored in localStorage. Also store this tab's ID in sessionStorage so it's tied to this tab only.

2. On tab close (beforeunload or pagehide event) — remove this tab's ID from the active tabs list in localStorage. If the list becomes empty after removal, clear the localStorage data entirely.

3. For real-time sync across tabs — use the storage event on window. This event fires in all other open tabs whenever localStorage is modified, allowing each tab to react immediately to changes made by another tab.