单页应用做按需加载的好处

Question

今天在网上看了一下前端优化的一些资料，突然对单页应用按需加载产生了疑惑。
首先，自己现在学习的一些框架类似angular、vue都是开发单页应用的，用的构建工具一般都是把第三方依赖打成一个js,自己的代码打成一个js,这两个js在首屏渲染的时候应该都会加载吧，这不就相当于全部加载了吗？为什么还要做按需加载呢？

Answer 1

简单的例子
你从A页面点击按钮B进入C页面；C页面的代码可以再点击按钮B时加载，然后加载完以后再切页面

Answer 2

用我的ng2+webpack项目为例，功能是分模块的，不同路由可以跳转到不同模块。不同的模块最终会被各自打包成一个单独的js文件而不是全部都压成一个文件，在加载时才会去请求对应的js文件，提高首页渲染速度。

Answer 3

如果这两个js过大，会影响首屏的加载速度，用户体验不好

Answer 4

主要是一个首屏加载问题，按需的话会降低首屏加载时间，如果所有代码在第一次进入的时候就加载完了，那首屏会很慢

Answer 5

单页应用第一次加载并不一定要全部加载，例如一些富文本编辑器，打包出来体积较大，如果首次就加载，可能会影响首屏的加载速度。类似富文本编辑器这种代码完全可以使用按需加载，只有在页面有使用到富文本编辑器时才去加载，加载的时候页面显示个loading效果，后面再访问也不用重新下载。

我自己用 react 写了个 cnodejs 的实现，就是这么打包的。

https://zhbhun.github.io/crea...