paint - Chrome のタイムライン フレーム タブでペイント イベントの原因を特定するにはどうすればよいですか

Question

Chrome の [タイムライン] タブの [フレーム] タブで遅いペイントをデバッグすると、何がペイントされ、何が原因でペイントされたかを特定できますか? ペイント イベントには、ペイント時間、寸法、および場所に関する情報のみが含まれているようです。

Answer 1

短くするために、Show paint rectangles、Enable Continuous page repainting、および Timeline ビューを組み合わせて使用​​する必要があります。ドローワーの [レンダリング] タブの下に、[ペイントの四角形を表示] と [ページの連続再描画を有効にする] があります。

詳細については、Google の Web Fundamentals Web ページ: Simplify Paint Complexity および Reduce Paint Areas を参照してください。