以下是对前端性能监控的部分见解以及部分项目源码，欢迎一起讨论、交流。 页面的性能怎么衡量？首先我们需要知道一个页面从开始输入网址回车到完全呈现中间都干了什么。下面是一张完整的图，来分析一下： 简单来说，任何在浏览器中执行超过 50 ms 的任务，都是 long task。 lo…

优化用户体验质量一直都是web网站取得成功的关键。主要介绍 Google 提出的 core-web-vitals 三个核心 web 性能指标

前端的同学如果用 window.onerror 事件做过监控，应该知道，跨域的脚本会给出 "Script Error." 提示，拿不到具体的错误信息和堆栈信息。 这里读者可以跟我一起做一个实验，来深入了解这个事情。先做一下实验准备： 创建一个 Node APP，只做静态服务器，…

在制作帧同步游戏时,使用浮点数进行同步时是一种运气同步,因为误差积累和战斗时长会导致不同步,所以要使用定点数.JS上最受欢迎功能最全的定点数库是decimal.js.但是decimal虽然功能强大,计算精度高,但是性能低下.所以我使用了计算精度合适的乘除法方案.

几乎在每一本JS相关的书籍中，都会说JS是单线程的，JS是通过事件队列(Event Loop)的方式来实现异步回调的。 对很多初学JS的人来说，根本搞不清楚单线程的JS为什么拥有异步的能力，所以，我试图从进程、线程的角度来解释这个问题。 计算机的核心是CPU，它承担了所有的计算…

目标是写一个非常详细的关于diff的干货，所以本文有点长。也会用到大量的图片以及代码举例，一起来get吧。 先来了解几个点... 1. 当数据发生变化时，vue是怎么更新节点的？ 要知道渲染真实DOM的开销是很大的，比如有时候我们修改了某个数据，如果直接渲染到真实dom上会引起…

在工作中，有时会遇到需要一些不能使用分页方式来加载列表数据的业务情况，对于此，我们称这种列表叫做长列表。比如，在一些外汇交易系统中，前端会实时的展示用户的持仓情况(收益、亏损、手数等)，此时对于用户的持仓列表一般是不能分页的。 在高性能渲染十万条数据(时间分片)一文中，提到了可…

这段时间面试官都挺忙的，频频出现在博客文章标题，虽然我不是特别想蹭热度，但是实在想不到好的标题了-。-，蹭蹭就蹭蹭 :)

原本只想筛选下上面的那篇文章，在精简掉了部分多余且无用的工具函数后，感觉不够。于是顺藤摸瓜，找到了原地址： 30 seconds of code 然后将所有代码段都看了遍，筛选了以下一百多段代码片段，并加入了部分自己的理解。 另外，本文工具函数的命名非常值得借鉴。 1. 第一部…