埋点上报
统计页面加载时间
performance.timing 是旧标准,目前已废弃、PerformanceNavigationTiming(新 API)
- performance.timing由于统计的精度不够准确,因此有了新的api
- 使用Performance API
const timing = performance.timing;
domLoadedTime = timing.domContentLoadedEventStart - timing.navigationStart
- 新api
window.addEventListener('load', () => {
const entry = performance.getEntriesByType('navigation')[0];
const domLoadedTime = entry.domContentLoadedEventEnd - entry.startTime;
console.log('DOM Loaded Time:', domLoadedTime);
});
统计用户停留页面时间
- 进入页面时记录时间 → 离开时计算差值 → 上报
vue例子
-
进入页面时记录时间统计:onMounted页面加载时候
-
离开页面时间统计:onBeforeRouteLeave
-
用户停留时间:上报api的当前时间 - 进入页面时间