How Fast Does Your Website Need To Be
How Fast Does Your Website Need To Be
move to the cloud. They’ve also fundamen- need to measure a few important themes of user experience.
tally changed the way their teams deliver Choose a few categories from different components of your page
software, and might even use Kuberne- experience. Listed below are some of those categories, with New
tes to scale faster. They face tons of com- Relic’s metrics and their definitions:
Our answer is usually the same: “It depends.” • First Contentful Paint (FCP): How long until content
begins to render
Admittedly, that’s not a response anyone
• Largest Contentful Paint (LCP): How long until the largest image
wants to hear. Unfortunately, the truth is
or video begins to render
that—while uptime is easy to quantify—
there is no single metric to clearly define User Interactivity
page performance.
• First Interaction: Measures when a user first engages
Studies point to the fact that “faster is bet- with your page
ter.” Gomez, the web performance division
• First Input Delay (FID): The time from when the user engages
of Compuware, found that after three sec-
until the web browser processes the interaction
onds of waiting, up to 40% of users aban-
don a site. Additionally, Walmart found that Visual Stability
improving page speed by even 100ms saw
• Cumulative Layout Shift (CLS): Measures how end users
revenue increase 1%. However, while speed
experience sudden unexpected shifts from your content
is a critical component, it’s only one part of a
dynamically resizing
dynamic page experience.
• Long Tasks: Measures JavaScript code that blocks the
Customers navigate your site on a dizzying
main thread
combination of web browsers (and their dif-
ferent versions), devices (both new and old),
02
How Fast Does Your Website Need to Be?
and networks (from high-speed to sluggish hotel internet). Each person tolerates speed and perfor-
mance in their own way. Luckily for us, we have data and some general rules to inform the optimi-
zation process.
While “it depends” can be frustrating to hear, it’s a great opportunity to explore web page fun-
damentals, customer happiness, and creating a performance-focused culture throughout a
digital business. Here’s New Relic’s approach to page speed and performance using Full-Stack
Observability, some general rules to follow, as well as a step-by-step guide to creating your
own dashboards to keep tabs on your digital properties.
To more precisely measure performance, it’s helpful to capture metrics that reflect how users
perceive the experience your pages deliver. User-centric perceived performance metrics help
site owners understand key components of their page experience, such as how fast they deliver
visual content, how fast their pages respond to user interaction, and how their page creates a
smooth experience when loading.
LCP
(loading)
FID
alongside each measurement. For each measurement, Google recom- (interactivity)
New Relic is all about your data. Our Real User Monitoring agent offers Good Needs improvement Poor
0.1 0.25
eight total event types, each with dozens of attributes to help mea-
sure, benchmark, and alert on JavaScript errors, single-page appli-
03
How Fast Does Your Website Need to Be?
(Note: We need to load large images much faster, because we’ve passed the “poor” threshold.)
04
How Fast Does Your Website Need to Be?
05
How Fast Does Your Website Need to Be?
06
How Fast Does Your Website Need to Be?
(Note: We need improvement; the metric is yellow because we’ve passed the warning threshold.)
3. Find how many users are having good, tolerable, or poor experiences:
(Note: There is a segment of “unknowns” because not all web browsers provide CLS.)
07
How Fast Does Your Website Need to Be?
Lab data collected from synthetic monitors is useful for optimizing page performance through-
out the DevOps process. It’s called lab data because you’re using a predefined set of conditions
(typically across fast networks, with specific browsers or devices) to simulate user engagement
and measure feedback. Synthetic monitors help tune performance because you can find latency
and errors before releasing to production.
Also, developer-focused synthetic solu-
tions provide the ability to use JavaScript
to fully recreate all page components and
dependencies, therefore site operators can General Rule #3: Be as fast, if not 20% faster,
understand the health of their functionality
than your competition
and performance beyond uptime. Given a limited amount of developers, time constraints, and the
resources deemed necessary to track and measure your online
Modern web pages rely heavily on APIs and
business, it might not be possible to achieve a “good” score in all of
third parties to deliver information. Syn-
Google’s Core Web Vitals. The 20% rule says that in order for users
thetics’ scripted API monitor goes beyond
to barely notice a difference in time duration, it has to be changed by
uptime to show request/response times,
a minimum of 20%. Therefore, we can create synthetic monitors and
connection times, and information on pay-
leverage paint timing metrics (FP, FCP) to compare, and set objective
load size.This helps you determine if your
targets for how quickly we deliver visual content vs. our competition.
APIs are up, fast, and returning valid results.
08
How Fast Does Your Website Need to Be?
To further tune performance, web developers access Long Tasks, bytes transferred (aka page
weight), page resource performance, and resource waterfall charts for each monitor result.
(Detailed waterfall chart of long tasks, bytes transferred, and requests made)
09
Take action
If you want to create a culture of performance, you must first start with measuring a
few core components of your page experience.
While “it depends” can be frustrating to hear—especially for managers who have enough com-
plexity across backend services and infrastructure—it’s also an opportunity to understand how
sites impact end users, and what drives their online satisfaction. “How fast do we need to be?”
can also result in clearer goals and increased understanding between engineering and market-
ing teams, and better business results.
faster. Understand the impact that APIs speed and performance. For general best practices, the
and third parties have on your page perfor- folks at web.dev are your best bet. Rick Viscomi’s chapter
mance. Use New Relic and other great tools on performance from 2019’s Web Almanac is a super-de-
such as Google Lighthouse to find perfor- tailed guide to understanding “where to start.” To help
mance bottlenecks and ensure successful embed performance into your builds and development
© Copyright 2020, New Relic, Inc. All rights reserved. All trademarks, trade names, service marks and logos referenced herein belong to their respective companies. 11.2020