浏览器的回流和重绘

此博客主要围绕浏览器的回流和重绘展开。回流和重绘是浏览器渲染机制中的重要概念,了解它们有助于优化网页性能,提升用户体验。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、浏览器把获取到的HTML代码会解析成一个DOM树,HTML中的每一个元素都是DOM树的一个节点,根节点也就是我们长用的document对象

     2、当渲染树中的一部分或者全部因为元素的尺寸、布局、隐藏等改变而需要重新构建的时候,这时候就会发生回流。每个页面都至少发生一次回流,也就是页面第一次加载的时候。在回流的时候,浏览器会使渲染树中受到影响的元素部分失效,并重新绘制这个部分的渲染树,完成回流以后,浏览器会重新绘制受到影响的部分元素到屏幕中,这个过程就是重绘

     3、当渲染树中的一些元素需要一些更新属性的时候,而这些属性只会影响外观、风格、而不影响布局的就成为重绘

     从以上的概念中可以得知:回流必定发生重绘。但是重绘不一定引起回流
     

     简单的说回流会导致页面的重排,这样会严重影响性能


什么时候会发生回流?
     1、添加或者删除可见的DOM元素的时候

     2、元素的位置发生改变

     3、元素尺寸改变

     4、内容改变

     5、页面第一次渲染的时候


单例模式:保证系统中,使用该模式的类只有一个实例

 

 

转载于:https://www.cnblogs.com/manban/p/10895990.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值