如果你项目中使用webpack或rollup进行打包,随着工程项目的增长和大量三方库的引入,打包后文件的体积将会逐渐变大。那么当用户进入应用时,用来加载这些文件的时间会越来越长,并且很有可能这些文件中的某些内容是他们并不需要的。我们可以使用code-splitting这项技术来分割代码,暂时剔除在刚进入应用时并不需要的那部分内容,仅加载所需要的关键代码。这能够显著地提高应用的首屏渲染性能。需要注意的一点是,code-splitting并不一定能够减少应用整体的代码体积,但可以尽可能地避免加载不需要的代码。React在16.6.0版本后,为开发者带来了lazy和Suspense,帮助我们实现代码延迟加载的效果。讲师介绍杜斌,前端工程师,现在就职于字节跳动。内容看点React.lazy加载组件Suspense组件路由如何延迟加载组件?