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

lighthouse metricsについて

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Yosuke Furukawa Yosuke Furukawa PRO
June 28, 2018
Programming
260
0

lighthouse metricsについて

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

Avatar for Yosuke Furukawa

Yosuke Furukawa PRO

June 28, 2018

More Decks by Yosuke Furukawa

See All by Yosuke Furukawa
jsmini JavaScript Engine を作ってみた話
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
0
240
デザインシステムが必須の時代に
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
2
240
Node.js, Deno, Bun 最新動向とその所感について
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
10
5.3k
Welcome JSConf.jp 2024
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
1
4.8k
tc39 x jsconf.jp Panel Discussion 2024
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
0
350
Removing Corepack
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
9
2k
JavaScript Runtime とはなにか
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
15
3.1k
Strip Types と Storage
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
4
520
Module Harmony について
Avatar for Yosuke Furukawa yosuke_furukawa
PRO
4
1.9k

Other Decks in Programming

See All in Programming
仕様書を書く前にハーネスを作る - Agent Native開発は「探索を速く、判定を固く」
Avatar for Gota gotalab555
1
190
PHP に部分適用が来るぞ！……ところで何それ？おいしいの？ #phpcon / phpcon-2026
Avatar for shogogg shogogg
0
380
Foundation Models frameworkで画像分析
Avatar for リョウ ryodeveloper
1
140
継続モナドとリアクティブプログラミング
Avatar for ゆきくらげ yukikurage
3
650
分散システム、なんですぐ死んでしまうん？耐障害性を高めたいあなたのためのレジリエンスパターン入門
Avatar for Mitsuhiro Shibuya mshibuya
7
6.9k
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
Avatar for Ryo Tomidokoro hanhan1978
4
1.3k
20260722_microCMSで考える、AI時代のコンテンツ運用設計
Avatar for Yoshihisa Kaino yosh1
0
120
はてなアカウント基盤 State of the Union
Avatar for cockscomb cockscomb
1
1.3k
吝嗇家のためのAI活用 / AI development for miser - ChatGPT + Issue Driven Development
Avatar for philomagi tooppoo
0
200
Built Our Own Background Agent at LayerX #aidevex_findy
Avatar for LayerX layerx
PRO
9
3.5k
Augmenting AI with the Power of Jakarta EE
Avatar for ivargrimstad ivargrimstad
0
230
壊れたパーサから始める関数型設計と構成的なパーサ #fp_matsuri
Avatar for ライガー raiga0310
2
400

Featured

See All Featured
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
160
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
3
1.1k
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
350
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
Avatar for Aleyda Solis aleyda
1
2.1k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.4k
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
330
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.7k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
10k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
72
40k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1033
470k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k

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. Β͜Β͓݁ࠗ͜ΊͰͱ͏