[解決済み] リフローとリペイントの違いは何ですか?
2023-04-03 21:04:45
質問
リフローとリペイントの違いについて少し不明です(もし違いがあるのであれば)。
reflow はさまざまな DOM 要素の位置を移動させるようで、repaint は単に新しいオブジェクトをレンダリングするようです。 たとえば、リフローは要素を削除するときに発生し、再描画はその色を変更するときに発生します。
これは本当ですか?
どのように解決するのですか?
この投稿は、リフローと再描画のパフォーマンスの問題をカバーしているようです。
定義については、その記事から。
A 再描画 が発生します。 要素のスキンに変更が加えられたときに発生します。 レイアウトには影響しないが、目に見える形で レイアウトには影響しません。
この例としては
outline
,visibility
,background
, またはcolor
. Operaによれば,再描画は は高価です。 他のすべてのノードの可視性を確認する必要があるため ノードを検証する必要があるためです。A リフロー は パフォーマンスにとってさらに重要です。 なぜなら、それは ページの一部 (またはページ全体) のレイアウトに影響を与える ページ (またはページ全体) のレイアウトに影響を与える変更が含まれるためです。
リフローを引き起こす例としては、コンテンツの追加や削除、明示的または暗黙的な
width
,height
,font-family
,font-size
などがあります。
どのcss-propertyがrepaintに影響するかは、以下を参照してください。 http://csstriggers.com
関連
-
[解決済み】event.stopPropagationとevent.preventDefaultの違いは何ですか?
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] let "と "var "の使い分けは?
-
[解決済み] callとapplyの違いは何ですか?
-
[解決済み] Bowerとnpmの違いは何ですか?
-
[解決済み] JavaScriptのnullとundefinedの違いは何ですか?
-
[解決済み] substrとsubstringの違いは何ですか?
-
[解決済み] nullはなぜオブジェクトなのか、nullとundefinedの違いは何ですか?
-
[解決済み] Promise : then vs then + catch [重複].
-
[解決済み] リダイレクトされずにHTMLフォームを送信する方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] 配列からオブジェクトを生成する
-
[解決済み] 上級者向けJavaScript。この関数はなぜ括弧でくくられるのですか?重複
-
[解決済み] なぜJavaScriptでは!{}[true]がtrueに評価されるのですか?
-
[解決済み] javascriptで2つの数値を連結する方法は?
-
[解決済み] JavaScriptでの大文字小文字を区別しない正規表現
-
[解決済み] コールバック地獄とは何か、RXはそれをどのように、そしてなぜ解決するのか?
-
[解決済み] 各オブジェクトに?重複
-
[解決済み] Promise : then vs then + catch [重複].
-
[解決済み] これは純関数ですか?
-
[解決済み] JavaScriptデータフォーマット/プリティプリンタ