如何通过react lazyLoad减少首屏加载时间

React.lazy() 和 React.Suspense 可以用来实现代码分割，从而减少首屏加载时间。以下是使用这两个功能的基本步骤：

1. 首先，确保你的环境支持动态导入（dynamic imports），这通常需要使用较新的浏览器或通过 Babel 插件进行配置。
2. 对于要懒加载的组件，使用 React.lazy() 函数进行包装。这个函数接受一个函数作为参数，该函数应该返回一个Promise，解析为要懒加载的模块。例如：

import React, { lazy, Suspense } from 'react';

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

在这个例子中，OtherComponent 将在需要时才加载。

3. 使用 React.Suspense 包裹你的懒加载组件。Suspense 提供了一个挂载点，在组件加载过程中会显示一个 fallback UI（例如一个加载指示器）。例如：

function MyComponent() {
  return (
    Loading...