v149 · Demo 1

Connection Lifecycle Observer

Open a WebSocket, navigate away, come back via back button — and watch the page lifecycle + WebSocket events unfold in the log.

WebSocket state: CLOSED BFCache: —
Lifecycle Log
Open a WebSocket above to start logging. Then navigate away and back.

how it works

// On pagehide, Chrome 149 closes open WebSocket connections
// so the page can enter BFCache (persisted: true).
window.addEventListener('pagehide', (event) => {
  if (event.persisted) {
    // Page entering BFCache — WebSocket will be auto-closed by Chrome 149
    console.log('Entering BFCache, WebSocket will be closed');
  }
});

// On pageshow, detect BFCache restore and reconnect
window.addEventListener('pageshow', (event) => {
  if (event.persisted) {
    // Page restored from BFCache — reopen WebSocket
    console.log('Restored from BFCache, reconnecting…');
    openWebSocket();
  }
});

// Pattern: always close gracefully and reconnect on restore
ws.addEventListener('close', (event) => {
  if (restoredFromBFCache) reconnect();
});

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