性能 Trace 工具

基础库 1.70.0 今日头条 7.7.9 开始支持本功能

开发者可以在开发者工具 Trace Panel 中使用该功能分析小程序启动过程中的主要耗时。


使用方法

  1. 使用字节跳动开发者工具 1.9.5 或以上版本,打开 Trace Pannel,点击开始录制 trace1 trace1-2
  2. 使用今日头条 7.7.9 或以上版本扫描二维码,若连接成功提示设备已连接 trace2
  3. 点击结束录制 trace3

指标说明

指标

指标说明
小程序启动从小程序启动到小程序进入前台耗时
包下载小程序包下载耗时,若没有则表示使用本地缓存小程序包启动
加载 JSJS 文件加载耗时
处理首帧数据从渲染层获取首帧数据到开始渲染
执行渲染逻辑渲染层渲染首帧数据
setDatasetData 将数据从逻辑层发送到渲染层渲染,逻辑层和渲染层都有耗时
tt.requesttt.request 调用耗时
request callbacktt.request callback 执行耗时
生命周期App,Page,Component 的生命周期函数执行耗时
API 调用API 调用耗时
API 调用回调执行API callback 执行耗时

Args

参数类型说明
trace_idnumber数据追踪 id,用于匹配 setData 等异步 API 调用
methodstring方法名
datastringsetData 的 data
sizenumbersetData data 的字节长度
file_pathstring文件路径
urlstringtt.request url 参数
request_resultnumbertt.request 是否成功 1:成功 0:失败
meta_typenumbermeta 信息是否使用本地缓存 1:使用 0:不使用
pkg_typenumber小程序包是否使用本地缓存 2:使用本地包 1:使用断点续传:0:使用下载包
jsc_preload_successnumber逻辑层是否预加载
webview_preload_successnumber渲染层是否预加载

常见问题

1. 加载 JS 中 page-frame.js 和 path-frame.js 是什么?

小程序包中的文件是开发者小程序代码的编译产物,page-frame.js 主要是页面 ttml 转换成的 JS 代码,path-frame.js 主要页面 ttss 转换成的 JS 代码

2. 图中的空白表示什么?

空白是小程序 SDK 内部耗时,开发者无需关注

点击纠错