随笔分类 - 性能优化
前端性能优化的方案
摘要:一、前端快照 1、为什么需要前端快照? 当用户浏览应用时,快速加载和展示页面,可以缩短白屏时间; 2、前端快照的基本原理 保存页面的DOM结构和状态信息 3、获取页面快照 在需要获取快照的时候,获取当前页面的html和状态 const snapShot = { html: document.docu
阅读全文
前端埋点数据上传方式
摘要:数据埋点 数据采集领域的术语,指的是针对用户行为或特定事件进行捕获、处理和发送的相关技术及其实施过程,是对特定事件或者用户行为的数据监控和数据上传。 数据类型 我们从三个维度出发去监控一个项目,即系统所面向的某一个主体,系统单个局部面向使用不同使用主体的差异的情况监控,系统面向运行过程的总体统筹监控
阅读全文
前端性能监控 + 性能指标计算方式
摘要:前言 一. 性能指标介绍 1.1 单一指标介绍 1.2 指标计算 Redirect(重定向耗时) AppCache(应用程序缓存的DNS解析) DNS(DNS解析耗时) TCP(TCP连接耗时) TTFB(请求响应耗时) Trans(内容传输耗时) DOM(DOM解析耗时) 1.3 FP(first
阅读全文
前端监听异常报错 + 上报方式
摘要:异常分类 页面js报错 ajax请求异常 页面资源加载异常(如:如图片或脚本) promise异常 iframe加载异常 页面崩溃和卡顿异常 常见的try catch 不能捕获异步的错误。比如这个setTimeout内部的错误捕获不到 try-catch 是用来在可预见情况下监控特定的错误 try
阅读全文