标签: 性能优化

[category_tags]
  • 一个关于网站的性能优化

    作者:

    ;发表于:

    收录一个学习笔记:


    可以通过以下三点来对网站的性能进行优化

    • 网站传输的优化
    • 网站体积的优化
    • 网站加载的优化

    一、网站传输优化策略

    • 加大网站本身的带宽(加钱)
    • 使用CDN加速静态资源(加钱)
    • 增加浏览器本地缓存时长(静态资源不用重复请求服务器)
    • 服务器升级到HTTP/2(可以并行处理资源请求)

    二、网站体积优化策略

    • 图片压缩
      • 把 jpg 和 png 的图片压缩为 webp 格式
      • 根据需要,还可以把图片质量可以调整到80%
    • 对于部署的代码文件进行压缩
    • 服务器开启支持 gzip 压缩传输功能

    三、网站加载优化策略

    • 延迟加载
      • 可以通过 html 自带属性 lazy
      • 在需要的地方手动添加懒加载功能
    • 按需加载
      • 访问具体页面加载对应页面的资源,避免加载所有资源文件
    • 分层加载
      • 使用低分辨率的缩略图进行加载,按操作等需求加载对应原始资源图
    • 预加载
      • 使用 prefect 进行预加载内容
    • 请求合并
      • 利用css雪碧图整合资源文件
      • 通过一些统一的 API 来一次性获取原本需要多个请求才能得到的内容

    网站性能分析工具

    • 浏览器自带的 Lighthouse
    • 其他一些免费的在线工具

    以上。

    来源:我救了个垃圾网站,速度提升了1500倍!