为什么Chrome需要12秒才能完成更新图层树？ [英] Why would Chrome take 12 seconds to do an Update Layer Tree?

问题描述

我有一个相对不复杂的ASP.Net应用程序，它偶尔会在图层中显示一个警告消息，并带有一个阴影，并带有一个按钮来取消通知。

这段代码多年来一直运行良好。

最近，我收到了用户反应非常慢的投诉。他们遇到的情况是页面完全没有响应，当他们点击[OK]按钮时，很长时间没有任何事情发生。

当我录制时间轴时，我可以看到甚至导致web服务器往返的原始内容，并且我可以看到来自web服务器的响应。我还可以看到所有作为响应结果运行的Javascript代码。

就应用程序而言，交易结束了，并且，就就Javascript而言，交易也结束了。我们所需要做的就是等待用户点击[确定]按钮，我们将关闭通知弹出窗口。

这就是冻结发生的地方。 [OK]事件不会像20-30秒那样传递。这期间发生了什么？这就是为什么我写作的原因：

我们看到一些很短的定时器每隔一段时间触发一次，然后我们看到一个快速的Recalculate Style调用，然后是更新层树事件。

更新图层树事件需要10-12秒！

这里是由于更新图层树事件而无法响应的对话框的代码首先在您看到它时显示获取，然后如果出现问题，可能会使用与showAlert类似的代码进行更新：

状态/错误对话框代码

'的div类= h2_lin>解决方案

请参阅@ tiblu的 comment for det为什么 Chrome会执行更新图层树。

至于需要12秒：交互在其他浏览器中正常运行，例如Firefox或Safari？如果你的代码一直工作得很好，正如你所说的那样，最近浏览器响应问题已经出现（> 2015年10月中旬），并且只有在Chrome浏览器中， 可能不是你的代码。

最近有一些类似的新问题和投诉，指向Chrome 46的发布。例如：此问题（code.google.com）和此问题（code.google.com）。

CPU峰值负责浏览器无响应，您可以使用Chrome的任务管理器监视这种情况。至于 为什么 CPU处于尖峰状态以及更详细的信息，您需要在开发时遵循上述问题以及其他问题。

对于伪答案，目前没有代表将其转换为评论。

I have a relatively un-complex ASP.Net application, which occasionally displays an alert message in layer, with a shadow, with a pushbutton to dismiss the notification.

This code has been working fine for years.

Lately, I am getting complaints from users of really slow response. What they experience is that the page is completely unresponsive, and when they click on the [OK] pushbutton nothing happens for a really long time.

When I record a Timeline, I can see the original even which caused a round-trip to the webserver, and I can see the response from the webserver. I can also see all the Javascript code which runs as a result of the response.

As far as the application is concerned, the transaction is over, and, as far as the Javascript is concerned, the transaction is over as well. All we need to do is wait for the user to click the [OK] button and we will dismiss the notification popup.

This is where the "freeze" happens. The [OK] event is not delivered for like 20-30 seconds. What's going on in the meantime? That's why I'm writing:

We see some very short timers fire every once in a while, then we see a quick Recalculate Style call, followed by an Update Layer Tree event.

The Update Layer Tree event takes 10-12 seconds!

Here's the code for the dialog which is going unresponsive because of the Update Layer Tree events The gets displayed first as you see it here, then, if something goes wrong, it may get updated with code similar to showAlert:

Status/error dialog code

解决方案

See @tiblu's comment for detail on why Chrome would perform Update Layer Tree.

As for taking 12 seconds: does the interaction behave normally in other browsers, for example Firefox or Safari? If your code has been working fine for years as you say and the browser response issues have been popping up recently (> mid-October, 2015) and only in Chrome the issue may not be your code.

There are a number of similar new issues and complaints recently, pointing to the release of Chrome 46. For example: this issue (code.google.com) and this issue (code.google.com).

CPU spikes are responsible for browser unresponsiveness, which you can monitor using Chrome's Task Manager. As for why CPU is spiking and further detail you'll need to follow the issues above and others as they develop.

Apologies for the pseudo-answer, don't currently have the rep to slip this into a comment.

这篇关于为什么Chrome需要12秒才能完成更新图层树？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！