diff --git a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-realtime-connection.ts b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-realtime-connection.ts
index dacdd29c6..a9ec4bc95 100644
--- a/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-realtime-connection.ts
+++ b/frontend/src/components/editor-page/editor-pane/hooks/yjs/use-realtime-connection.ts
@@ -94,6 +94,8 @@ export const useRealtimeConnection = (): MessageTransporter => {
     return () => window.removeEventListener('beforeunload', disconnectCallback)
   }, [messageTransporter])
 
+  useEffect(() => () => messageTransporter.disconnect(), [messageTransporter])
+
   useEffect(() => {
     const connectedListener = messageTransporter.doAsSoonAsReady(() => setRealtimeConnectionState(true))
     const disconnectedListener = messageTransporter.on('disconnected', () => setRealtimeConnectionState(false), {