企业微信群工具打开缓慢原因分析

群工具加载缓慢原因分析

1. 项目构建产物体积过大 ✅

   • 将依赖进行拆分,构建产物不会进行打包，部分依赖使用 cdn 去加载,

   • 打包产物使用 gzip 进行压缩处理

   • 将一些较大的包进行拆分单独加载

2. 静态资源阻塞加载 ✅

   • 静态资源进行预加载， 提升加载性能

   • dns 预解析，减少首个请求的 DNS 解析延迟

3. 路由拦截复杂处理 做了缓存处理 ❌

   • 接口需要登录，跳转 https://open.weixin.qq.com/connect/oauth2/authorize?appid= 换取 code, 然后进行登录

   • 页面需要对应的 jsapi 权限，初始化 jsapi，请求企业配置，初始化基础的 wx.config, 然后在初始化 wx.agentConfig

     • 先调用 wx.config，等待 wx.ready 后，再调用 wx.agentConfig。
     • 只有在 wx.config 成功后，agentConfig 才能成功。
     • wx.config: 基础通用 JS 能力（页面环境、菜单、地理位置等）。
     • wx.agentConfig: 仅某些应用能力需要，如企业会话、发送消息等与应用强关联的接口。

   • 耗时处理，企业相关配置做了缓存处理，读取缓存不会再次去请求配置信息

     • 经过排查发现，加载缓慢的原因在 wx.agentConfig
     • 如果登录失效或者首次登录，耗时比较长，需要走 1，2 配置，第二次进入时间缩短至 1s

企业微信 sdk 升级 ✅

1. 之前调用了俩个 cdn jweixin和wecom-jssdk,在进行初始化的时候进行了俩次初始化，一次是 wx.config（企业签名回调）, 一次 wx.agentConfig(应用签名回调)
2. sdk 进行升级，二合一，只需要初始化一次ww.register即可, 部分语法兼容，wx.invoke(xxx) 替换为 ww.xxx()，缩减初始化的时间(将近 1s 左右)。
3. 经过调整，加载时间 在 400ms 左右

总结

1. cdn 介入，构建产物体积缩小，生产环境体积在2.4M左右，部分资源预加载，缩短整体请求时间。

2. 微信 sdk 进行升级，缩短应用初始化配置的时间，有原来的1.5s 缩短至 300ms 左右

3. 缓存页面进入时间大约至 400ms左右，如果是缓存失效或者登录失效，加载的时间会延长