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

4747 640 2023-07-11

本站部分文章、图片属于网络上可搜索到的公开信息,均用于学习和交流用途,不能代表睿象云的观点、立场或意见。我们接受网民的监督,如发现任何违法内容或侵犯了您的权益,请第一时间联系小编邮箱jiasou666@gmail.com 处理。

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

image.png

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

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

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

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

image.png

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

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

  • 有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错误、页面延时等造成用户体验不好的问题,并指导快速定位问题根源所在。基于小程序核心性能指标来进行多维度打分,从而对小程序的性能问题进行可视化和数字化。

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

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

上一篇:Zabbix + Cloud Alert 实践分享
下一篇:无需二次开发,Cloud Alert 快速衔接您的IT事件和钉钉通知
相关文章

 发表评论

暂时没有评论,来抢沙发吧~