JS和CSS的压缩和混乱
1 .删除无效字符
2 .取消评论
3 .减少和优化代码语义
4 .代码优化(代码不易理解) )
图像相关优化子画面图svg webp png jpg图像压缩在线图像
静态资源通常需要多个cdn域名,因为浏览器对同时加载相同域名的数量有限制
CSS的link放在头上,js的脚本放在主体的最后
如果一次加载很多资源,可以懒惰地加载图像。 加载图像如果需要体验0毫秒响应,请使用预加载。 预加载有几种方法。 ajax请求/image load/img src display 3360 none Ajax通常存在域间问题。 由于所有资源文件都位于cdn中,因此将进行降级处理
由于重画和回流通常会影响性能,所以为了将频繁进行重画和回流的要素分层化,一般使用transform3360translatez(0)/will-change: transfrom的方法
layer不能滥用。 需要与实际的商业场景进行合作。 否则,过多的层会影响页面加载
根据业务情况使用浏览器的存储功能
1. cookie
2 .本地存储会话存储
3 .索引db
4.pwa服务工作器
服务工作器功能:
1 .阻止1. http请求可以在cookiestorage中创建静态资源缓存。 如果没有网络,还可以显示页面以创建脱机页面
2 .与主线程通信,用service worker执行费时的任务,执行完成后,将执行结果返回主线程,返回主线程页面时,可以通过客户端区分页面
-正在不断更新