Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
lighthouse metricsについて
Search
Yosuke Furukawa
PRO
June 28, 2018
Programming
0
250
lighthouse metricsについて
laco_sushiで発表したlighthouseのメトリクスについての話です。
Yosuke Furukawa
PRO
June 28, 2018
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
デザインシステムが必須の時代に
yosuke_furukawa
PRO
2
150
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
10
4.4k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4.3k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
270
Removing Corepack
yosuke_furukawa
PRO
9
1.7k
JavaScript Runtime とはなにか
yosuke_furukawa
PRO
15
2.9k
Strip Types と Storage
yosuke_furukawa
PRO
4
430
Module Harmony について
yosuke_furukawa
PRO
3
1.8k
LTのやり方
yosuke_furukawa
PRO
16
2.7k
Other Decks in Programming
See All in Programming
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう! #FEC余熱NIGHT
izumin5210
3
540
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
marcoroth
3
1k
Leading Effective Engineering Teams in the AI Era
addyosmani
6
450
Foundation Modelsを実装日本語学習アプリを作ってみた!
hypebeans
0
110
オープンソースソフトウェアへの解像度🔬
utam0k
16
3k
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
natmark
2
510
非同期jobをtransaction内で 呼ぶなよ!絶対に呼ぶなよ!
alstrocrack
0
950
AIと人間の共創開発!OSSで試行錯誤した開発スタイル
mae616
1
530
Devoxx BE - Local Development in the AI Era
kdubois
0
130
Swift Concurrency - 状態監視の罠
objectiveaudio
2
530
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
imkaoru
4
850
Cursorハンズオン実践!
eltociear
2
1.1k
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Facilitating Awesome Meetings
lara
56
6.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
980
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
9.7k
The Cult of Friendly URLs
andyhume
79
6.6k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
A Tale of Four Properties
chriscoyier
161
23k
Java REST API Framework Comparison - PWX 2021
mraible
34
8.9k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
Transcript
Lighthouse metrics ௐͨ 2018/06/28 @ laco_sushi
Twitter: @yosuke_furukawa Github: yosuke-furukawa
͜ΜʹͪFMPܳਓͰ͢
FMP, FCP, FCI, TTIͱ͔ݴͬͯ Δ͚ͲɺlighthouseͲ͏ͬ ͯଌͬͯΔΜʁʁʁʁ
͋Εɺ͘͠ͳ͍ʁ
ௐͨ
None
FMP • ࣮͘͢͝ώϡʔϦεςΟοΫʹௐࠪͨ݁͠ Ռͷ۪ͳํ๏ͰௐͯΔ • Page ͷϨΠϠΛΧϯτͯ͠ᮢΛ͑ͨΒ • Page ͷ͞ΛௐͯͲ͜·Ͱ͍͔
• WebFonts͕ϩʔυࡁΈ͔
FMP • ࣮͘͢͝ώϡʔϦεςΟοΫʹௐࠪͨ݁͠Ռͷ۪ͳํ ๏ͰௐͯΔ • Page ͷϨΠϠΛΧϯτͯ͠ᮢΛ͑ͨΒ • Page ͷ͞ΛௐͯͲ͜·Ͱ͍͔
• WebFonts͕ϩʔυࡁΈ͔ •
TTI • ಉ༷ʹ۪ • FMP͕ܾ·ͬͨΒ͔ͦ͜Β5secؒৄࡉௐࠪ • ͦΕ͕ࡁΉͱ1sec͝ͱʹLongTask͕ͳ͍͔ௐࠪ • LongTask(50msҎ্ͷtask)͕ΕͨΒͦͷλΠ ϛϯά͕TTI
TTI
ͭ·Γ
pageͯ͘DOMෳࡶʹ͠ ͯɺwebfontΘͳ͚Ε FMPὃͤΔ
5secԿ͠ͳ͚ΕTTIὃ ͤΔ
ͦΕʹҙຯͳ͍͚Ͳɻɻɻ
100ࢦͦ͏ͳ
Β͜Β͓݁ࠗ͜ΊͰͱ͏