与任何单页应用程序一样，所有内容都捆绑在一个文件中，如果不加以检查，该文件的大小会迅速增加。Webpack之类的工具可以帮助将此捆绑包拆分为更多可管理的块，然后可以根据需要进行请求。
由于React鼓励创建许多较小的组件，因此有很多打破捆绑的机会。该 反应可装载 封装使得组件来定义正是它需要呈现和的WebPack可以自动分割其束以适应此。
const LoadableButton = Loadable({
loader: () => import(‘./Button’),
loading: () => <div>Loading...</div>,
});可加载是一个HOC，它将动态导入组件所需的任何内容。它需要一些设置，例如在加载所有内容时显示的内容，这使其高度可定制。 然后，LoadableButton可以用作常规组件，而不会出现问题。
对于具有路由的大型应用程序，按路由而不是组件进行拆分可能会更有利。可以通过一个请求插入通用路径，并且可以帮助加快处理速度。在捆绑包的数量和它们的整体大小之间保持平衡非常重要，这将根据应用程序的需求而变化。
可在此处找到有关react-loadable的更多详细信息 。