Skip to content

性能优化

参考

前言

在项目开发过程中,任何一个细节都有可能影响网站的访问速度,如果不了解性能优化知识,很多不利网站访问速度的因素会形成累加,从而严重影响网站的性能,导致网站访问速度变慢,用户体验低下,最终导致用户流失。

目标

让你的网站访问速度飞起来,性能体验留住你的客户。让你面试披荆斩棘,收获各大厂心仪offer,废话不多说,直接开整。

优化方案

  • 感知性能优化
    • loading
    • 骨架屏
  • HTML优化
    • 压缩 HTML
    • 删除不必要的注释
    • 删除不必要的属性
    • 使用语义化标签
    • 减少iframe数量
    • 削减DOM数量和层级数量
    • 减少 HTTP 请求次数
    • 减少重排重绘
  • JavaScript优化
    • javascript脚本放到页面底部
    • 将javascript和css从外部引入
    • 删除重复的脚本
    • 减少DOM访问
    • 节流与防抖
    • 合理的ajax恳求
    • 长列表虚拟滚动优化
    • 代码结构的优化
  • Css优化
    • 尽量少用@import
    • 避免!important,可以选择其他选择器
  • 图片优化
  • webpack构建优化
  • 资源加载优化
  • 浏览器缓存策略
  • 服务器优化

性能测试网站推荐:

感知性能优化

创作不易请尊重他人劳动成果,未经授权禁止转载!
Released under the MIT License.