Total Blocking Time(TBT)は、Lighthouseレポートのパフォーマンスセクションで追跡されるメトリックの1つです。各メトリックは、ページの読み込み速度のいくつかの側面をキャプチャします。 TBTが測定するもの TBT は、マウスクリック、画面タップ、キーボードの...
...
Total Blocking Time(TBT)は、Lighthouseレポートのパフォーマンスセクションで追跡されるメトリックの1つです。各メトリックは、ページの読み込み速度のいくつかの側面をキャプチャします。
TBTが測定するもの
TBT は、マウスクリック、画面タップ、キーボードの押下などのユーザー入力にページが反応しないようにブロックされている時間の合計を測定します。この合計は、First Contentful Paint から Time to Interactive までの間のすべての長いタスクのブロック部分を加算して計算されます。50ms 以上実行されるタスクはすべてロングタスクです。50ms以降の時間がブロッキング部分となります。例えば、Lighthouseが70msの長いタスクを検出した場合、ブロッキング部分は20msとなります。
LighthouseがTBTスコアを決定する方法
TBTスコアは、モバイルデバイスに読み込まれたときの上位10,000サイトのページのTBT時間とTBT時間の比較です。トップサイトのデータには404ページが含まれています。
TBTスコアを改善する方法
ChromeDevToolsのパフォーマンスパネルを使用して長いタスクの根本原因を診断する方法を学びます。
一般に、長いタスクの最も一般的な原因は次のとおりです。
- 不必要なJavaScriptのロード、解析、または実行。パフォーマンスパネルでコードを分析しているときに、メインスレッドがページの読み込みに実際には必要のない作業を行っていることに気付く場合があります。 コード分割によるJavaScriptペイロードの削減、未使用のコードの削除、または サードパーティのJavaScriptの効率的な読み込みにより、TBTスコアが向上するはずです。
- 非効率的なJavaScriptステートメント。たとえば、パフォーマンスパネルでコードを分析した後、document.querySelectorAll(‘a’)2000ノードを返す呼び出しが表示されたとします。10ノードのみを返すより具体的なセレクターを使用するようにコードをリファクタリングすると、TBTスコアが向上するはずです。
全体的なパフォーマンススコアを向上させる方法
特定の指標に焦点を当てる特別な理由がない限り、通常は全体的なパフォーマンススコアの向上に焦点を当てたほうがよいでしょう。
Lighthouseレポートの[ Opportunities]セクションを使用して、ページに最も価値のある改善点を決定します。機会が重要であるほど、パフォーマンススコアへの影響は大きくなります。たとえば、以下のLighthouseのスクリーンショットは、レンダリングブロックリソースを削除すると 最大の改善が得られることを示しています。
最新ニュース
coron's Source - 全国 generated by Nordot
- 琉球は名古屋Dに敗れる バスケBリーグ1部by 共同通信 on 2024年4月27日 at AM 10:55
バスケットボール男子のBリーグ1部(B1)は27日、名古屋市のドルフィンズアリーナなどで12試合が行...
- 南ア、初の全人種選挙から30年 差別根絶へ誓い新たby 共同通信 on 2024年4月27日 at AM 10:54
【プレトリア共同】1990年代前半までアパルトヘイト(人種隔離)が行われていた南アフリカで、94年に...
- 中国序列4位の王氏が面会 台湾最大野党の議員団by 共同通信 on 2024年4月27日 at AM 10:41
【北京、台北共同】中国共産党序列4位の王滬寧・人民政治協商会議主席が27日、北京の人民大会堂で台湾最...
- 今野杏南さん 子宮から【大量出血】で救急搬送・手術 「赤ちゃん産んだばかりなのに...まだ死ねない」 先月第1子出産by TBS NEWS DIG on 2024年4月27日 at AM 10:36
タレント・俳優の今野杏南さんが自身のインスタグラムを更新。子宮から、大量出血し、救急搬送され、手術を...
- 性別で入学制限「不合理」 浅野前宮城知事訴え、埼玉by 共同通信 on 2024年4月27日 at AM 10:12
宮城県で全県立高の共学化を進めた浅野史郎前知事が27日、さいたま市内で講演した。「税金で運営される公...
- 日本の技術で月面探査へ 開発進むルナクルーザーby 共同通信 on 2024年4月27日 at AM 10:06
日本人の宇宙飛行士2人が月面着陸する見通しとなった国際月探査「アルテミス計画」で、JAXAとトヨタ自...
- ウクライナの4発電所が損壊 ロシア南部には無人機攻撃by 共同通信 on 2024年4月27日 at AM 10:06
ロシア軍は27日、ウクライナ東部ドニエプロペトロフスク州やハリコフ州、西部イワノフランコフスク州など...
- 都心ターミナル再開発が加速 品川や新宿、鉄道各社は期待by 共同通信 on 2024年4月27日 at AM 9:58
東京の品川や新宿、渋谷といったターミナル駅で「100年に1度」と言われる大規模な再開発が加速している...