Skip to content

Tame third parties, master performance budgets & learn from Airbnb's new case study

May 23, 2023

SpeedCurve

Hi there,

These days, it feels like there's a lot of energy in the performance community. We're slowly returning to in-person events, and it's so wonderful to see both new and familiar faces. If you're new to performance (or just need a refresher), I hope you find this newsletter helpful.

In this edition:

  • How fast are the most popular travel sites for mobile users?
  • A complete guide to performance budgets
  • Introduction to Interaction to Next Paint
  • How to tame the impact of third parties on your pages
  • How Airbnb improved performance with HTTP streaming
  • A quick CI/CD survey

There's lots of great stuff below, so let's get scrolling!

Tammy
m: @tammy
t: @tameverts

––––––––––––––––––––––––––––––

How Fast are the Top Travel Sites?

Chances are you're starting to think about vacation plans, so this is a good time to check out the speed benchmarks for leading travel sites.

Looking at the results for mobile devices on a slow connection – which is a helpful way to think about your users who might be on the road or in airports, struggling with low bandwidth and spotty wifi – it's heartening to see a few sites that manage to start rendering in less than 4 seconds.

For the sites that struggle, the performance challenges are all-too-common issues:

  • Slow render-blocking JS and CSS
  • Unoptimized fonts
  • Too many requests
  • Huge page sizes, often caused by massive image and video files

(Page Speed Benchmarks is a public-facing, interactive set of dashboards. We test and rank industry-leading websites based on how fast their pages appear to load from a user’s perspective. It's a handy tool for benchmarking your own site, as well as digging down to see how the fastest and slowest pages in the dashboards are built.)

––––––––––––––––––––––––––––––

A Complete Guide to Performance Budgets

What do companies with fast websites have in common? They use performance budgets to prevent regressions. This guide has been a long time coming. In it, I've collected proven best practices to help you:

  • Fight regressions and stay fast
  • Identify performance budgets vs goals (they're different!)
  • Track the right metrics
  • Determine budget thresholds
  • Integrate with your CI process
  • Build performance culture in your organization

I'd love your feedback. And if you have other tips to share, please let me know!

––––––––––––––––––––––––––––––

Farewell FID... and hello
Interaction to Next Paint!

Recently at Google I/O 2023, it was announced that Interaction to Next Paint (INP) is no longer an experimental metric. INP will replace First Input Delay (FID) as a Core Web Vital in March of 2024.

In this post, Cliff Crocker does more than explain what Interaction to Next Paint is and how it's measured. He looks at real user data and creates conversion correlation charts that show how INP aligns with actual user behaviour. It's all about the users!

––––––––––––––––––––––––––––––

How to Optimize INP

Now that we're clear on the value of tracking INP, the next step is figuring out how to make it faster. Luckily, the Chrome DevRel team has us covered with this collection of resources that includes tips for things like:

  • Troubleshooting slow interactions in the field and in the lab
  • Optimizing poor INP caused by JavaScript issues
  • Optimizing poor INP caused by rendering issues

––––––––––––––––––––––––––––––

Taming the Impact of Third-Party Tags

Every time I watch one of Andy Davies' talks, I learn new things. His recent talk at We Love Speed is no exception. In this must-watch video, Andy shares the approaches and practical steps he uses to help companies reduce the impact that tags have on the speed of their visitors’ experience. He shows how to choreograph tags to reduce their impact, and then covers approaches for monitoring and debugging tag performance.

––––––––––––––––––––––––––––––

Case Study: How Airbnb Improved Performance with HTTP Streaming

Victor Lin at Airbnb shares how HTTP streaming has been a successful performance strategy for the booking site:

You may have heard a joke that the Internet is a series of tubes. In this blog post, we’re going to talk about how we get a cool, refreshing stream of Airbnb.com bytes into your browser as quickly as possible using HTTP Streaming.

––––––––––––––––––––––––––––––

Please Take a Minute to Fill Out
Our CI/CD Survey

Integrating SpeedCurve into your CI process is a great way to streamline how you monitor – and get alerts on – the metrics that matter most to you. We're about to make a bunch of improvements to SpeedCurve to support your preferred development workflow, and we would love your feedback. This survey should only take a couple of minutes and will help us make SpeedCurve even better for you and your team.

––––––––––––––––––––––––––––––

Our Newsletter Goes Public!

A lot of folks have asked us to make this newsletter public – so we did! You're already a subscriber of course, but if you know anyone who isn't a SpeedCurve user who might enjoy getting these monthly emails, they can sign up (and browse our archive) here. No strings attached!

––––––––––––––––––––––––––––––

Look for SpeedCurve at These Events

We're so excited to be sponsors for these upcoming events. If you're planning to attend, let us know. We'd love to see you there!

––––––––––––––––––––––––––––––

Questions? Feedback? Let me know!

As always, I welcome your questions and feedback. Let me know your thoughts by replying to this email or sending a note to support@speedcurve.com.