说一下前端的埋点与监控埋点收集用户行为数据前端插入代码或脚本的方式的捕获行为以下三种方式都是用户行为

埋点收集用户行为数据前端插入代码或脚本的方式的捕获行为以下三种方式都是用户行为的业务数据

手动埋点
自动埋点
可视化埋点

监控性能监控错误监控用户体验监控
在面试中通常会问首屏加载页面耗时资源请求回流与重绘

性能监控通常变现为首屏的加载页面交互等
用户体验监控系统Bug 性能优化等

页面加载时间的监控通过监听浏览器的load加载用performance.now() 获取加载时间

Api 的调用耗时请求发送前请求收到后只是监控浏览器的耗时

function apiPreformance(){
const start =performance.now()
fetch('https://api.imooc-web.lgdsunday.club//api/data-lazy/01').then((res)=> res.json())
then((data)=> {
const duration =performance.noy()-starttrackEvent('api _call',{
duration,
endpoint:
'https://api.imooc-web.lgdsunday.club//api/data-lazy/01
apiPreformance()

错误监控是项目中错误是非常常见的问题

接口请求错误同意的提示语在js中也可以直接 window.onerrow的方法去统一处理

自定义埋点上报(手动 ) 如监控 dom 移入与移除的时间监控

<style>
#sectionId {
width: 200px;
height:200px;
background-color:mantiquewhite;
</style>
</head>
<body>
<div id="sectionId">自定义埋点上报</div>
<script>
function trackEvent(eventType,details){console.log(`Event:${eventType}`,details)}

</script>

总的来说埋点与监控就是监听事件很好理解

说一下 前端的埋点 与 监控

说一下前端的埋点与监控