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

Defining Fast: The Hardest Problem in Performance Engineering

Defining Fast: The Hardest Problem in Performance Engineering

We all want fast sites, but what is fast? What is performant? We may know it when we see; yet quantifying and communicating about web performance effectively is still a challenge. In this talk, we will discuss our ever-evolving set of standards for what comprises a fast site, how to measure it, and what to do once we have the resulting data.

Zack Tollman

November 02, 2019
Tweet

More Decks by Zack Tollman

Other Decks in Technology

Transcript

  1. Defining Fast
    The Hardest Problem in Performance Engineering
    Zack Tollman | Condé Nast

    View full-size slide

  2. Time to
    Sammie

    View full-size slide

  3. Time to
    Purchase

    View full-size slide

  4. 1. Metrics
    2. Observing
    3. Reporting

    View full-size slide

  5. The Load
    Event

    View full-size slide

  6. Golden Age of
    Performance Metrics

    View full-size slide

  7. JS Parse/Compile Time Load Time Start Render
    First Contentful Paint MS First Paint Total Byte Weight
    Time to Interactive First CPU Idle Hero Element Load Time
    DOM Content Loaded First Paint Total Requests
    Perceptual Speed Index First Meaningful Paint Speed Index

    View full-size slide

  8. What Should
    You Care
    About?

    View full-size slide

  9. Does the Page Appear
    to be Loading?

    View full-size slide

  10. Server Timing API - Time to First Byte
    Start Render - First Paint
    First Contentful Paint

    View full-size slide

  11. Can I see
    meaningful content?

    View full-size slide

  12. First Meaningful Paint
    Speed Index
    Element Timing API

    View full-size slide

  13. Can I click on
    or scroll the page?

    View full-size slide

  14. First CPU Idle
    First Input Delay
    Rage Clicks

    View full-size slide

  15. Does the page
    continue to be usable?

    View full-size slide

  16. Time to Interactive
    Long Tasks
    User Timing API

    View full-size slide

  17. User-centric
    Performance Metrics
    https://developers.google.com/web/fundamentals/performance/user-centric-performance-metrics

    View full-size slide

  18. Metrics Picked
    Now What?

    View full-size slide

  19. Measure
    The Metrics

    View full-size slide

  20. Synthetic
    Monitoring

    View full-size slide

  21. Location Network
    Device Browser

    View full-size slide

  22. Test Frequency

    View full-size slide

  23. RUM: Real User
    Monitoring

    View full-size slide

  24. Instrumentation
    Challenges

    View full-size slide

  25. Variance
    is Provided

    View full-size slide

  26. Test with Synthetic
    Verify with RUM

    View full-size slide

  27. Performance Observed
    Now What?

    View full-size slide

  28. mean median
    percentiles histograms
    standard deviation

    View full-size slide

  29. Accessibility
    Percent Change
    Competitor Analysis
    Product Comparisons

    View full-size slide

  30. Defining Fast Defines Your
    Performance Culture

    View full-size slide

  31. speakerdeck.com/tollmanz

    View full-size slide