diff --git a/web/src/hooks/PageVisibility.ts b/web/src/hooks/PageVisibility.ts
deleted file mode 100644
index 06948d4d0..000000000
--- a/web/src/hooks/PageVisibility.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-import { useEffect, useState } from "react";
-
-function getBrowserVisibilityProp() {
-    if (typeof document.hidden !== "undefined") {
-        // Opera 12.10 and Firefox 18 and later support
-        return "visibilitychange";
-    } else if (typeof document.msHidden !== "undefined") {
-        return "msvisibilitychange";
-    } else if (typeof document.webkitHidden !== "undefined") {
-        return "webkitvisibilitychange";
-    }
-}
-
-function getBrowserDocumentHiddenProp() {
-    if (typeof document.hidden !== "undefined") {
-        return "hidden";
-    } else if (typeof document.msHidden !== "undefined") {
-        return "msHidden";
-    } else if (typeof document.webkitHidden !== "undefined") {
-        return "webkitHidden";
-    }
-}
-
-function getIsDocumentHidden() {
-    return !document[getBrowserDocumentHiddenProp()];
-}
-
-export function usePageVisibility() {
-    const [isVisible, setIsVisible] = useState(getIsDocumentHidden());
-    const onVisibilityChange = () => setIsVisible(getIsDocumentHidden());
-
-    useEffect(() => {
-        const visibilityChange = getBrowserVisibilityProp();
-
-        document.addEventListener(visibilityChange, onVisibilityChange, false);
-
-        return () => {
-            document.removeEventListener(visibilityChange, onVisibilityChange);
-        };
-    });
-
-    return isVisible;
-}
diff --git a/web/src/views/LoginPortal/FirstFactor/FirstFactorForm.tsx b/web/src/views/LoginPortal/FirstFactor/FirstFactorForm.tsx
index 1db551228..a9cc4fd2f 100644
--- a/web/src/views/LoginPortal/FirstFactor/FirstFactorForm.tsx
+++ b/web/src/views/LoginPortal/FirstFactor/FirstFactorForm.tsx
@@ -1,4 +1,4 @@
-import React, { MutableRefObject, useEffect, useRef, useState } from "react";
+import React, { MutableRefObject, useEffect, useMemo, useRef, useState } from "react";
 
 import { Button, Checkbox, FormControlLabel, Grid, Link, Theme } from "@mui/material";
 import makeStyles from "@mui/styles/makeStyles";
@@ -9,14 +9,11 @@ import { useNavigate } from "react-router-dom";
 import FixedTextField from "@components/FixedTextField";
 import { ResetPasswordStep1Route } from "@constants/Routes";
 import { useNotifications } from "@hooks/NotificationsContext";
-import { usePageVisibility } from "@hooks/PageVisibility";
 import { useRedirectionURL } from "@hooks/RedirectionURL";
 import { useRequestMethod } from "@hooks/RequestMethod";
-import { useAutheliaState } from "@hooks/State";
 import { useWorkflow } from "@hooks/Workflow";
 import LoginLayout from "@layouts/LoginLayout";
 import { postFirstFactor } from "@services/FirstFactor";
-import { AuthenticationLevel } from "@services/State";
 
 export interface Props {
     disabled: boolean;
@@ -37,7 +34,7 @@ const FirstFactorForm = function (props: Props) {
     const requestMethod = useRequestMethod();
     const workflow = useWorkflow();
 
-    const [state, fetchState, ,] = useAutheliaState();
+    const loginChannel = useMemo(() => new BroadcastChannel("login"), []);
     const [rememberMe, setRememberMe] = useState(false);
     const [username, setUsername] = useState("");
     const [usernameError, setUsernameError] = useState(false);
@@ -47,7 +44,6 @@ const FirstFactorForm = function (props: Props) {
     // TODO (PR: #806, Issue: #511) potentially refactor
     const usernameRef = useRef() as MutableRefObject<HTMLInputElement>;
     const passwordRef = useRef() as MutableRefObject<HTMLInputElement>;
-    const visible = usePageVisibility();
     const { t: translate } = useTranslation();
 
     useEffect(() => {
@@ -56,18 +52,12 @@ const FirstFactorForm = function (props: Props) {
     }, [usernameRef]);
 
     useEffect(() => {
-        if (visible) {
-            fetchState();
-        }
-        const timer = setInterval(() => fetchState(), 1000);
-        return () => clearInterval(timer);
-    }, [visible, fetchState]);
-
-    useEffect(() => {
-        if (state && state.authentication_level >= AuthenticationLevel.OneFactor) {
-            props.onAuthenticationSuccess(redirectionURL);
-        }
-    }, [state, redirectionURL, props]);
+        loginChannel.addEventListener("message", (ev) => {
+            if (ev.data) {
+                props.onAuthenticationSuccess(redirectionURL);
+            }
+        });
+    }, [loginChannel, redirectionURL, props]);
 
     const disabled = props.disabled;
 
@@ -90,6 +80,7 @@ const FirstFactorForm = function (props: Props) {
         props.onAuthenticationStart();
         try {
             const res = await postFirstFactor(username, password, rememberMe, redirectionURL, requestMethod, workflow);
+            loginChannel.postMessage(true);
             props.onAuthenticationSuccess(res ? res.redirect : undefined);
         } catch (err) {
             console.error(err);