What your Google Lighthouse score hides from you - BrightonSEO

In this BrightonSEO talk, Aymen will tell us about the challenges he encounters in web performance when we rely heavily on synthetic tools and their scoring systems. These tools are great for debugging and testing web performance but can't represent your website users' real life. Join him on his retrospective on web performance measurement methodology. He will share his findings on how to fix these challenges and better understand users' experience thanks to his workflow and the Real User Monitoring tool (Speetals) he built.

You can watch this talk recording for free by subscribing to BrightonSEO live event: https://april2023.brightonseo.com/talks/what-your-google-lighthouse-score-hides-from-you/

Transcript

1. What Google Lighthouse
   score hides from you
   SpeakerDeck.Com/AymenLoukil
   @LoukilAymen
   Aymen Loukil
   Speetals Founder
   

   View Slide

2. @LoukilAymen
   #BrightonSEO
   Back to 2017, my
   webperf consulting
   journey…
   

   View Slide

3. @LoukilAymen
   #BrightonSEO
   And this was my #webperf workflow
   Audit in Lab
   Write user
   stories
   Implement
   Test in Lab
   

   View Slide

4. @LoukilAymen
   #BrightonSEO
   Awesome!
   

   View Slide

5. @LoukilAymen
   #BrightonSEO
   Me excited
   Ship it!
   

   View Slide

6. @LoukilAymen
   #BrightonSEO
   Now what?
   

   View Slide

7. @LoukilAymen
   #BrightonSEO
   We need to wait for the next CrUX
   dataset (in 28 days)
   [Every second Tuesday]
   

   View Slide

8. @LoukilAymen
   #BrightonSEO
   In 1 month many things happen..
   

   View Slide

9. @LoukilAymen
   #BrightonSEO
   Users faced improvement deterioration!
   Feb 2020
   Mar 2020
   73% => 70.8%
   

   View Slide

10. @LoukilAymen
    #BrightonSEO
    Feb 2020
    Mar 2020
    Me
    disappointed
    

    View Slide

11. @LoukilAymen
    #BrightonSEO
    A shot in the dark!
    

    View Slide

12. @LoukilAymen
    #BrightonSEO
    As a consultant,
    This feels bad
    and frustrating.
    

    View Slide

13. @LoukilAymen
    #BrightonSEO
    Reflection was
    needed to
    understand what
    happened?
    

    View Slide

14. @LoukilAymen
    #BrightonSEO
    Gabriela Palai - Pexels
    What’s wrong with
    Lighthouse score…?
    

    View Slide

15. @LoukilAymen
    #BrightonSEO
    Where does it fall in our users?
    We have 100 users
    LCP 4s to 2.5s on mobile
    

    View Slide

16. @LoukilAymen
    #BrightonSEO
    Does it represent someone?
    We have 100 users
    LCP 4s to 2.5s on mobile
    

    View Slide

17. @LoukilAymen
    #BrightonSEO
    One LH run may or not represent one of
    your users
    

    View Slide

18. @LoukilAymen
    #BrightonSEO
    Emulation isn’t real life..
    

    View Slide

19. @LoukilAymen
    #BrightonSEO
    

    View Slide

20. @LoukilAymen
    #BrightonSEO
    I’ve also been part of this!
    

    View Slide

21. @LoukilAymen
    #BrightonSEO
    Webperf score obsession isn’t new!
    

    View Slide

22. @LoukilAymen
    #BrightonSEO
    We have always been
    assessed with grades..
    

    View Slide

23. @LoukilAymen
    #BrightonSEO
    Do they even
    correlate in some
    way?
    

    View Slide

24. @LoukilAymen
    #BrightonSEO
    50% of perfect
    Lighthouse score
    (90+) pages fail at
    Web Vitals
    Brendan Kenny
    @brendankenny
    

    View Slide

25. @LoukilAymen
    #BrightonSEO
    With a score of
    50/100, many
    pages passes the
    Web Vitals
    Brendan Kenny
    @brendankenny
    

    View Slide

26. @LoukilAymen
    #BrightonSEO
    There is a blind
    spot!
    

    View Slide

27. @LoukilAymen
    #BrightonSEO
    What do your
    users and
    Lighthouse have
    in common?
    

    View Slide

28. @LoukilAymen
    #BrightonSEO
    CPU Memory Screen size Location Internet
    speed
    Device Context
    flaticon.com
    

    View Slide

29. @LoukilAymen
    #BrightonSEO
    Users interact, but Lighthouse doesn’t!
    

    View Slide

30. @LoukilAymen
    #BrightonSEO
    Are they at least talking the same metrics?
    

    View Slide

31. @LoukilAymen
    #BrightonSEO
    Ultimately they don’t share as many metrics!
    

    View Slide

32. @LoukilAymen
    #BrightonSEO
    Ultimately they don’t share as many metrics!
    Above the
    fold only CLS
    

    View Slide

33. @LoukilAymen
    #BrightonSEO
    Ultimately they don’t share as many metrics!
    Above the
    fold only CLS
    Depends on
    conditions
    

    View Slide

34. @LoukilAymen
    #BrightonSEO
    Variability issues
    3 consecutive runs on the same page and on same conditions
    

    View Slide

35. @LoukilAymen
    #BrightonSEO
    It is like Rock paper scissors
    

    View Slide

