パーツまたはページ全体を再レンダリングするために、ページ要素の位置とジオメトリを再計算するプロセスはリフローと呼ばれます。リフローはブラウザでのユーザーブロッキング操作であるため、開発者はリフローの数と影響（DOM深度、CSS効率、スタイルの変更なし）をリフローの数に減らす方法を理解する必要があります。リフローページの単一の要素が、その親要素とすべての子要素を反射する場合があります。
複数のユーザーアクションとDHTMLの変更があり、リフローをトリガーする可能性があります。ブラウザウィンドウのサイズを変更し、JavaScriptを使用してスタイルを計算し、DOMの削除要素を作成し、要素のクラスを変更するとリフローがトリガーされます。一部の操作は、想像力を超えて何度もリフローを引き起こすことに注意してください。次の写真は、Steve Soudersのスピーチからさらに高速なWebサイトに由来しています。
上記の表から、すべてのJavaScript制御スタイルがすべてのブラウザでリフローをトリガーするわけではないことは明らかです。トリガーの数が異なる場合でも。同時に、最新のブラウザがリフローの数を制御するのにますます良くなっていることがわかります。
Googleでは、ページとWebアプリケーションをさまざまな方法で測定し、UIを追加する際に考慮する重要な要素です。私たちは、活気に満ちた、インタラクティブで楽しいユーザーエクスペリエンスを伝えることに取り組んでいます。
原則としてここにリフローを減らすためのいくつかの原則があります：
以下のビデオ（翻訳の注：YouTubeから引用されている、表示できない、元のテキストにアクセスして壁を閲覧してください）、Lindseyはリフローを減らす方法を紹介します。
さらに読む