一、什么是页面的性能优化

什么是页面的性能? 看了很多文章,我觉得换言之,就是“速度”。

  • 页面加载的速度
  • 操作响应的速度
  • 动画的fps

    所以,上面就是我们的目标。

【使用缓存,将是提升加载速度最快的方式】

二、如何提升性能

2.1 页面加载

2.1.1 分析

从输入url,到见到页面是一个很长的链条。 先明白这个链条上有什么,可以方便我们“有针对性”地去优化

页面性能优化(更新中) - 图1
以上就是一些梳理的线条,我们可以直观地提出以下优化方案:

  • 让进程更快?=> 更好的电脑,更好的CPU
  • 让网络更快 => 合理分配强缓存、协商缓存
  • 让网络更快 => 用4G,啊不,5G!!
  • 让网络更快 => 让传输的文件更小
  • 让网络更快 => 让传输的文件更少
  • 让网络更快 => 让服务器离我们的所在地更近:CDN
  • 让网络更快 => 服务器做一些特殊处理,更快地处理、扩容等
  • 让网络更快 => 使用 HTTP2.0 代替 HTTP1.1
  • 让dns查询更快 => 保证dns有缓存,当空闲的时候偷偷发个请求?查一下DNS并记录

    2.1.1 用现有的软件技术实现

    2.1.2 通过更新软件技术来实现

    2.1.3 从设计的角度实现

    【有时候,看起来快,会欺骗人的眼睛】
    有时候,解决问题的方式;也许就是:

  • 加一个进度条

  • 加一个骨架屏
  • 加一些静态背景图片的平铺
  • 直接加一个项目,让项目A 跳转 项目B(也许它听起来很蠢,但确实有效)
  • 加一个loading

    2.1.4 通过增加硬件实现

    这个当然很明显是不现实的。

2.2 操作响应

2.2.1 分析

2.2.2 网页是否会随着时间自动变卡

2.3 动画FPS

三、建立性能标准

一个标准的建立,通常要听从多方的声音、要分析大量的数据。