再描画再描画や再配置が何であるかをまず、 （リフローリフロー）
再描画：attribute要素の一部がなど、外観、背景、色、として、変更されたようなレイアウトの変更、要素の新しい属性に応じてのみ、ブラウザの再描画させない
、要素は、新しい外観上の再描画テイクと呼ばれています。 転位（還流）：すべてのプロセスは、ツリーをレンダリングするようにマージンの大きさなどの問題がいくつか、または再計算するDOMツリーを変更する必要ので、
再配置を再描画は、必ずしも（色の変更など）が必要とされていない、必然的に再配置再描画につながります（そのようなページの場所の変更など）
第二、および原因再構成再描画リペイント（還流リフロー）特性
原因性の2.1再描画リペイント
| 一般的な再描画要素 | ||||
|---|---|---|---|---|
| 色 | ボーダースタイル | 可視 | バックグラウンド | |
| テキストの装飾 | 背景画像 | 背景位置 | 背景リピート | |
| アウトラインの色 | アウトライン | アウトラインスタイル | ボーダー半径 | |
| 輪郭線幅 | ボックスシャドウ | 背景サイズ | ||
2.2誘起再配列（還流リフロー）とシーンプロパティ
1.追加、可視DOM除去 素子2変化位置を サイズ変更素子3（マージン、パディング、境界線の太さ、幅、高さ、及び他の幾何学的属性）を レンダリング4.初期ページ のブラウザウィンドウのサイズが変更された5.
6. [スタイル属性
7.文字サイズの変更
8. [追加/削除]スタイルシート
ホバー：など9.アクティブ擬似クラス、
10. Operationクラスの属性
11.コンテンツの変化、（ユーザが入力ボックスの内容に書き込みます）
| 共通の要素を並べ替え | ||||
|---|---|---|---|---|
| 幅 | 高さ | パディング | マージン | |
| 表示 | ボーダー幅 | 境界 | 上 | |
| ポジション | フォントサイズ | 浮く | テキスト整列 | |
| オーバーフロー-Y | フォントの太さ | オーバーフロー | 左 | |
| フォントファミリー | 行の高さ | 垂直ALIGN | 右 | |
| 明確な | ホワイトスペース | 底 | 分の高さ | |
offsetTop |
offsetLeft |
offsetWidth |
offsetHeight |
|
scrollTopスプライト |
scrollLeft |
scrollWidth |
scrollHeight |
|
clientTop |
clientLeft |
clientWidth |
clientHeight |
|
getComputedStyle（） |
（IEでcurrentStyle） |
|||
第三には、どのように減らすために再描画（リペイント）と並び替え（リフロー）
（1）一つのスタイルによるDOM 1を変更しないでください。あなたは良いCSSクラスを定義し、DOMクラス名を変更することができます。 ループのループ変数としてDOMノードの属性値（2）ではありません。 （3）アニメーションのHTML要素のための固定または位置absoultの使用、その後のリフローではないだろう彼らのCSSを変更します。 （4）は、テーブルのレイアウトを使用しないでください。小さな変化は、テーブル全体の再配置をもたらすのためには、小さくてもよいです。（要素のその内部テーブルを除き、通常、同じ時間要素に3回かかり、レンダリングツリーにその優れた属性を決定するために、計算ノードに必要になることがあります。これは、我々はその理由レイアウトを作るために、テーブルを使用しないようにしたい理由。） （5）クエリ（キューリフレッシュを強制的につながるレンダリング）する際のレイアウト情報が変更行わない
変化翻訳代替上部と（6）
不透明置換の可視性（別々の層に最適化された再描画）と（7）
-------------------------------------------------- -----------------------------------------------