阐明
前端优化波及到极致的用户体验,也是一个前端工程师内功是否深厚的体现,大抵从两个个层面记录下前端优化
编码层面
- 缩小冗余代码,组件化开发、函数式开发,从基本减小代码体积,减小申请服务压力
- 缩小实在的 dom 操作,操作实在的 dom 会触发浏览器的重排和重绘,这些都是影响性能的要害
- 缩小 http 申请的次数,每一次的服务申请都会三次握手四次挥手
-
启用 javascript 预加载(defer 和 async)属性触发
- defer 和 async 区别,defer 和 async 都会进行异步加载,区别在于 defer 会在 dom 加载实现后执行,async 是异步加载完间接执行
打包层面
- 将图片打包成 base64 格局
- 打包时进行压缩解决,
- 生产环境去除 srcMap
- 模块按需加载
- 启用 gzip 减速,大大减小申请资源的节约
- 生产去除 console
- 应用 DllReferencePlugin 将平时不常常变动的文件抽离进去,对立打包,这样也能够缩小后续打包的工夫。