前端技能优化4
前端性能优化
- 页面加载性能
- 秒开率:即一秒之内打开的用户占用户总量的百分比。
- 动画与操作性能 3.内存 电量消耗
技术方案划分
缓存
1.客户端控制的强缓存策略
降低请求成本
- http dns:由客户端控制,隔一段时间主动请求 DNS 获取域名 IP,不走系统的 DNS
- TCP/TLS 连接复用:由服务端升级到 HTTP2,尽量合并域名
减少请求数
- JavaScript css 打包到 html
- 用 JavaScript 控制图片异步加载和懒加载
- 小型图片使用 data-uri(base64)
减少传输体积
- 尽量使用 SVG/GRADIENT 等代替图片
- 根据机型和网络状控制图片清晰度
- 对低清晰度的图片使用锐化来提升体验
- 设计上避免大型背景
技术设计应该从业务角度考虑
工具链
- 工具体系的设计:1.初始化项目 2.运行和调试 3.测试 4.发布
持续集成
- 持续集成的目标:一是要及早集成代码形成可测试的版本,二是通过一定的测试来验证提交的代码的有效性。
搭建系统
- 大量紧急不重要的页面 抽象成一个需求 就是搭建一个快速实现大量页面的系统