前端性能优化(学习笔记)

1. 原则

  • 多使用内存,缓存或其他方法
  • 减少CPU计算,减少网络请求
  • 减少I/O操作(硬盘读写)

2.加载优化

  • 静态资源的合并和压缩
  • 静态资源缓存(浏览器缓存策略)
  • 使用CDN让静态资源加载更快

3. 渲染优化

  • CSS放head中,JS放body后
  • 图片懒加载
  • 减少dom操作,对dom做缓存(缓存DOM,先赋值给变量,在进行遍历)
  • 减少DOM操作,多个操作尽量合并在一起执行(添加DOM节点时,统一添加进入)
  • 事件节流(监听改变事件,无操作一定时间后执行操作,不用每次出发,用于触发频率较高的事件,设定一个缓冲触发事件)
  • 尽早执行操作DOMContentLoaded

题外tip:
异步操作的模式:回调函数,事件监听,发布订阅

引用:别人的一些前端优化总结

Vue学习
typescript学习
leetcode解析题目
面试常被问到的小程序问题
服务端渲染SSR
掘金小册
在浏览器地址栏输入URL,按下回车后究竟发生了什么?

你可能感兴趣的:(前端性能优化(学习笔记))