小程序开放平台

文档中心
基础
路由
跳转
转发
界面
网络
支付
数据缓存
媒体
位置
开放接口
设备
XHSML
性能
getPerformance
getEntries
getEntriesByName
getEntriesByType
getCurrentPageEntries
getEntriesByPage
mark
clearMarks
PerformanceEntry
createObserver
PerformanceObserver
第三方平台
文件
数据分析
画布

xhs.mark

开发
>
JS API
>
性能
>
mark
>
更新时间:2024-11-13 19:05:31

在性能缓冲区中使用给定名称添加一个 name 为 name 的性能数据。

语法

xhs.getPerformance().mark(name)

参数说明

name

类型
默认值
必填
说明
string期望标记的 name

常规用法

javascript
// 创建一些标记
xhs.getPerformance && xhs.getPerformance().mark("xhs-test");
xhs.getPerformance && xhs.getPerformance().mark("xhs-test");
xhs.getPerformance && xhs.getPerformance().mark("xhs-test-2");
xhs.getPerformance && xhs.getPerformance().mark("xhs-test-2");
xhs.getPerformance && xhs.getPerformance().mark("xhs-test-3");
xhs.getPerformance && xhs.getPerformance().mark("xhs-test-3");

// 获取所有的 PerformanceMark 条目
const allEntries = xhs.getPerformance && xhs.getPerformance().getEntriesByType("mark");
console.log(allEntries.length); // 6

// 获取所有的名为 "xhs-test" PerformanceMark 条目
const xhs-testEntries =
  xhs.getPerformance && xhs.getPerformance().getEntriesByName("xhs-test");
console.log(xhs-testEntries.length); // 2

// 删除所有标记。
xhs.getPerformance && xhs.getPerformance().clearMarks();

console.log(xhs.getPerformance && xhs.getPerformance().getEntriesByType("mark")); // 0

利用 mark 统计、上报 FMP 指标

// 假设 FMP 依赖某个接口的数据,接口返回数据后 setData 更新页面后上报 FMP
Page({
  data: {
    pages: [],
  },
  onLoad() {
    xhs.request({
      url: `${developer_api_url}`,
      success: (res) => {
        this.setData(
          {
            pages: res.data,
          },
          () => {
            // 统计 FMP
            xhs.getPerformance && xhs.getPerformance.mark("FMP");
          }
        );
      },
      fail: (err) => {},
    });
  },
});