使用 Chrome Devtool 进行性能分析时,在 Performance 面板上,可以看到用绿线标出来的 First-Contentful-Paint
。浏览器何时进行首次渲染?网上只能查到一些模棱两可的资料,今天我们来探究这个问题。
单页应用性能的最大痛点就是 bundle 体积大导致首屏时间过长。使用 webpack 的 code splitting
(代码分割)功能可以将 bundle 分片,加速首屏,但之后的交互势必会受到影响。预加载分片 thunk 是必需的,本文探讨最理想的预加载手段。