title: React Router very slow to redirect
body: <p>I am using a higher order component (PublicRoute) to conditionally render another component depending on whether the user is authenticated or not. I have made another higher order component, PrivateRoute, to achieve the opposite effect. The idea is that I don't want users logged in to be able to access the login page, and I don't want users who aren't logged in to view other pages. (Pragmatically speaking, this is unlikely, unless they manually type in the URL, but still, I want to ensure that it doesn't happen.)</p>
  
  <p>The problem is that the Redirect component is only working after the Login component renders for a few seconds. This seems like bizarre behavior. The auth piece of the state contains either an object or is false or null (null is the default state). So there shouldn't be any problem. The same problem occurs with the PrivateRoute (e.g. an unauthenticated user can still access the Cart page).</p>
  
  <p>PublicRoute.js</p>
  
  <pre><code>export const PublicRoute = ({ 
    isAuthenticated, 
    component: Component,
    ...rest
    }) =&gt; (
       &lt;Route 
       {...rest} 
       component={(props) =&gt; (!isAuthenticated ? (
          &lt;div&gt;
              &lt;Component {...props}/&gt;
          &lt;/div&gt;
      ) : ( &lt;Redirect to="/shop"/&gt; )
      )}/&gt;
  );
  
  const mapStateToProps = ({ auth }) =&gt; ({ isAuthenticated: !!auth });
  
  export default connect(mapStateToProps)(PublicRoute); 
  </code></pre>
  
  <p>AppRouter.js</p>
  
  <pre><code>  &lt;PublicRoute path="/login" component={Login}/&gt;
  </code></pre>