Getting Started with Web Performance
Learn about performance on the web with tutorials on the concepts, tools, and tactics to make your site faster.
Measuring Web Performance in 2022: The Definitive Guide
This is the complete guide to the metrics, methods, and measurements of web performance in 2022.
If you run a website, this guide has all the fundamental ideas you need to understand to build a fast website for your users, and for search engines.
Contents
Chapter 1
...
Learn More
See Current Core Web Vitals with Chrome
Google is using Core Web Vitals as a factor in search results rankings. They’ve also found that improving Core Web Vitals can lead to increased traffic, sales and ultimately conversions. But how can you see your Core Web Vitals easily?
Learn More
Using Brotli Compression in NGINX
Brotli is gaining steam as the compression algorithm du jour for high performance websites. Created back in 2013 by Google to decrease the size of WOFF files, Brotli was standardized in 2016 as part of RFC 7932. The sales pitch for Brotli is better compression than Gzip - with similar CPU usage. ...
Learn More
Optimizing Images for Web Performance with NGINX
Images are a constant source of pain when developing websites. There are many formats and resolutions a developer must consider in order to maximize web performance. You’ll often end up with a cartesian explosion of the same image in different sizes and formats to support different scenarios.
Learn More
HTTP/3 is Fast
HTTP/3 is here, and it’s a big deal for web performance. See just how much faster it makes websites!
Learn More
Google Ads Are Slowing You Down
Google has a well earned reputation for speed. At least on their own sites. It’s an entirely different story when it comes to their ad network. Google ads are slowing down thousands of sites across the internet.
Learn More
Optimizing Static HTML And Images With Webpack
Webpack is great for building JavaScript applications, but did you know it can optimize static HTML assets too? In this article, we use Webpack to process HTML files while automatically optimizing their images too.
Learn More
Audit Google Ad Performance With Lighthouse
Implementing Google Ads can be complicated. If done incorrectly, it negatively impacts your website’s performance. Fortunately, there is a new Google Lighthouse plugin tailored specifically to find problems with your Google ad implementation.
Learn More
Measuring Largest Contentful Paint
Largest Contentful Paint (LCP) is a measurement of how long the largest element on the page takes to render. It’s one of several Web Vital metrics that measure how real users perceive the performance of modern web applications. New measurements like Largest Contentful Paint are increasingly impor...
Learn More
5 Tips To Make Google Fonts Faster
Google Fonts is a fantastic tool for web designers and developers, but it is sometimes one of the slowest resources on your website. It’s frustrating and ironic that Google’s own font service is the long pole in so many web performance reports, but it doesn’t have to be! Here’s 5 ways to supercha...
Learn More
Measuring Cumulative Layout Shift
Cumulative Layout Shift (CLS), sometimes known as jank, is a measurement of how much elements move due to late-rendered content. You can think of it as a measurement of layout instability. It has become a common problem for many websites due to third-party scripts and tag management and its one o...
Learn More
How To Read Flame Charts and Percentiles
Charting can be complicated and intimidating, especially when dealing with web performance data, flame charts, and percentiles. There is so much data crammed together! Why are the numbers all different?! Let’s break down these charts, what they are good for, and when to use them.
Flame Charts
...
Learn More
Web Performance Profiling: Google.com
How is Google so fast? It’s so fast we take it for granted. It feels instant from the time you search to when results are displayed. What can we learn about the techniques they use to make their site so fast?
Learn More
Fix Your First Contentful Paint: Cheat Sheet
Are slow FCP scores getting you down? Worried that website performance is frustrating your users and hurting your SEO rankings? This FCP cheat sheet has all the tactics (with links) you’ll need to have screaming-fast FCP scores.
First Contentful Paint (FCP) is a measurement of how long it takes...
Learn More
Fast Inline Images With React and Webpack
Webpack is great for building React applications, but did you know it can help you optimize app performance too? Webpack can automatically inline image data, improving performance by reducing the number of requests your page needs to make. Let’s learn how.
Learn More
Synthetic Testing and Real User Monitoring
Synthetic Testing and Real User Monitoring are the most important tools in your performance toolbox. But they do different things and are useful at different times and many developers only spend time mastering one of these tools and only see a part of their performance problems, like trying to h...
Learn More
Measuring First Input Delay
First Input Delay (FID) measures how long the browser took to respond to the first user input event. It’s one of several Core Web Vital metrics that measure how real users perceive the performance of modern web applications. New measurements like First Input Delay are increasingly important as Ja...
Learn More
High Performance Images: 2022 Guide
Images engage users, drive clicks, and generally make everything better–except performance. Images are giant blobs of bytes that are usually the slowest part of your website. This 2022 guide has everything you need to know for fast images on the web.
Images are big. Really big. The bytes requ...
Learn More
Advertising's Performance Tradeoffs
Advertising is everywhere on the web and users have noticed. More than 40% of internet users block ads. Are these users sticking it to the man or just tired of slow site performance? To find out, we measure advertising’s performance impact on a few popular sites.
Learn More
Using First Contentful Paint - FCP
First Contentful Paint, or FCP, measures the time take to render the first element of a webpage. It’s a modern, user-centric measurement of how fast users see a response from your website. Here’s everything you need to know about the metric and how to use it.
Learn More
Using HTTP Caching: 2022 Guide
The fastest website is the website that is already loaded, and that’s exactly what we can do with HTTP caching. HTTP caching lets web browsers reuse of previously loaded resources, like pages, images, JavaScript, and CSS. It’s a powerful tool to improve your web performance, but misconfiguration ...
Learn More
The Limitations of Lighthouse
Google Lighthouse helps you identify page performance issues. It generates an overall performance “score” to make you feel good (or bad) about your site’s speed. This score can be useful, but has some limitations.
Learn More
Web Performance Profiling: Instacart.com
Grocery shopping is tedious and time consuming. In search of a more streamlined experience, I decided to try Instacart. Unfortunately, using their site is also tedious and time consuming.
Learn More
Web Performance Profiling: Nike.com
Google has long used website performance as a ranking criteria for search results. Despite the importance of page experience for SEO, many sites still suffer unacceptable load times. Poor performance is often a confluence of factors: slow time to first byte, hundreds of resource requests, and w...
Learn More
Fastest News: Best Performing News Website
News teams often compete to break the story first. We think they should also compete on being the first to load their website. Let’s apply our web performance skills to a real world example: which news website has the best performance?
Learn More
Privacy and Ethical Web Analytics
Web analytics is often based on invasively collecting and aggregating user data. But web analytics doesn’t have to be an invasion of privacy. A growing movement of businesses, including performance monitoring services like Request Metrics, are working to create sustainable web analytics tools. To...
Learn More
Vital Web Performance
I hate slow websites. They are annoying to use and frustrating to work on. But what does it mean to be “slow”? It used to be waiting for document load. Then waiting for page ready. But with so many asynchronous patterns in use today, how do we even define what “slow” is?
Learn More
How Hacker News Crushed DavidWalshBlog
Earlier this month, David’s heartfelt posting about leaving Mozilla made the front page of Hacker News. Traffic increased by 800% to his already-busy website, which slowed and eventually failed under the pressure. Request Metrics monitors performance and uptime for David’s blog, and our metrics t...
Learn More
Tutorial: Monitoring Your Core Web Vitals
Web performance used to be easy. You’d time how long a page takes to load, easy.
But the rise of client-side JavaScript has introduced bold new ways for websites to be frustratingly slow. Measuring this new slowness will take new metrics. Google calls them the Core Web Vitals.
Each of the Core ...
Learn More
Get More Web Performance Tips
Join Sam the Performance Sloth's newsletter for more fresh web performance reviews, ideas, and tools.
Subscribe
About Request Metrics
The easiest way to monitor your web performance. Request Metrics shows how real users experience your website and with fast and simple reports. And at a price that's easy on your budget.