前端统计指标概念

在一个 PV 周期内,如果发生过错误(JS Error),则此 PV 周期为错误样本。 错误率 = 错误样本量 / 总样本量 页面异常除了自动上报的 JS Error 外,也包括手动调用 error 方法上报的错误。 API 成功率 API 成功率 = 接口调用成功的样本量 / 总样本量 统计 API 成功率的样本除了自动上报的 AJAX 请求,还包括手动调用 API 方法上报 ...

前端资源懒加载和预加载

懒加载也叫延迟加载,指的是在长网页中延迟加载图像,是一种很好优化网页性能的方式。用户滚动到它们之前,可视区域外的图像不会加载。 优点 能提升用户的体验 减少无效资源的加载 防止并发加载的资源过多会阻塞 js 的加载 原理 首先将页面上的图片的 src 属性设为空字符串,而图片的真实路径则设置在 data-original 属性中, 当页面滚动的时候需要去监听 ...

JavaScript this 和对象原型

this 实际上是在函数被调用时发生的绑定,它指向什么完全取决于函数在哪里被调用。 函数调用时应用了 this 的默认绑定,因此 this 指向全局对象。如果使用严格模式(strict mode),那么全局对象将无法使用默认绑定,因此 this 会绑定到 undefined,需要注意的是指向与函数默认绑定与函数的定义位置是否是严格模式有关,与函数调用时是否严格模式无关。 绑定规则 ...

JavaScript call 和 apply 方法区别和使用场景

call() 方法在使用一个指定的 this 值和若干个指定的参数值的前提下调用某个函数或方法。 function.call(thisArg, arg1, arg2, ...) thisArg 可选参数,函数运行时指定的 this 值。需要注意的是,指定的 this 值并不一定是该函数执行时真正的 this 值,如果这个函数处于非严格模式下,则指定为 null 和 ...

JavaScript 数组乱序算法

var values = [1, 2, 3, 4, 5]; values.sort(function() { return Math.random() - 0.5; }); console.log(values); 使用默认 sort 方法,随机返回升序或降序排序,最终得到一个随机数组。 存在的问题 并非完美随机,如果以数组最后一个值出现的概率来讲,存 ...

跨域与同域策略

跨域:跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。 广义的跨域: 资源跳转:A链接、重定向、表单提交 资源嵌入:`、、、等 dom 标签,还有样式中background:url()、@font-face()` 等文件外链 脚本请求: js 发起的 ajax 请求、dom 和 j ...

JavaScript 函数防抖与函数节流

其概念其实是从机械开关和继电器的“去弹跳”(debounce)衍生出来的,基本思路就是把多个信号合并为一个信号。事件内的N个动作会变忽略,只有事件后由程序触发的动作有效。如果在间隔内触发的事件会取消上次事件,并等待是否间隔内还有事件触发,如果有则继续取消执行,如果没有则执行本次事件。 定时器 每次执行函数前,先清除上次的 setTimeout ,如果在间隔时间内没有再次触发事件 ...

CSS @font-face 使用

@font-face { font-family: "AiDeep"; src: url("./AiDeep.otf") format("opentype"); /* 错误的写法 */ /* src: url('./AiDeep.otf') format("otf"); */ font-weight: 600; font-style: normal; } `` ...