JavaScript -浏览器立即重排和重绘

文章/答案/技术大牛

发布

2回答

javascript、dom、repaint

是否可以强制浏览器立即从JavaScript执行回流和重绘，即使有其他代码正在运行？我用display/visibility none/hidden、getComputedStyle、requestAnimationFrame尝试了所有这些技巧，但都没有强制浏览器进行真正的重绘。

浏览 2提问于2017-01-31得票数 1

1回答

合并或批处理HTML解析

javascript、html、parsing、dom、updates

现在，当我进行每次更新时，我的浏览器(包括chrome和firefox)都会尝试重新解析页面。有没有一种方法可以告诉浏览器“嘿，我要做一堆html更新，在我说之前别费心重新解析”？

浏览 8提问于2017-02-20得票数 1

回答已采纳

1回答

回流/重绘检测:今天可能吗？在未来有可能吗？

javascript、html、repaint、reflow

我想知道在现代web浏览器上是否有一种可靠的方法来检测文档重排和/或重绘，或者是否有任何迫切的兴趣将其放在W3规范中。我还想知道，如果不能以标准或跨浏览器的方式实现，如何使用特定于供应商的技巧(例如，Mozilla显然有一个MozAfterRepaint事件)来实现。谢谢。

浏览 0提问于2014-04-16得票数 6

1回答

使用JS和DOM对多个DIV元素进行动画处理会产生较低的帧率

javascript、html、google-chrome、dom、frame-rate

前言这需要我的javascript以屏幕的宽度同步“滑动”上面提到的两个页面。这导致了一个非常低的帧率。Firefox和Opera有一点滞后，Chrome的表现尤其糟糕:1帧动画大约需要1帧。

浏览 0提问于2013-03-08得票数 6

2回答

更改图像的src属性时是否会导致回流？

javascript、html、css

正如我们所知，更改元素外观时会发生重绘，而更改布局时会发生重排。但是，我有一个问题，当更改img src属性时，是否会导致回流。例如，有两个不同大小的图像，分别称为A.png和B.png。document.querySelector('button').onclick = function() {} 因为A.png和B.png的大小不同，所以在更改i

浏览 60提问于2019-04-03得票数 1

1回答

removeClass未显示

javascript、jquery

我有一个转换函数，它有一个覆盖屏幕，上面写着“加载”。 $("#Loading").removeClass("hide"); $("#acrcurtain").removeClass("offscreen"); $(".loading_text").removeC

浏览 4提问于2014-02-14得票数 1

回答已采纳

1回答

浏览器重绘/重排

reactjs、loops、animation、webgl、requestanimationframe

关于这方面的文章已经很多了，我至少在过去的几个小时里一直在谷歌上搜索和阅读，但我很难找到我需要的真正基本的、初级的答案。我正在尝试理解webGl中的动画循环，以及React。基本上，浏览器会在不重绘整个屏幕的情况下重绘特定的元素吗？重排总是刷新整个屏幕吗？当您使用刷新按钮手动刷新窗口时，与回流或重绘相比，到底发生了什么区别？我已经读到了requestAnimationFrame，以及React捆绑和区分虚拟dom的变化，减少了重新渲染

浏览 3提问于2021-02-05得票数 1

2回答

操作“虚构”元素比当前DOM中的元素更快吗？

javascript、jquery、html、dom、clone

假设我正在使用jQuery遍历现有的网页元素并对其执行一些操作。需要进行多个更改，集合中的元素数量至少有点大，元素结构也有些复杂。...or没有区别吗--因为活动DOM元素的操作速度与非DOM元素一样快？

浏览 0提问于2013-11-05得票数 2

1回答

Jquery加速动画的最佳实践

c#、asp.net、jquery

在所有浏览器上加速jquery动画的一些更实用的方法是什么？我目前正在使用带有GridView(表)的jquery，它越来越滞后，使得slideUp() slideDown()无法使用。

浏览 1提问于2009-10-21得票数 0

回答已采纳

2回答

通过jQuery删除选定属性后刷新多选

javascript、jquery、html、dom

当使用.removeAttr( "selected“)从多选中的选项中删除”selected“属性时，这些选项不会立即在Chrome中重新绘制为未选中。有没有办法让选项以编程的方式重绘？我已经触发了“更改”和其他一些事件，但除了让用户在适当的位置悬停或单击之外，似乎什么都不起作用。浏览器似乎忘记了重绘元素，直到其他东西吸引了它的注意力。selected");$("#deselectAll").click(function

浏览 0提问于2012-01-28得票数 2

回答已采纳

1回答

禁用浏览器的重排\重绘

javascript、html、performance、dom、reflow

在添加所有元素之前，我不希望浏览器尝试重新绘制页面。这个是可能的吗？

浏览 3提问于2016-10-02得票数 0

回答已采纳

1回答

当涉及到requestAnimationFrame时，浏览器中的刷新率和帧率有什么区别？

javascript、animation、browser、rendering、frontend

据我所知，对于常见的显示器，刷新率是60/s，但是在浏览器中渲染过程中的帧率是多少？谁会在javascript执行的动画中产生一个帧？它是由javascript自己产生的吗？那么css转换呢？有人能给我详细解释一下吗？非常感谢。

浏览 24提问于2017-02-09得票数 0

1回答

是什么导致我的页面有这么多的绘制时间？

javascript、html、css、performance

display属性仅在动画开始和结束时更改。整个文档中只有几个css属性，但这让我感到困惑。为什么我的绘制时间仍然接近60fps？

浏览 1提问于2015-12-01得票数 0

1回答

requestAnimationFrame到底是如何工作的？

javascript、html、browser

我在下面编写了一个简单的代码： <div style="width: 10px; height: 10px; background: #999"/> <script type="text/javascript我们可以将浏览器的运行过程划分为repainting和before repainting，而requestAnimationFrame只是避免在绘制过程中调用回调吗？当浏览器重新绘制该步骤时，该步骤将在下一次<

浏览 2提问于2021-01-17得票数 2

3回答

RxJ限制订阅调用的数量

angular、rxjs、observable

我听ResizeObserver (或者更确切地说，是)来触发画布的重绘，这非常耗费资源。因此，我希望限制由“调整大小”事件触发的重绘量。我尝试用RxJ实现这个功能：：有一个初

浏览 1提问于2019-05-09得票数 2

3回答

启用和禁用重绘按钮

javascript

我在我的网页上显示了一个图表，上面有一个叫做“重绘”的按钮。因此，我想在单击后禁用按钮重绘，直到图形绘制完成，然后再次启用重绘按钮。使用javascript。图表和按钮在同一页上，这是我的javascript $("#myButton").on('click', function () { $(this).prop('disabled

浏览 4提问于2013-08-22得票数 0

1回答