javascript - 回流和重绘有什么区别?

标签 javascript performance repaint reflow

我有点不清楚 reflow + repaint 之间的区别(如果有任何区别的话)

似乎回流可能会改变各种 DOM 元素的位置,而重绘只是渲染一个新对象。例如。删除元素时会发生回流,更改颜色时会发生重绘。

这是真的吗?

最佳答案

这篇文章似乎涵盖了回流与重绘的性能问题

http://www.stubbornella.org/content/2009/03/27/reflows-repaints-css-performance-making-your-javascript-slow/

至于定义,来自那个帖子:

A repaint occurs when changes are made to an elements skin that changes visibly, but do not affect its layout.

Examples of this include outline, visibility, background, or color. According to Opera, repaint is expensive because the browser must verify the visibility of all other nodes in the DOM tree.

A reflow is even more critical to performance because it involves changes that affect the layout of a portion of the page (or the whole page).

Examples that cause reflows include: adding or removing content, explicitly or implicitly changing width, height, font-family, font-size and more.

http://csstriggers.com 了解哪些 css 属性会影响重绘和查看

关于javascript - 回流和重绘有什么区别?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2549296/

相关文章:

sql - 如何证明在 SQL 中使用子选择查询会降低服务器的性能

java - 使用 .setPaint(gradient) 调整大小时不重绘

java - Repaint方法更新太慢

Javascript 字符串提取/正则表达式帮助

javascript - 通过另一个函数透明地传递一个函数的参数

performance - 为什么我在 Scheme 中的合并排序实现如此缓慢?

c# - 循环声明中的方法执行

delphi - 为什么我必须在 OnMouseMove 期间调用 Repaint?

javascript - Google 日历返回无效的 json 文件

javascript - 有没有办法将 ReadableStream<Uint8Array> 通过管道传输到 NextApiResponse?