Javascript 在WebKit中测量回流焊和喷漆时间

我正在嵌入式硬件上设计一个JavaScript/HTML驱动的用户界面，CPU和WebKit都很弱

性能并不理想，我想对应用程序进行分析，特别是对回流和重新绘制事件进行计时，以获得有关实际性能的硬数据，而不是主观和不断变化的观点

在事件处理程序之前和之后使用常规的“getTime（）”计时不起作用，因为WebKit将回流和重新绘制延迟到事件处理程序之后

我曾尝试在Speed Tracer下评测应用程序，但计算成本太低，回流事件甚至没有出现在PC硬件上。我想一些更专注于回流/重涂的工具可能仍然有用

---

有关于如何获取硬数据的提示吗？

执行诸如获取文档高度之类的操作会强制回流。也许您可以将其与getTime（）结合使用

例如：

var t1, t2;
t1 = new Date().getTime();

// Do some DOM manipulation

// Force reflow
document.body.offsetHeight;

t2 = new Date().getTime();
console.log(t2 - t1);

---

这些链接可能会有所帮助。JP有人找到了一种方法，可以很好地对壁虎的回流进行可视化：

---

不幸的是，这需要一个定制的firefox构建。此处的说明：

我只知道dynatrace ajax edition，但这只是IE，我对一个也能做到这一点的工具非常感兴趣：）它不能真正用于分析现有代码以找到所需的弱点optimization@Martin，当然这不是一个成熟的分析工具，但是你至少可以对现有代码中出现的回流计时（我想），这就是OP特别提到的。谢谢你的提示。我想这至少会让我走得更远一点。：）您可以使用console.time&console.timeEnd API，这样您就不必自己管理计时方面了。谢谢，但我的需求是专门针对WebKit的，并且Gecko和WebKit的回流AFAIU并不完全相同。我正在开发低功耗的嵌入式硬件，因此获得实际渲染器的时间安排是至关重要的。