浏览器页面资源加载过程与优化
当浏览器截获到一个页面请求后,将会按照顺序做如下图所示的4件事:
(1) 首先会将所有需要加载的资源进行分类
(2) 然后根据浏览器相关的安全策略,来决定资源的加载权限(通过页面HTTP请求头的Content-Security-Policy字段来限制)
(3) 接着对各个资源的加载优先级进行计算和排序(核心)
(4) 最后一步,根据加载优先级顺序来加载资源
关键请求链:可视区域渲染完毕(首屏),并对于用户来说可用时,必须加载的资源请求队列,就叫做关键请求链
优化关键请求链方法:
利用LocalStorage来对部分请求的数据和结果进行缓存,省去发送http请求所消耗的时间,从而提高网页的响应速度
具体做法:对于缓存的JS文件要通过后缀来设置独一无二的版本标识,其次,每次后端需要传一份资源配置文件,前端会根据这个配置文件和LS中缓存的文件进行版本标识匹配,从而决定是利用LS缓存,还是重新发请求更新资源