从前端程序员的视角看小程序的稳定性保障

时间 2019-12-01

原文原文链接

当咱们谈业务稳定性的时候，一般是指后端工程师从架构的角度来看的，例如限流和降级、流量调度、业务开关、容量压测等，但监控也是整个业务稳定性建设中不可或缺的一环，例如对业务和前端的监控，以保证出现问题的时候，能够第一时间找到根因所在。今天，咱们就结合小程序的场景，来看看如何作好小程序的监控。html

小程序与 H5 的不一样

小程序和 H5 都属于移动端场景下的技术选择方案，那么这里介绍一下小程序与 H5 的不一样。前端

一、运行环境的不一样web

传统的 H5 的运行环境是浏览器，包括 webview，其中浏览器提供 window、document 等 BOM 对象；
小程序的逻辑层和渲染层是分开的，逻辑层运行在 JSCore 中，并无一个完整的浏览器对象，因此缺乏相关的 DOM API 和 BOM API。

二、开发成本的不一样数据库

H5 的开发，涉及到开发工具、前端框架、模块管理工具、任务管理工具、UI 库的选择、接口调用工具及浏览器兼容性等；
小程序的开发，指定环境的小程序会提供开发者工具、API 及规范的开发标准。因为小程序是跑在指定的环境下的，同时 API 是指定环境下提供的，因此不用考虑浏览器的兼容性。

在 H5 开发中，前端经常使用的 HTML/CSS 在不一样的小程序中都有指定的文件标准。例如：npm

在微信小程序中使用 WXML/WXSS；
在支付宝小程序、钉钉 E 应用中使用 AXML/ACSS；
在百度智能小程序中使用 SWAN/CSS；
......

开发规范在指定的官方文档中都会有明确的使用介绍，使用方法与原来 H5 的开发大同小异，因此上手开发相对容易。小程序

三、使用体验的不一样后端

H5 页面须要在浏览器中渲染，在复杂的业务逻辑或者丰富的页面交互时会有卡顿状况；
小程序除首次使用略慢，页面切换及跳转等很是顺滑，接近 Native。

经过以上几点小程序和 H5 的不一样的介绍，咱们能够发现原来针对 H5 页面的监控没法直接监控小程序；同时因为小程序封闭性较强，不一样的小程序在标准上也略有不一样，如微信小程序、支付宝小程序及钉钉 E 应用等等小程序在使用标准及开放的 API 方面也会有一些差别，因此针对小程序的监控与针对 Web 应用的监控会有所不一样。微信小程序

小程序监控的现状

如今针对小程序监控的大概分为如下几类：浏览器

一、小程序的数据统计分析，助力小程序运营前端框架

相关产品: 微信小程序助手、阿拉丁小程序统计平台等；
特色：大部分是针对微信小程序提供相应的数据统计分析能力，从多维度分析小程序相关用户数据，适用于小程序运营，但缺少对于用户体验，小程序性能的监控。

二、小程序错误监控

相关产品: FunDebug 等；
特色：监控小程序使用户出现的错误，帮助开发者发现并解决小程序错误，但缺少对于小程序全局性能的监控，对于缓慢请求，缓慢页面无法监测。

三、小程序性能监控

相关产品: FrontJS、听云小程序监控等；
特色：主要提供性能相关数据，包括 JS 错误、网络请求响应状况等。可是只支持微信小程序，并且没有办法把小程序的性能与后台应用的性能关联起来，无法造成端到端的监控。

经过上面对现有的小程序监控产品分析，存在如下问题：

没法支持全部的小程序监控，主要支持微信小程序；
支持多类小程序监控的产品，提供的小程序相关数据较少，主要集中在错误监控；
没有后台应用服务的性能监控，没法从小程序上的性能问题追溯到后台应用代码和数据库，没法造成端到端的监控。

基于以上状况，阿里云 ARMS 前端监控重磅推出小程序监控，旨在帮助端到端的快速定位小程序问题，提高小程序的用户体验。

小程序监控提供的能力

阿里云 ARMS 前端监控这次重点推出的小程序监控有如下特色：

一、覆盖各种符合标准规范的小程序
首先解释一下这里所说的"标准规范的小程序"，即包含 App 和 Page 两层:

App 用来描述总体程序，包含: onError 事件；
Page 用来描述各个页面，包含: onShow、onHide、onUnload 事件。

小程序的运行环境依赖于对应的客户端，各种小程序的 DSL 设计看起来很像，但细节上的差异仍是比较多，而且已有了分化的趋势。在这种状况下，阿里云 ARMS 前端监控为了更好的支持小程序的监控诉求，提供如下小程序监控的场景：

微信小程序
支付宝小程序
钉钉 E 应用
其余类别小程序

因为小程序发展迅速，如今没法针对各种小程序都提供对应的监控 SDK，因此不属于微信小程序、支付宝小程序和钉钉 E 应用的小程序可选择其余类别小程序的场景接入进行监控，但要知足上面说的"标准规范的小程序"前提，同时支持 npm 包。

二、完善的性能监控指标
基础业务指标，帮助了解小程序应用的使用状况：

应用总 PV/UV
页面维度的 PV/UV

小程序各维度指标：

手机型号
操做系统版本
微信 / 支付宝等相应的 APP 版本
网络等

JS 错误分析：

JS 错误率、错误聚类、JS 错误堆栈及错误定位等

API 请求追踪：

API 请求成功率、API 请求耗时及 API 请求的链路追踪
自定义事件统计
支持业务上自定义事件 sum/avg 统计

三、可经过配置选择上报方式
因为业务方使用监控的诉求不一样，咱们不只支持优雅的静默数据上报，也支持使用开放的统计能力进行自定义上报。具体可查看官网的前端监控接入概述中的小程序场景相关文档：

https://help.aliyun.com/document_detail/106086.html

总结

小程序做为各大互联网公司重磅加持的方向，将来小程序的应用数量会愈来愈多，那么对于用户体验方面的关注与提高诉求也会不断增长，阿里云 ARMS 前端监控提供的小程序监控可帮助客户实时监控发现质量问题，为企业的小程序的稳定运行提供坚实的保障。

#阿里云开年Hi购季#幸运抽好礼！
点此抽奖：https://www.aliyun.com/acts/product-section-2019/yq-lottery?utm_content=g_1000042901

原文连接本文为云栖社区原创内容，未经容许不得转载。