首屏优化,减少白屏时间

1.加速或减少HTTP请求损耗:使用CDN加载公用库,使用强缓存和协商缓存,使用域名收敛,小图片使用Base64代替,使用Get请求代替Post请求,设置 Access-Control-Max-Age 减少预检请求,页面内跳转其他域名或请求其他域名的资源时使用浏览器prefetch预解析等;

2.延迟加载:非重要的库、非首屏图片延迟加载,SPA的组件懒加载等;

3.减少请求内容的体积:开启服务器Gzip压缩,JS、CSS文件压缩合并,减少cookies大小,SSR直接输出渲染后的HTML等;

4.浏览器渲染原理:优化关键渲染路径,尽可能减少阻塞渲染的JS、CSS;

5.优化用户等待体验:白屏使用加载进度条、loading图、骨架屏代替等;

你可能感兴趣的:(前端,javascript,缓存)