(artist: Hiroshi Nagai)
(Paul Irish, Elizabeth Sweeny: Google I/O 2019)
The speed it takes to load a page:
How easy it is to find what I'm looking for:
How well the site fits my screen:
How simple the site is to use:
How attractive the site looks:
75%
66%
61%
58%
24%
(Paul Irish, Elizabeth Sweeny: Google I/O 2019)
1s to 3s : the probability of bounce increases
1s to 5s : the probability of bounce increases
1s to 6s : the probability of bounce increases
1s to 10s : the probability of bounce increases
32%
90%
106%
123%
Pinterest saw a
sign-up increase by reducing the user's perceived wait time by
15%
-40%
(source: the humanbenchmark study)
Mental Chronometry
The average human response time is
(Chromium Dev Tools profiling twitter.com)
Goal: ~3s
Total:
Humans
(Google's optimal mobile performance benchmark)
There's less of a latency budget than you think.
(Microsoft Research: Applied Sciences Group, 2012)
Goal: ~3s
Total: 50ms
Humans
Hardware
Goal: ~3s
Total: 2.6s
Humans
Hardware
(Mach Metrics: Average time to first bite on mobile in 2021)
(Cloudflare: Serverless cold start average)
Average page load time on mobile:
(Google: average mobile page load time)
Goal: ~3s
Total: 3.9s
Humans
Hardware
Web Apps
Goal: ~3s
Total: 12.2s
Humans
Hardware
Web Apps
Goal: ~3s
Total: 14.9s
Humans
Hardware
Web Apps
Goal: ~3s
Total: 15.3s
Humans
Hardware
Web Apps
Goal: ~3s
Total: 16.3s
Humans
Hardware
Web Apps
Other relevant latencies are
adds of latency to the average packet (500b)
(Noction: Network latency and its effect on application performance)
Africa
Middle East
Europe
LATAM
North America
(Heavy Traffic)
Your app's user
Wowie Zowie!
Telegraf
Time-Series Data Polling & Collection -or- Incoming Data Source Handler
InfluxDB
A high-write-frequency Time-Series DataBase
Chronograf
Data Visualization Platform (Dashboards)
Kapacitor
Alert Monitoring (using thresholds or inactivity)
A Data Source
A Data Store and/or Handler
(TSDB ingestion service or API)
A Data Visualization Tool
where you can set alerts
(signups, posts, logins, etc)
(Photograph by Will Van Overbeek)
InfluxDB OSS API
Telegraf
Grafana
Prometheus
Chronograf
+
Chronograf + Kapacitor
Like PerformanceObserver
github.com/DataDog/browser-sdk
https://github.com/DataDog/datadog-agent
github.com/DataDog/browser-sdk/blob/main/packages/rum-core/src/rumEvent.types.ts
and get in the flow of
Real User Monitoring
Latency: What you can control on the front end (SCALE)
By Ben Michel
Latency: What you can control on the front end (SCALE)
- 728