Lazy Loading Components with TanStack Router

Provide an example of how to lazily load components in routes to optimize performance and speed up initial application load.
import { lazy, Suspense } from 'react';
First, import lazy and Suspense from React to enable lazy loading and handling of the loading state.
const LazyComponent = lazy(() => import('./LazyComponent'));
Define a lazy component using React.lazy(), which dynamically imports the component. This means the component will only be loaded when it's needed.
const router = createBrowserRouter([
    path: '/lazy',
    element: (
      <Suspense fallback={<div>Loading...</div>}>
        <LazyComponent />
Configure TanStack Router with a route for the lazy component. Wrap the LazyComponent with Suspense and provide a fallback UI to display while the component is being loaded.