性能先锋
文章平均质量分 95
聚焦前端性能优化的各个方面,包括页面加载速度、渲染性能、内存管理等,分享实用的优化技巧、工具和实际案例,助力开发者打造高性能的前端应用。
鱼叔子
代码写得溜,bug 跑得快,工资涨得欢,钱包鼓得圆
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
《性能先锋——缓存策略》
浏览器的缓存机制也就是我们说的HTTP缓存机制,其机制是根据HTTP报文的缓存标识进行的,所以在分析浏览器缓存机制之前,我们先使用图文简单介绍一下HTTP报文,HTTP报文分为两种:HTTP请求(Request)报文,报文格式为:请求行 – HTTP头(通用信息头,请求头,实体头) – 请求报文主体(只有POST才有报文主体),如下图HTTP响应(Response)报文,报文格式为:状态行 – HTTP头(通用信息头,响应头,实体头) – 响应报文主体,如下图。原创 2021-12-16 15:31:04 · 262 阅读 · 0 评论 -
《性能先锋——内存泄露》
在硬件级别上,计算机内存由大量触发器组成。每个触发器包含几个晶体管,能够存储一个位。单个触发器可以通过唯一标识符寻址,因此我们可以读取和覆盖它们。因此,从概念上讲,我们可以把我们的整个计算机内存看作是一个巨大的位数组,我们可以读和写。这么底层的概念,了解下就好,绝大多数数情况下,JavaScript 语言作为一门高级语言,无需我们使用二进制进直接进行读和写。在计算机科学中,内存泄漏指由于疏忽或错误造成程序未能释放已经不再使用的内存。原创 2021-12-16 15:34:23 · 2219 阅读 · 0 评论 -
《性能先锋——v8垃圾回收机制》
引言 作为目前最流行的JavaScript引擎,V8引擎从出现的那一刻起便广泛受到人们的关注,我们知道,JavaScript可以高效地运行在浏览器和Nodejs这两大宿主环境中,也是因为背后有强大的V8引擎在为其保驾护航,甚至成就了Chrome在浏览器中的霸主地位。不得不说,V8引擎为了追求极致的性能和更好的用户体验,为我们做了太多太多,从原始的Full-codegen和Crankshaft编译器升级为Ignition解释器和TurboFan编译器的强强组合,到隐藏类,内联缓存和HotSpot热点代码收集等原创 2021-11-18 09:22:28 · 377 阅读 · 0 评论 -
《性能先锋——重排(reflow)和重绘(repaint)》
页面生成的过程: 1.HTML 被 HTML 解析器解析成 DOM 树; 2.CSS 被 CSS 解析器解析成 CSSOM 树; 3.结合 DOM 树和 CSSOM 树,生成一棵渲染树(Render Tree),这一过程称为 Attachment; 4.生成布局(flow),浏览器在屏幕上“画”出渲染树中的所有节点; 5.将布局绘制(paint)在屏幕上,显示出整个页面。 第四步和第五步是最耗时的部分,这两步合起来,就是我们通常所说的渲染。 渲染: 在页面的生命周期中,网页生成的时候,至少会渲染一次。在用原创 2021-12-03 09:30:50 · 1078 阅读 · 0 评论 -
《性能先锋——白屏》
前言 该篇文章会为您分享在前端性能优化中非常重要的一环-白屏时间,将从白屏时间的概念、重要性以及白屏的过程一一进行阐述,同时提供性能优化的策略与实践。 一、概念 白屏时间:即用户点击一个链接或打开浏览器输入URL地址后,从屏幕空白到显示第一个画面的时间。 白屏时间的长短将直接影响用户对该网站的第一印象。 二、白屏时间的重要性 当用户点开一个链接或者是直接在浏览器中输入URL开始进行访问时,就开始等待页面的展示。页面渲染的时间越短,用户等待的时间就越短,用户感知到页面的速度就越快。这样可以极大的提升用户的原创 2021-12-03 09:27:47 · 180 阅读 · 0 评论
分享