弱网优化方向

架构 刘宇帅 2年前 阅读量: 1056

减小大小

  1. 接口
    1. 只返回必须字段
    2. 更小的编码方式(protobuf)
    3. gzip
  2. 图片
    1. 更小体积的图片格式(webp、avif)
    2. 按设备返回对应分辨率的图片
    3. gzip压缩
    4. 制定不同位置的图片的大小规范,并严格执行
  3. 其他资源(js、css、字体)
    1. 代码压缩
    2. gzip
  4. cookie
    1. 梳理并减少cookie大小

减少次数

  1. 合并请求
    1. 接口(API最好统一支持多接口合并请求的结构)
    2. 图片(雪碧图)
    3. js
    4. css
    5. 梳理删除重复的请求
  2. 按需请求
    1. 接口
    2. css
    3. js
  3. 缓存
    1. 本地缓存

减少请求时间

  1. 传播速度
    1. 阿里云全站加速(智能路由,接口加速)
    2. 自建:智能DNS+分布式节点+专线
  2. 接口响应时间优化(这个不是弱网之间相关的一个优化点,但是在弱网情况下如果接口很慢的话,整体的体验会更加糟糕)

减少传播距离

  1. CDN
    1. 图片
    2. css
    3. js
    4. 字体
  2. 多地部署+智能DNS

传输协议优化

  1. http2.0
  2. QUIC
  3. https 可升级到TLS 1.3

前端架构

  1. 预渲染
  2. SSR
  3. 单页应用

展现

  1. 骨架屏
  2. 离线缓存
  3. 交互细节
    1. 减少loading
    2. 先在页面响应,再在后台请求接口,如果错误再回滚逻辑
  4. 图片渐进显示

提示

功能待开通!


暂无评论~