当前位置: 首页 > 面试题库 >

js 重排和重绘的区别?

阴雪风
2023-03-14
本文向大家介绍js 重排和重绘的区别?相关面试题,主要包含被问及js 重排和重绘的区别?时的应答技巧和注意事项,需要的朋友参考一下

参考回答:

重绘(repaint或redraw):当盒子的位置、大小以及其他属性,例如颜色、字体大小等都确定下来之后,浏览器便把这些原色都按照各自的特性绘制一遍,将内容呈现在页面上。重绘是指一个元素外观的改变所触发的浏览器行为,浏览器会根据元素的新属性重新绘制,使元素呈现新的外观。

触发重绘的条件:改变元素外观属性。如:color,background-color等。

注意:table及其内部元素可能需要多次计算才能确定好其在渲染树中节点的属性值,比同等元素要多花两倍时间,这就是我们尽量避免使用table布局页面的原因之一。

重排(重构/回流/reflow):当渲染树中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建, 这就称为回流(reflow)。每个页面至少需要一次回流,就是在页面第一次加载的时候。

重绘和重排的关系:在回流的时候,浏览器会使渲染树中受到影响的部分失效,并重新构造这部分渲染树,完成回流后,浏览器会重新绘制受影响的部分到屏幕中,该过程称为重绘。所以,重排必定会引发重绘,但重绘不一定会引发重排。

 类似资料:
  • 问题内容: 我对重排和重绘之间的区别还不清楚(如果有任何区别) 似乎重排可能正在转移各种DOM元素的位置,其中重画只是呈现一个新对象。例如,在移除元素时将发生回流,而在更改其颜色时将发生重新绘制。 这是真的? 问题答案: 至于定义,从那篇文章: 一个 重绘 更改时的元素皮肤改变明显制成,但不影响其布局发生。 这方面的例子包括 ,,,或。根据Opera的说法,重绘是昂贵的,因为浏览器必须验证DOM树

  • 本文向大家介绍重载和重写的区别?相关面试题,主要包含被问及重载和重写的区别?时的应答技巧和注意事项,需要的朋友参考一下 方法的重载和重写都是实现多态的方式,区别在于前者实现的是编译时的多态性,而后者实现的是运行时的多态性。 重载发生在一个类中,同名的方法如果有不同的参数列表(类型不同、个数不同、顺序不同)则视为重载。 重写发生在子类与父类之间,重写要求子类重写之后的方法与父类被重写方法有相同的返回

  • 本文向大家介绍了解重绘和重排吗,知道怎么去减少重绘和重排吗,让文档脱离文档流有哪些方法?相关面试题,主要包含被问及了解重绘和重排吗,知道怎么去减少重绘和重排吗,让文档脱离文档流有哪些方法?时的应答技巧和注意事项,需要的朋友参考一下 参考回答: DOM的变化影响到了预算内宿的几何属性比如宽高,浏览器重新计算元素的几何属性,其他元素的几何属性也会受到影响,浏览器需要重新构造渲染书,这个过程称之为重排,

  • 我正试图找出两者之间的区别

  • 本文向大家介绍来说说你对重绘和重排的理解,以及如何优化?相关面试题,主要包含被问及来说说你对重绘和重排的理解,以及如何优化?时的应答技巧和注意事项,需要的朋友参考一下 浏览器加载网页时会生成DOM树和CSSOM树 重绘: 当盒子的位置、大小以及其他属性,例如颜色、字体大小等都确定下来之后,浏览器便把这些原色都按照各自的特性绘制一遍,将内容呈现在页面上。重绘是指一个元素外观的改变所触发的浏览器行为,

  • 我有一个正在添加JLabel的JPanel。然后我想删除所有的JLabel并添加一些新的。 所以我做了以下几点: 这很好。当我在这之后开始一个新线程时,我的问题就出现了,比如: 然后原始JLabels的输出仍然可见。我读到重新验证过程是一个长时间运行的任务,因此firstProducer线程正在启动,而重新验证正在进行并产生冲突。处理这个问题的最佳方法是什么?