在调试我正在开发的画布库时,我遇到了铬-devtools不断报告每个动画帧的“复合层”和“更新层树”,而没有重新绘制或移动任何对象。
举个例子:
var x = 0;
( function tick( ) {
window.requestAnimationFrame(tick);
x++;
}( ) )这些操作不是时间密集型的(每帧0.005到0.05ms ),但我想知道为什么会发生这种情况。
我脑海中唯一的想法是,铬使用的是类似于:
console.time( "composite layers" );
// do compositing
for( var i = 0; i < compositedLayers.length; ++i ) {
// not triggered since compositedLayers.length = 0
// but takes some time to be checked
compositedLayers[i].composite();
}
console.timeEnd( "composite layers" );因此,如果是这样,为什么“油漆”,“重新计算风格”,“布局”,.不是以同样的方式触发吗?
更新:
Edit1: --只有在使用requestAnimationFrame时才会发生这种情况。setInterval只显示按预期触发的计时器。
Edit2:完整源代码示例:巴斯丁
发布于 2014-06-13 06:05:37
来自https://code.google.com/p/chromium/issues/detail?id=325419
..。即使像素输出到屏幕上没有任何变化,页面也有可能通过删除文档的样式来使整个呈现状态失效。眨眼别无选择,只能在这一点上重新调整风格、中继、油漆和合成。有时,当没有什么有效的改变时,这些步骤可能会被提前公布,但这一点很难确定。
还请参阅排字器线程结构 -似乎rAF触发器在两个排序线程之间的层树同步。
https://stackoverflow.com/questions/23561325
复制相似问题