Upgrade to Pro — share decks privately, control downloads, hide ads and more …

lighthouse metricsについて

Avatar for Yosuke Furukawa Yosuke Furukawa PRO
June 28, 2018
Programming
0
250

lighthouse metricsについて

laco_sushiで発表したlighthouseのメトリクスについての話です。

Avatar for Yosuke Furukawa

Yosuke Furukawa PRO

June 28, 2018
Tweet

More Decks by Yosuke Furukawa

See All by Yosuke Furukawa
デザインシステムが必須の時代に
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
2
150
Node.js, Deno, Bun 最新動向とその所感について
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
10
4.4k
Welcome JSConf.jp 2024
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
1
4.3k
tc39 x jsconf.jp Panel Discussion 2024
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
0
270
Removing Corepack
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
9
1.7k
JavaScript Runtime とはなにか
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
15
2.9k
Strip Types と Storage
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
4
430
Module Harmony について
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
3
1.8k
LTのやり方
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
16
2.7k

Other Decks in Programming

See All in Programming
Web フロントエンドエンジニアに開かれる AI Agent プロダクト開発 - Vercel AI SDK を観察して AI Agent と仲良くなろう！ #FEC余熱NIGHT
Avatar for Masayuki Izumi izumin5210
3
540
Introducing ReActionView: A new ActionView-Compatible ERB Engine @ Kaigi on Rails 2025, Tokyo, Japan
Avatar for Marco Roth marcoroth
3
1k
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
6
450
Foundation Modelsを実装日本語学習アプリを作ってみた！
Avatar for 蛋白（たんぱく・TANPACT） hypebeans
0
110
オープンソースソフトウェアへの解像度🔬
Avatar for うたもく utam0k
16
3k
Pull-Requestの内容を1クリックで動作確認可能にするワークフロー
Avatar for Atsuya Sato natmark
2
510
非同期jobをtransaction内で 呼ぶなよ！絶対に呼ぶなよ！
Avatar for Yuto Urushima alstrocrack
0
950
AIと人間の共創開発！OSSで試行錯誤した開発スタイル
Avatar for mae616 mae616
1
530
Devoxx BE - Local Development in the AI Era
Avatar for Kevin Dubois kdubois
0
130
Swift Concurrency - 状態監視の罠
Avatar for Yuki Yasoshima objectiveaudio
2
530
Goで実践するドメイン駆動開発 AIと歩み始めた新規プロダクト開発の現在地
Avatar for imkaoru imkaoru
4
850
Cursorハンズオン実践！
Avatar for Ikko Eltociear Ashimine eltociear
2
1.1k

Featured

See All Featured
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
271
21k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
56
6.6k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
980
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
9.7k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.6k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
274
41k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
161
23k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
8.9k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
127
17k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.5k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
27k

Transcript

  1. Lighthouse metrics ௐ΂ͨ 2018/06/28 @ laco_sushi

  2. Twitter: @yosuke_furukawa Github: yosuke-furukawa

  3. ͜Μʹͪ͸FMPܳਓͰ͢

  4. FMP, FCP, FCI, TTIͱ͔ݴͬͯ Δ͚ͲɺlighthouseͲ͏΍ͬ ͯଌͬͯΔΜʁʁʁʁ

  5. ͋Εɺ೉͘͠ͳ͍ʁ

  6. ௐ΂ͨ

  7. None

  8. FMP • ࣮͸͘͢͝ώϡʔϦεςΟοΫʹௐࠪͨ݁͠ Ռͷ۪௚ͳํ๏Ͱௐ΂ͯΔ • Page ͷϨΠϠΛΧ΢ϯτͯ͠ᮢ஋Λ௒͑ͨΒ • Page ͷ௕͞Λௐ΂ͯͲ͜·Ͱ௕͍͔

    • WebFonts͕ϩʔυࡁΈ͔

  9. FMP • ࣮͸͘͢͝ώϡʔϦεςΟοΫʹௐࠪͨ݁͠Ռͷ۪௚ͳํ ๏Ͱௐ΂ͯΔ • Page ͷϨΠϠΛΧ΢ϯτͯ͠ᮢ஋Λ௒͑ͨΒ • Page ͷ௕͞Λௐ΂ͯͲ͜·Ͱ௕͍͔

    • WebFonts͕ϩʔυࡁΈ͔ •

  10. TTI • ಉ༷ʹ௒۪௚ • FMP͕ܾ·ͬͨΒ͔ͦ͜Β5secؒৄࡉௐࠪ • ͦΕ͕ࡁΉͱ1sec͝ͱʹLongTask͕ͳ͍͔ௐࠪ • LongTask(50msҎ্ͷtask)͕੾ΕͨΒͦͷλΠ ϛϯά͕TTI

  11. TTI

  12. ͭ·Γ

  13. page௕ͯ͘DOMෳࡶʹ͠ ͯɺwebfont࢖Θͳ͚Ε͹ FMP͸ὃͤΔ

  14. 5secԿ΋͠ͳ͚Ε͹TTI͸ὃ ͤΔ

  15. ͦΕʹҙຯ͸ͳ͍͚Ͳɻɻɻ

  16. 100఺໨ࢦͦ͏ͳ

  17. Β͜Β͓݁ࠗ͜ΊͰͱ͏