- 博客(7)
- 收藏
- 关注
RSS订阅原创 管理浏览器内存：前端性能优化的关键战场
预防优于治疗：在架构设计阶段考虑内存生命周期量化监控：建立自动化内存监控体系渐进优化：优先解决 20% 导致 80% 问题的关键泄漏点“内存如同数字时代的空气，当它存在时无人注意，一旦耗尽系统即刻窒息。” —— Brendan Eich（JavaScript之父）通过本文的深度优化策略，您的应用内存占用可降低 40% 以上。真正的性能高手，不仅能让代码运行更快，更能让内存如溪流般清澈流动。某金融仪表盘应用实施上述策略后：内存峰值下降 65%（从 1.8GB → 620MB）
2025-07-04 16:16:03
445
原创 vue3代码格式化
eslint针对的是javascript，他是一个检测工具，包含js语法以及少部分格式问题，在eslint看来，语法对了就能保证代码正常运行，格式问题属于其次；基于上面的痛点，lint-stadge 就出现了，它的解决方案就是只检查本次提交所修改(指 git 暂存区[5]里的东西)的问题，这样每次 lint 量就比较小，而且是符合我们的需求的。可格式化css代码，检查css语法错误与不合理的写法，指定css书写顺序等。需要注意的是类型的后面需要用英文的 :，并且冒号后面是需要空一格的，这个是不能省略的。
2025-06-24 10:11:15
984
原创 浏览器页面渲染机制
注意：渲染过程中，如果遇到 script标签就停止渲染，执行 JS 代码。因为浏览器渲染和 JS 执行共用一个线程，而且这里必须是单线程操作，多线程会产生渲染 DOM 冲突。JavaScript的加载、解析与执行会阻塞DOM的构建，也就是说，在构建DOM时，HTML解析器若遇到了JavaScript，那么它会暂停构建DOM，将控制权移交给JavaScript引擎，JavaScript引擎运行完毕，浏览器再从中断的地方恢复DOM构建。JS文件不只是阻塞DOM的构建，它会导致CSSOM也阻塞DOM的构建。
2024-12-26 11:24:50
704
原创 使用浏览器Memory查看内存占用情况
打开控制台上的Memory面板或者按住F12打开。选择堆快照类型。我一般是使用前两种：Heap snapshot(JS堆快照)和Allocation instrumentation on timeline(JS堆分配时间线)。开始录制前先点击下垃圾回收–>点击开始录制。如果JS堆内存动态分配时间线，结束之前要再点击下垃圾回收，再结束录制。
2024-12-13 15:19:21
7244
原创 event loop
栈中的代码调用某些 api 时，当满足触发条件后（如 ajax 请求完毕，setTimeout计时结束）就将这些事件的回调函数加入到任务队列中。:等待有结果后将注册的回调函数,放到任务队列中,等主线程空闲时(执行栈清空),将任务队列插入到执行栈中;执行完毕后再次读取任务队列中的事件并将其添加到执行栈中执行，如此形成事件循环。分为主线程和调用栈(执行栈),所以的任务都会放在执行栈中等待主线程执行。在JavaScript中，所有任务可以分为两种，一种是。任务分为两种,一种宏任务,一种微任务。
2024-11-07 22:31:09
461
原创 JS计算小数点精度丢失问题
由于小数转二进制是，将十进制中的小数部分乘以 2 作为二进制的一位，然后继续取小数部分乘以 2 作为下一位，直到不存在小数为止。话不多说，我们就以8.625转二进制作为例子，直接上图：最后把「整数部分 + 小数部分」结合在一起后，其结果就是1000.101。但是，并不是所有小数都可以用二进制表示，前面提到的 0.625 小数是一个特例，刚好通过乘 2 取整法的方式完整的转换成二进制。如果我们用相同的方式，来把0.1转换成二进制，过程如下：可以发现，0.1的二进制表示是无限循环的。。
2023-04-07 16:05:58
1983
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人