diff --git a/web/src/App.tsx b/web/src/App.tsx
index bb78844..0aaab7d 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -13,7 +13,7 @@
 //
 // You should have received a copy of the GNU Affero General Public License
 // along with this program.  If not, see <https://www.gnu.org/licenses/>.
-import { useEffect, useMemo } from "react"
+import { useEffect } from "react"
 import { ScaleLoader } from "react-spinners"
 import Client from "./api/client.ts"
 import WSClient from "./api/wsclient.ts"
@@ -22,19 +22,20 @@ import MainScreen from "./ui/MainScreen.tsx"
 import { LoginScreen, VerificationScreen } from "./ui/login"
 import { LightboxWrapper } from "./ui/modal/Lightbox.tsx"
 import { ModalWrapper } from "./ui/modal/Modal.tsx"
-import { useEventAsState } from "./util/eventdispatcher.ts"
+import { useCachedEventAsState } from "./util/eventdispatcher.ts"
+
+const client = new Client(new WSClient("_gomuks/websocket"))
+window.client = client
 
 function App() {
-	const client = useMemo(() => new Client(new WSClient("_gomuks/websocket")), [])
-	const connState = useEventAsState(client.rpc.connect)
-	const clientState = useEventAsState(client.state)
-	window.client = client
+	const connState = useCachedEventAsState(client.rpc.connect)
+	const clientState = useCachedEventAsState(client.state)
 	useEffect(() => {
 		Notification.requestPermission()
 			.then(permission => console.log("Notification permission:", permission))
 		client.rpc.start()
 		return () => client.rpc.stop()
-	}, [client])
+	}, [])
 
 	if (connState?.error) {
 		return <div>