微信小程序现状发展，小程序性能监控平台有哪些

本文讲了微信小程序现状发展，小程序性能监控平台有哪些？

2018年，可以说是微信小程序真正爆发的一年，这我们只要从一些数据中就可见一斑。

截至目前，已上线的小程序超过了100万个，有超过150万的开发者加入到小程序的开发中来，小程序的火爆也衍生出5000多个第三方平台，每日人均打开小程序4次，2亿的小程序活跃用户人均打开小程序20个，拼多多借助小程序全年的GMV预计突破6000亿，花生日记小程序上线仅三个月用户数就突破百万。

小程序的出现，为企业与用户之间的沟通搭建了一条全新的渠道和行业生态，针对一些使用频率不高的产品以及一些小微企业来说，小程序相较于App，不需要同时维护iOS和Android两个开发团队，极大节省了研发成本，也十分有利于企业对行业的试水情况。

不知道大家在使用小程序的过程中有没有遇到这样的问题，选择一个分类按钮，按好几次才会有反应，页面在跳转的时候出现卡顿等等。以为是自己的手机问题，但是换其它的小程序后的体验就不会出现这样的情况，因此用户在使用小程序的过程中，如果出现了性能问题，用户有很大概率会选择直接退出，并且从此不再使用。

微信官方也注意到了小程序的应用性能问题，所以也推出了一系列的措施来针对小程序的性能问题进行监控，但是这些监控手段却无法真正达到问题根源，无法将性能问题细分，所以目前来说仍有以下几点限制：

• 有网络请求错误统计，但无法快速定位到服务端

• 有JS错误统计，但无法快速定位错误堆栈

• 无页面维度监控，无法知道用户打开页面的体验

• 无地域运营商监控，无法知道不同地域运营商下的小程序性能

• 页面退出率高，无法知道是否是性能导致的

微信小程序现状发展

在今年的微信公开课 PRO 上，微信小程序负责人曾鸣披露了2021年小程序的大盘数据。数据显示，2021年微信小程序 DAU（日活） 达到了 4.5亿+ 的规模，小程序开发者超过了 300 万。

随着小程序的高速发展，越来越多的重点业务以小程序的产品形态展示在用户面前。前端作为用户访问业务的直接途径，对用户体验的重要性不言而喻，若出现页面出错、卡顿、崩溃、损坏等页面异常情况，会直接影响用户体验，从而可能会影响企业品牌形象和经济收入。因此做好微信小程序监控显得如此重要。

前端监控的必要性

页面异常监测的必要性

• 前端用户环境复杂多变: 网络、浏览器、平台、机型、版本、ISP 等多个维度，导致定位问题难。

• 业务报错时无处可查，线上问题复现困难。

• 无法定位 API 或静态资源报错导致页面不可用。

页面性能监控的必要性

• 无法掌握用户访问前端页面整个过程的性能。

• 无法从不同维度对前端页面性能进行分析统计，以及数据支撑。

• 无法获取用户访问接口的性能和耗时 - 据统计，页面相应慢 1s，用户转化率下降 7%，用户访问量下降 11%，客户满意度下降 16%，打开一个页面超过 3s ，57% 的用户会放弃浏览。

用户体验分析

• 无法很好的量化用户体验数据。

• 需要获取用户行为数据，支撑运营策略以及产品优化方向。

小程序监控价值

小程序监控背景

小程序开发和 Web 端有一个比较明显的不同就是小程序相对于 Web 端来说更加的 “黑盒”，很多监控的 API 和 Web 端的区别是很大的，所以 Web 端的很多监控方式在小程序里面是不通用的（比如小程序一些特有的性能指标：启动耗时、JS 注入耗时、SetData 性能等），所以更加需要一套独立的全方位的监控体系。

小程序监控有哪些价值？

页面异常监控相关：

• 业务报错时随时可查，线上问题可根据信息快速复现，并解决。

• 小程序所有网络请求 API 报错自主上报，随时查询定位问题。

• 网络、浏览器、平台、ISP 等多个维度分析。

页面性能体验相关：

• 小程序启动相关性能一目了然。

• 小程序运行时性能数据一查便知。

• 网络请求耗时数据自动上报，可查询哪些接口耗时较长，针对性优化。

• 图片加载等静态资源耗时自动上报。

• 包下载耗时可以知道每个包的下载耗时。

用户体验分析相关：

• PV、UV 数据自动上报。

• 量化用户体验数据。

告警相关：

• 随时监测线上问题，发现问题及时解决，减少影响范围。

• 保证线上运行稳定。

• 

• 

• 一、小程序启动耗时

• 1) 用户首次访问或小程序同步更新时，命中环境预加载 2) 用户非首次访问，命中环境预加载 3) 用户非首次访问，未命中环境预加载

