加入收藏 | 设为首页 | 会员中心 | 我要投稿 衡水站长网 (https://www.0318zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长资讯 > 评论 > 正文

详解H5性能优化秘诀

发布时间:2021-02-22 16:14:42 所属栏目:评论 来源:互联网
导读:start:blink内核开始创建请求的时间点, 可以理解为 0点 T0:blink收到http head的时间 T1:首屏有内容显示的时间 T2:首屏全部显示出来的时间 性能W3C指标 首屏时间是指页面第一屏所有资源完整展示的时间。这是一个对用户来说非常直接的体验指标,但是对于
  • start:blink内核开始创建请求的时间点, 可以理解为 “0”点
  • T0:blink收到http head的时间
  • T1:首屏有内容显示的时间
  • T2:首屏全部显示出来的时间

性能W3C指标

首屏时间是指页面第一屏所有资源完整展示的时间。这是一个对用户来说非常直接的体验指标,但是对于前端却是一个非常难以统计衡量的指标。

通常的做法是,domContentLoadedEventEnd - fetchStart,甚至使用 loadEventStart-fetchStart ,此时页面DOM树已经解析完成并且显示内容。以下给出统计页面性能指标的方法。

 

性能监控

线上监控对于数据摸底和发现问题意义重大,一般在测试阶段我们只能做到基本的分析,很难获得在不同环境下真实准确的数据,那怎么知道上线后性能是否有问题,或者怎么在出现问题苗头的时候,尽快的掐灭呢?实时线上监控是最优的选择。

岳鹰全景监控平台,可以将SDK采集上报的数据进行实时分析,可以很直观很方便的查看应用的性能指标。并且还能通过设置告警规则,当性能指标达到阈值的时候,及时通知,第一时间发现问题,及时处理。

实时大盘

通过实时大盘,初步了解性能波动情况。

 

性能优化思路

通过线上数据进行摸底分析之后,可以继续进行深入分析和优化。

1 优化方向

前端:前端围绕着优化首屏,收敛域名,js资源治理,js耗时治理,图片治理,接口治理等方向展开。

客户端:客户端围绕着提升容器启动速度,优化拦截逻辑,为前端提供预加载等各种能力,提供类原生体验等方向展开。

【干货预警】下面是我们在饿了么端H5优化专项中,整体的优化思路。


(编辑:衡水站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    热点阅读