/Javascript/React/React router lazy load

React router lazy load

Lazy react

import React, { Suspense } from 'react';

const OtherComponent = React.lazy(() => import('./OtherComponent'));

function MyComponent() {
  return (
    <div>
      <Suspense fallback={<div>Loading...</div>}>
        <OtherComponent />
      </Suspense>
    </div>
  );
}

Source: reactjs.org

Lazy loading react

 const Home = React.lazy(() => import("./Home"));

React router lazy load

  const Home = React.lazy(() => import("./Home"));
 
<Route
            path="home/*"
            element={
              <React.Suspense fallback={<>...</>} >
                <Home />
              </React.Suspense>
            }
          />

Similar codes

1 vote405 views3 answers
Linear gradient react native
Javascript React
0 vote383 views1 answer
Ui5 React bind element
Javascript React
3 votes364 views3 answers
Async await class component react
Javascript React
0 vote404 views2 answers
Barcode scanner react js
Javascript React
2 votes382 views2 answers
React native open gmail app
Javascript React
0 vote382 views1 answer
React native svg size
Javascript React
0 vote430 views1 answer
React locomotive-scroll
Javascript React
0 vote399 views1 answer
Npm react-native-async-storage
Javascript React
0 vote395 views1 answer
OAuth with axios react native
Javascript React
1 vote384 views1 answer
Parent to child react state
Javascript React