
浏览器
夏末勿殇
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
从渲染过程看待link和@import
前言在网上查看link和@import的区别的时候,可以搜到很多相关的文章,大致总结起来,其区别有3点,如下所示:1、原理不同:link是html的标签,必须写在 .html文件里面,@import是css的语法,需要写在style标签或者 .css文件里面。2、兼容性不同:link在所有的浏览器里面都兼容,而@import是css2.1引入的,所以一些低版本的浏览器无法兼容(ie6等)3、加载顺序不同:@import会比link加载慢(这是网上很多文章的观点)正文第1、2点没什么好说的,原创 2020-12-22 20:05:23 · 192 阅读 · 0 评论 -
性能优化之CSS
性能优化之CSS在浏览器渲染中,css的渲染过程会经历以下步骤:Recalculate Style --> Layout --> Paint --> Composite Layers中文意思就是:计算样式大小 --> 排布 --> 绘制 --> 组合层。知道了css的渲染过程有什么呢? 这对只能优化十分重要,从上面我们可以看出:一旦触发重排,必然会触发重绘,影响到组合层一旦触发重绘,就会影响到组合层。所以为了避免性能不好,我们需要尽量避免重排原创 2020-12-22 16:44:21 · 140 阅读 · 0 评论 -
浏览器的渲染过程
浏览器的渲染过程前言最近在面试的时候遇到了一个前端的优化问题,答得不好,回来之后,就想系统的学习一下,发现想掌握好性能优化,就必须了解好浏览器的整个渲染过程。所以需要先学习渲染过程,却发现网上的相关资料少的可怜,能找到的只有一张很常见的图和几句话:http解析器解析生成DOM树,css解析器解析css生成CSSOM,DOM树和CSSOM树结合生成Render Tree之类的话,完全get不到重点。在经过自己几天的努力之后,大致了解了其渲染过程。接下来,让我们一起来深入了解其渲染过程。渲染过程我原创 2020-12-20 17:32:41 · 200 阅读 · 1 评论