質問編集履歴
2
コードの強調をやめる
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
そしてブラウザは、ページ全体のDOMツリー・CSSOMツリーで構成されたレンダリングツリーをもとにレイアウトしてから描画すると認識しています。
|
|
12
12
|
|
|
13
13
|
(2) Chrome DevTools Performanceタブ > Timingに表示されるFP, FCPなどのイベントは、描画されるときに発生すると認識しています。
|
|
14
|
-
つまり
|
|
14
|
+
つまりFP/FCPイベントは、レンダリングツリーが作成され、レイアウトが行われて、描画段階にある場合に発生する認識しています。
|
|
15
15
|
|
|
16
16
|
### 疑問
|
|
17
17
|
|
1
疑問が伝わりやすいように修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -5,11 +5,13 @@
|
|
|
5
5
|
|
|
6
6
|
ref. https://developers.google.com/web/fundamentals/performance/critical-rendering-path/adding-interactivity-with-javascript?hl=ja
|
|
7
7
|
|
|
8
|
+
私はレンダリングの仕組みについて、以下のように認識しています。
|
|
9
|
+
|
|
8
10
|
(1) 私の認識ではdeferを使わない限り、ブラウザはscriptタグが現れた場合には、JavaScriptの読み込み・解釈を完了するまでDOMツリー構築処理をブロックすると認識しています。
|
|
9
|
-
そしてブラウザはページ全体のDOMツリー・CSSOMツリー
|
|
11
|
+
そしてブラウザは、ページ全体のDOMツリー・CSSOMツリーで構成されたレンダリングツリーをもとにレイアウトしてから描画すると認識しています。
|
|
10
12
|
|
|
11
|
-
(2) Chrome DevTools Performance
|
|
13
|
+
(2) Chrome DevTools Performanceタブ > Timingに表示されるFP, FCPなどのイベントは、描画されるときに発生すると認識しています。
|
|
12
|
-
つまりFP
|
|
14
|
+
つまり`FP`/`FCP`イベントは、レンダリングツリーが作成され、レイアウトが行われて、描画段階にある場合に発生する認識しています。
|
|
13
15
|
|
|
14
16
|
### 疑問
|
|
15
17
|
|