美文网首页
什么是重排和重绘?

什么是重排和重绘?

作者: Tz1314 | 来源:发表于2019-08-13 19:55 被阅读0次

重排和重绘的概念:

重排:部分渲染树(或者整个渲染树)需要重新分析并且节点尺寸需要重新计算。这被称为重排,注意这里至少会有一次重排——初始化页面布局。

重绘:由于节点的几何属性发生改变或者由于样式发生改变,例如改变元素背景色时,屏幕上的部分内容需要更新。这样的更新被称为重绘。

什么情况下会触发重排和重绘:

添加、删除、更新DOM节点;

通过display:none隐藏一个DOM节点,触发重排和重绘;

通过visibility:hidden隐藏一个DOM节点,只触发重绘,因为没有发生几何变化;

移动或者给页面中的DOM节点添加动画;

添加一个样式表,调整样式属性;

用户行为,例如调整窗口大小,改变字号,或者滚动;

相关文章

  • 浏览器重排(回流)重绘以及优化方案

    一、什么是重排和重绘 要说清重排(reflow)和重绘(repaint),首先要理解排列和绘制,浏览器渲染页面时,...

  • 什么是重排和重绘

    1、什么是重排和重绘 浏览器下载完页面中的所有组件——HTML标记、JavaScript、CSS、图片之后会解析生...

  • 什么是重排和重绘?

    重排和重绘的概念: 重排:部分渲染树(或者整个渲染树)需要重新分析并且节点尺寸需要重新计算。这被称为重排,注意这里...

  • 002-JavaScript常见面试题

    1.重绘和回流(重排)是什么? 2.闭包

  • 浏览器的重绘和重排

    重绘和重排 重排是因为元素的几何属性改变,导致渲染树中的节点发生改变,从而影响到其它节点发生重绘。重排对性能影响极...

  • 浏览器页面的重绘和重排

    对于页面,我们经常有CSS对网页进行呈现样式效果,这就涉及到了页面的重绘和重排 重绘(repaints)与重排(r...

  • 重排和重绘

    1.重排和重绘的概念 重排: 部分渲染树(或者整个渲染树)需要重新分析并且节点尺寸需要重新计算。这被称为重排,注意...

  • 重绘和重排

    什么引发重绘?改变元素的外观,例如颜色等(无尺寸变化)。 什么引发重排? 页面初始化渲染 添加或者删除dom节点 ...

  • 重绘和重排

    DOM树:表示页面结构。渲染树:表示DOM节点如何显示。 定义 当DOM元素影响了元素的几何属性(例如宽和高),浏...

  • 重绘和重排

    1.重绘和重排 重排当DOM变化影响了元素的几何属性,浏览器需要重新计算元素的几何属性,其他元素的几何属性和位置也...

网友评论

      本文标题:什么是重排和重绘?

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