关于性能优化与监控

170 阅读1分钟

针对页面加载与交互做性能监控 通过预渲染页面实现秒开,对网络,包体力,缓存,图片针对性优化 整体性能提升,对动画合成做优化,减少DOM回流、

  • 1 集中修改样式 (这样可以尽可能利用浏览器的优化机制, 一次重排重绘就完成渲染)

  • 2 尽量避免在遍历循环中, 进行元素 offsetTop 等样式值的获取操作, 会强制浏览器刷新队列, 进行渲染

  • 3 利用 transform 实现动画变化效果, 去代替 left top 的变换 (轮播图等)

    transform变换, 只是视觉效果! 不会影响到其他盒子, 只触发了自己的重绘

  • 4 使用文档碎片(DocumentFragment)可以用于批量处理, 创建元素