36. @LoukilAymen
    #BrightonSEO
    You can easily trick it!
    Barry Pollard
    @tunetheweb
    

    View Slide

37. @LoukilAymen
    #BrightonSEO
    My customer’s Web agency
    

    View Slide

38. @LoukilAymen
    #BrightonSEO
    You can even hack it!
    

    View Slide

39. @LoukilAymen
    #BrightonSEO
    If the page is loaded with Lighthouse,
    Gtmetrix, or other tool
    => Only load HTML, no styles, no
    JavaScript, no images
    

    View Slide

40. @LoukilAymen
    #BrightonSEO
    Do you mainly
    care about your
    users or
    Lighthouse
    

    View Slide

41. @LoukilAymen
    #BrightonSEO
    Your users are different
    

    View Slide

42. @LoukilAymen
    #BrightonSEO
    CPUs are getting faster every
    year…
    4G and 5G are common…
    Our audience top device is
    iPhone..
    But..we often assume
    

    View Slide

43. @LoukilAymen
    #BrightonSEO
    You are just
    making
    assumptions!
    

    View Slide

44. @LoukilAymen
    #BrightonSEO
    iPhone isn’t real life…(Alex Russel)
    Your users potentially have 2019 smartphones
    Android
    iOS
    

    View Slide

45. @LoukilAymen
    #BrightonSEO
    A user does not care
    about your website
    Lighthouse score, your
    technical stack, or even if
    it is AI-powered..
    

    View Slide

46. @LoukilAymen
    #BrightonSEO
    So..Rely on your
    Users’ data, And
    here is how👉
    

    View Slide

47. @LoukilAymen
    #BrightonSEO
    Remember my failed #webperf workflow?
    Audit in Lab
    Write user
    stories
    Implement
    Test in Lab
    https://www.vectorstock.com/
    https://knowyourmeme.com/
    

    View Slide

48. @LoukilAymen
    #BrightonSEO
    I transformed it into this:
    Audit in field
    Prioritize
    Implement
    Test in Lab
    Fast validate
    on users
    Iterate
    

    View Slide

49. @LoukilAymen
    #BrightonSEO
    Audit in field
    Prioritize
    Implement
    Test in Lab
    Fast validate
    on users
    Hear your users experience, validate your effort with them
    Iterate
    Now you can use Lighthouse..
    

    View Slide

50. Audit in the field
    (Hear your users experience)
    STEP 1
    

    View Slide

51. @LoukilAymen
    #BrightonSEO
    Identify improvement points for each metric/
    device
    

    View Slide

52. @LoukilAymen
    #BrightonSEO
    Identify improvement points for each metric/
    device
    Detect distribution gaps between devices
    

    View Slide

53. @LoukilAymen
    #BrightonSEO
    See how your audience LCP distributes
    

    View Slide

54. @LoukilAymen
    #BrightonSEO
    See how your audience distributes
    75% of your
    users are
    facing a 6.1s
    LCP
    loading!!
    

    View Slide

55. @LoukilAymen
    #BrightonSEO
    Compare against competition’ audience
    experiences
    

    View Slide

56. @LoukilAymen
    #BrightonSEO
    How my geo-audience is experiencing it
    

    View Slide

57. Prioritize.
    (Do the right thing first)
    STEP 2
    

    View Slide

58. @LoukilAymen
    #BrightonSEO
    Sort your top page-types per metric
    Domain data Page-level data
    
    
    

    View Slide

59. @LoukilAymen
    #BrightonSEO
    Identify low-hanging fruits
    Start with this
    listing page
    template
    

    View Slide

60. Implement & Audit in lab.
    (Implement, test)
    STEP 3
    

    View Slide

61. @LoukilAymen
    #BrightonSEO
    Audit in field
    Prioritize
    optimizations
    Implement
    Test in Lab
    Fast validate
    on users
    Iterate
    Now you can use Google Lighthouse!
    

    View Slide

62. Validate the outcomes.
    (Don’t wait 28 days..)
    STEP 4
    

    View Slide

63. @LoukilAymen
    #BrightonSEO
    34%+ Desktop CLS increase in 10 days - PDP
    Validated
    Deployed
    

    View Slide

64. @LoukilAymen
    #BrightonSEO
    +7% Mobile LCP improvement in one week - PLP
    

    View Slide

65. @LoukilAymen
    #BrightonSEO
    +7% Mobile LCP improvement in one week - PLP
    Validated
    Deployed
    

    View Slide

66. @LoukilAymen
    #BrightonSEO
    LCP P75th percentile chart going down!
    4.2s => 2.3s
    

    View Slide

67. @LoukilAymen
    #BrightonSEO
    Feb 2020
    Mar 2020
    Remember this frustration?
    

    View Slide

68. @LoukilAymen
    #BrightonSEO
    Fast detect regressions - CLS on PDP
    😞
    

    View Slide

69. @LoukilAymen
    #BrightonSEO
    Set up regression Slack alerts
    

    View Slide

70. @LoukilAymen
    #BrightonSEO
    Validate monthly to confirm the outcomes
    Domain-level LCP on Mobile
    

    View Slide

71. Thank you!
    Aymen Loukil
    @LoukilAymen
    https://speetals.com
    International SEO and Web
    Performance Consultant
    

    View Slide