• 1、环境预加载

• 编辑切换为居中

• 添加图片注释，不超过 140 字（可选）

• 2、用户首次访问或小程序同步更新时，命中环境预加载启动流程

• 编辑切换为居中

• 添加图片注释，不超过 140 字（可选）

• 1) 资源准备

• 信息获取: 小程序的头像、昵称、版本、配置、权限等基本信息(同步请求、异步请求)

• 运行环境准备: 包括小程序进程、客户端原生部分的系统组件和 UI 元素（如 导航栏、tabBar 等）、渲染页面使用的 WebView 容器、开发者 JavaScript 代码的运行环境、小程序基础库, 由微信客户端控制，开发者目前无法直接进行优化

• 代码包准备: 从微信后台获取代码包地址，从 CDN 下载小程序代码包，并对代码包进行校验(同步下载、异步下载)

• 2) 小程序代码注入（逻辑层）

• 按顺序将小程序的配置和代码、插件或扩展库、开发者代码注入到 JavaScript 引擎中

• 3) 小程序代码注入（视图层）

• WXSS 和 WXML 会编译成 JavaScript 代码注入到视图层

• 4)  首页（初次）渲染

• 在逻辑层小程序代码注入完成后，小程序框架会根据用户访问的页面，进行页面组件树初始化，生成初始数据发送到视图层

• 5) 首屏内容展示

• 如果首页的主体内容依赖网络请求（例如 wx.request）等异步来源、需要等待网络请求异步返回后，调用 setData 进行页面更新，才能呈现真正的页面

• 代码中做统计上报, 可以依赖于getPerformance接口, 即采用appLaunch耗时, 包括代码包下载、js代码注入/执行、首页绘制、首页渲染等时间, 计算方式:

• 1) 起点为用户点击小程序图标，或小程序被拉起的时间；

• 2) 终点为首个页面 firstRender 结束时间。

• 3、官方建议标准

• 	安卓	ios
  需要下载或更新时	3.7s	1.8s
  使用本地代码包时	2.6s	0.9s

• 4、性能制约因素

• 平台: 不同平台下（安卓、iOS、PC 等）设备性能、操作系统、框架实现、优化方案存在较大差异，启动耗时也存在较大的差异。

• 下载比例: 代码包下载和更新都会显著影响小程序启动耗时，在其他流程耗时稳定的情况下，下载比例升高会影响大盘启动耗时。

• 入口页面：不同页面启动时，根据所在分包的不同，需要下载的代码包数量和大小和代码注入量都存在差异。不同页面渲染耗时也存在差异。

• 机型分布：启动耗时和设备性能有较强关联，不同小程序或使用场景用户群体的差异可能导致机型分布的差异，进而影响大盘启动耗时。

• 网络环境：网络环境主要影响网络请求的耗时，如小程序信息获取、代码包下载等。

• 场景/访问来源：不同场景下，用户访问的页面不同，新用户比例也有差异，对启动耗时会有一定影响。

• 首次访问用户比例：用户首次访问小程序时，需要完整的进行小程序信息准备、代码包下载的流程，代码缓存也需要重新生成，启动耗时会比非首次访问高。

• 小程序版本更新：小程序版本更新时，用户需要更新小程序信息和代码包，代码缓存也需要重新生成，启动耗时会出现上涨

• 页面复杂度: 页面的逻辑复杂程度、组件数量、结构复杂度等都会影响

• 5、为什么安卓和 iOS 的启动耗时差异那么大?

• 两个平台的设备性能、系统功能和启动流程实现存在一定差异：

• iOS 设备的平均性能要好于安卓；

• iOS 小程序和微信共用进程，而 Android 上小程序运行在独立进程，需要额外的进程创建和一些基础模块的初始化流程；

• iOS 上需要使用系统提供的 WebView 和 JavaScript Core，初始化开销几乎可以忽略；

• 安卓 UI 和系统组件的创建的开销远高于 iOS。

• 睿象云作为国内领先的应用性能管理服务提供商，专注于企业应用性能管理的服务于提升，此次于国内推出小程序应用性能监控解决方案，将专注于小程序的性能监控与优化，实时监控、发现小程序的网络请求错误、JS错误、页面延时等造成用户体验不好的问题，并指导快速定位问题根源所在。基于小程序核心性能指标来进行多维度打分，从而对小程序的性能问题进行可视化和数字化。

• 上文就是小编为大家整理的微信小程序现状发展，小程序性能监控平台有哪些。

• 国内(北京、上海、广州、深圳、成都、重庆、杭州、西安、武汉、苏州、郑州、南京、天津、长沙、东莞、宁波、佛山、合肥、青岛)睿象云智能运维平台软件分析、比较及推荐。