美文网首页
DOM的回流和重绘Repaint&Reflow

DOM的回流和重绘Repaint&Reflow

作者: 疯狂的蜗牛Dianna | 来源:发表于2020-05-10 20:32 被阅读0次

重绘: 元素的样式改变(但宽高、大小、位置不变)

如outline,visibility,color,background-color

回流: 元素的大小或者位置发生了变化(当页面布局和几何信息发生变化的时候),触发了重新布局,导致渲染树重新布局和渲染

如添加或删除可见的DOM元素;元素的位置发生变化;元素的尺寸发生变化;元素的内容发生变化(比如文本变化或图片被不同尺寸的图片替代);页面一开始渲染的时候(这个无法避免);因为回流是根据视口大小来计算元素的位置和大小的,所以浏览器的窗口尺寸变化也会引起回流...

注意:回流一定会触发重绘,重绘不一定会触发回流。

相关文章

  • DOM的回流和重绘Repaint&Reflow

    重绘: 元素的样式改变(但宽高、大小、位置不变) 如outline,visibility,color,backgr...

  • 重绘和回流(repaint&reflow)

    重绘 由于节点的几何属性发生改变或者由于样式发生改变而不会影响布局的,称为重绘,例如outline, visibi...

  • DOM树 CSS树 render树 以及JS的加载

    回流和重绘回流一定会引起重绘而重绘可以单独触发 例如修改背景颜色 字体颜色等...引起回流的因素:1.DOM节点 ...

  • 2020前端面试问题及答案整理

    css的重绘与回流 重绘:当节点需要更改外观而不会影响布局。 回流:DOM结构的修改引发DOM几何尺寸变化的时候,...

  • 公开课二、浏览器渲染原理之DOM的重绘和回流 ------ 20

    1、定义: 2、基于DOM的重绘和回流之前端性能优化:

  • 怎样区分页面的回流和重绘

    一、什么是回流和重绘 引起DOM树结构变化,页面布局变化的行为叫回流,且回流一定伴随重绘。只是样式的变化,不会引起...

  • 面试

    1. css的重绘与回流 重绘:当节点需要更改外观而不会影响布局。回流:DOM结构的修改引发DOM几何尺寸变化的时...

  • 回流与重绘

    回流一定会触发重绘回流: DOM结构的增删改重绘: 颜色,背景, 字体等视觉上页面的改变 重绘不一定触发回流 如何...

  • 重绘和回流

    重绘: 只是样式的变化,不会引起DOM树变化,页面布局变化的行为叫重绘,且重绘不一定会伴随回流。 回流: 引起DO...

  • 前端面试题总结

    1.请介绍下回流和重绘 回流:当我们对DOM的修改引起了DOM几何尺寸的变化(比如修改宽高和隐藏元素)时,浏览器需...

网友评论

      本文标题:DOM的回流和重绘Repaint&Reflow

      本文链接:https://www.haomeiwen.com/subject/sclsnhtx.html