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

Building Lighthouse Metrics

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for Chris Chris
May 08, 2020
Programming
0
48

Building Lighthouse Metrics

Avatar for Chris

Chris

May 08, 2020
Tweet

Other Decks in Programming

See All in Programming
MDN Web Docs に日本語翻訳でコントリビュート
Avatar for uutan1108 ohmori_yusuke
0
650
フロントエンド開発の勘所 -複数事業を経験して見えた判断軸の違い-
Avatar for Yoichiro Kubo heimusu
7
2.8k
「ブロックテーマでは再現できない」は本当か？
Avatar for Takashi Kitajima inc2734
0
1k
20260127_試行錯誤の結晶を1冊に。著者が解説 先輩データサイエンティストからの指南書 / author's_commentary_ds_instructions_guide
Avatar for nash_efp nash_efp
1
970
Apache Iceberg V3 and migration to V3
Avatar for Tomohiro Tanaka tomtanaka
0
160
それ、本当に安全？ ファイルアップロードで見落としがちなセキュリティリスクと対策
Avatar for ikechi penpeen
7
3.9k
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
Avatar for petamoriken / 森建 petamoriken
0
200
MUSUBIXとは
Avatar for Hisaho nahisaho
0
130
0→1 フロントエンド開発 Tips🚀 #レバテックMeetup
Avatar for 弁護士ドットコム bengo4com
0
570
CSC307 Lecture 09
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
840
副作用をどこに置くか問題：オブジェクト指向で整理する設計判断ツリー
Avatar for Koya Masuda koxya
1
610
AI Agent の開発と運用を支える Durable Execution #AgentsInProd
Avatar for izumin5210 izumin5210
7
2.3k

Featured

See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.7k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
28
2.4k
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
Avatar for Sophie Logan marketingsoph
0
75
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
9
750
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
141
34k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.6k
svc-hook: hooking system calls on ARM64 by binary rewriting
Avatar for Akira Moroo retrage
1
100
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
430
Conquering PDFs: document understanding beyond plain text
Avatar for Ines Montani inesmontani
PRO
4
2.3k
How Software Deployment tools have changed in the past 20 years
Avatar for Geshan Manandhar geshan
0
32k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
Avatar for Aleyda Solis aleyda
1
1.8k
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
791
250k

Transcript

  1. Building Lighthouse Metrics @chriswdmr

  2. hey

  3. None
  4. None
  5. None
  6. None

  7. Lighthouse 5 Lighthouse 6 (draft) Difference First Contentful Paint 20

    % 15 % - 5 % ↘ Speed Index 27 % 15 % - 12 % ↘ Largest Contentful Paint 7 % 25 % + 18 % ↗ Time to interactive 33 % 15 % - 18 % ↘ Total Blocking Time - 25 % Cumulative Layout Shift - 5 % Source: https://web.dev/performance-scoring/
  8. None
  9. None
  10. None

  11. Problem ➡ Idea ➡ Solution

  12. It's coding time

  13. ☹

  14. But still. I had this idea.

  15. Image from Henrik Kniberg

  16. One month

  17. Problem Idea Solution ✅ ✅ ✅

  18. Making it public

  19. None
  20. None

  21. The next morning

  22. None
  23. None

  24. Serverless functions Frontend Backend Database

  25. Switched to a paid plan

  26. None

  27. That's why I'm here

  28. What's next?

  29. None
  30. None

  31. • If you create something: validate your idea quickly •

    JAM stack: better performance out of the box • Be prepared: Lighthouse 6 is coming

  32. Thanks!