带你读《2022技术人的百宝黑皮书》——APM 页面加载耗时校准（6）https://developer.aliyun.com/article/1340938?groupCode=taobaotech
从1到2：H5 的标准
在 H5 等场景下，WebView 的进度条并不一定代表真实的加载进度，导致 APM 的页面加载无痕算法在 H5 场景下准度很差。为此，我们引入 JSTracker （前端框架层）进行计算，与此同时，在 Android 中，UC 内核自主计算的可视时间也被引入其中。
UC 内核计算的可视时间原理又是什么呢？在页面加载的过程中，记录所有的渲染帧，在页面加载结束之后，回溯检查每一帧，图片渲染面积首次达到最大值的那一帧记为可视时间，而 JSTracker 计算原理类似，不同的是， JSTracker 是在前端框架层进行计算。
前端自定义终点
除了 JsTracker/T2 的页面加载终点之外，还有没有其他办法来体现自身业务的自定义页面加载终点呢？有的。APM 与前端框架定下了此规范。
对于前端 H5 来说，如果需要自定义页面终点，首先需要通过一种方式告诉容器，自身是需要自定义终点的，告诉的方式就是：增加 APM 规定的 HEADER 标签。
容器读取到了这个 HEADER 标签，表明当前 H5 页面遵守规范，需要自定义终点，将会通过 APM 提供的JSBridge 提供页面加载的终点。此外，APM 也提供埋入参数和阶段数据的 JSBridge。
在大促会场场景下，使用此方案支持了性能优化结果产出，其产出的结果中，除了页面可视之外，还包括秒开率， 系统耗时，H5 容器框架耗时，前端耗时等指标，结合 AB 产出对比数据结果，同时结合设备分级数据细化在不同手机等级下的数据。
带你读《2022技术人的百宝黑皮书》——APM 页面加载耗时校准（8）https://developer.aliyun.com/article/1340936?groupCode=taobaotech
