isAuthenticated of useAuth0 is too slow, why?

Describe the problem

We are using @auth0/auth0-react in our React app. After login, it takes about 10 seconds for isAuthenticated of useAuth0 to become true. Why is it taking so long? Is there anything I can do to improve this?

ref: https://community.auth0.com/t/isauthenticated-of-useauth0-is-too-slow-why/72298

What was the expected behavior?

isAuthenticated should become true in about few second.

Reproduction

import { Loading } from '@/components/feedback/Loading';
import { useAuth0 } from '@auth0/auth0-react';
import React, { useContext, useEffect } from 'react';

export const LoginRestrictedRoute = ({ children }) => {
  const { isAuthenticated, isLoading, loginWithRedirect } = useAuth0();

  useEffect(() => {
    if (!isLoading && !isAuthenticated) {
     loginWithRedirect({
        appState: {
          targetUrl: window.location.href,
        },
      });
    }
  }, [isLoading, isAuthenticated]);

  if (isLoading || !isAuthenticated) {
    return <Loading loading={isLoading} size="large" />;
  }

  return children;
};

Environment

• Which SDK this is regarding: @auth0/auth0-react

• SDK Version: ^1.3.0

• Platform Version: react: 17.0.1

[mikan3rd]

I was able to identify the cause of the problem. It seems that the problem was that I was calling getAccessTokenSilently() before isAuthenticated became true. I apologize for the inconvenience.

[michaelm244]

@mikan3rd Thanks for posting the cause you found!

I had the exact same symptoms (random, unexplained loading) and once I removed the codepath that was calling getAccessTokenSilently before isAuthenticated was true it went away.