Tackling performance in the WordPress ecosystem at scale
1. in the WordPress ecosystem at scale
Tackling performance
Felix Arntz / WordCamp US 2022
2. Felix Arntz
Software Engineer at Google.
WordPress Core Committer.
I’m also a musician, movie geek, and
regular taco eater (love San Diego for
that already).
I’m @flixos90 on wordpress.org and @felixarntz elsewhere.
4. Breaking down Core Web Vitals (CWV)
(How fast the page loads)
LCP
Largest Contentful Paint
GOOD
NEEDS
IMPROVEMENT
POOR
4.0 sec
2.5 sec
(How quickly interactions work)
FID
First Input Delay
GOOD
NEEDS
IMPROVEMENT
POOR
100 ms 300 ms
(How stable page elements are)
CLS
Cumulative Layout Shift
GOOD
NEEDS
IMPROVEMENT
POOR
0.1 0.25
A page only passes the CWV assessment
if it is in the GOOD range for all three metrics.
Learn more: web.dev/vitals/
5. CWV passing rate of WordPress (mobile)
(How quickly interactions work)
FID
First Input Delay
(How stable page elements are)
CLS
Cumulative Layout Shift
(How fast the page loads)
LCP
Largest Contentful Paint
35.4% 96.4% 73.1%
Source: cwvtech.report
Data from July 2022
😫 😎 🙃
35.4%
6. CWV passing rate of WordPress (mobile)
The WordPress CWV passing rate on mobile is only 28.4%.
Source: cwvtech.report
Data from July 2022
7. CWV passing rate of WordPress (desktop)
On desktop it is not much better with only 32.3%.
Source: cwvtech.report
Data from July 2022
9. The WordPress Performance Team is a dedicated
working group to tackle monitoring, enhancing,
and promoting performance in WordPress core
and its surrounding ecosystem.
Learn more: make.wordpress.org/performance/
11. Formalized as an official WordPress team in July 2022
Learn more: make.wordpress.org/performance/
12. Goals of the WordPress Performance Team
Improve performance at scale through WordPress core
Facilitate decision making based on performance metrics
Raise performance awareness in the ecosystem
13. Improve performance at scale through WordPress core
● A single plugin which allows beta
testing performance-related
WordPress core feature projects,
developed in a GitHub repository
● Simplifies testing performance
features for end users
● Reduces maintenance overhead
for developers
16. Current WordPress Performance Team projects
Project Performance Lab plugin release WordPress core release
WebP Uploads * 1.0.0-beta.1 Committed to launch in 6.1
Persistent Object Cache Health Check 1.0.0-beta.1 Committed to launch in 6.1
Full Page Cache Health Check 1.2.0 Committed to launch in 6.1
Dominant Color 1.2.0 6.1 / 6.2 (anticipated)
Regenerate Existing Images In progress; targeting 1.7.0 6.2 / 6.3 (anticipated)
SVG Uploads In progress; TBD 6.2 (anticipated)
Enqueued Assets Health Check 1.0.0-beta.1 TBD
Autoloaded Options Health Check 1.0.0-beta.2 TBD
* Not using modern image formats (such as WebP) is one of the most
common performance problems affecting LCP.
79% of origins in the CrUX report fail this audit.
18. Why is performance in WordPress so hard?
Uncontrolled
environment
Lack of quality
assurance
Competition by
# of features
Massive amount
of extensions
×
PHP 5.6
Filesystem
cache
MySQL
CDN
20. How can we address the performance challenges?
Enforcing quality
guidelines
Educating
developers
Making performance
an incentive
Automating
performance fixes
Automating
performance fixes
22. ● Don’t just build an API with a single default
● Define heuristics and logic to determine
context-based defaults
● Use lab analysis tools (e.g. WebPageTest,
Lighthouse) to compare alternative heuristics
How can we fix core performance issues automatically?
Build APIs with smart defaults
default: true (if likely outside of the
viewport) or false (otherwise)
default: true
23. How can we fix core performance issues automatically?
Fine tuning options for developers
● Always apply filters and leave room for
customization in any heuristics-based logic
● Keep in mind that an automated fix is not always
as accurate as developer intervention can be
● Define plugin integration points for more
advanced solutions outside of WordPress core
scope (e.g. CDNs)
24. How can we fix core performance issues automatically?
Validation through metrics
● Refine heuristics until it improves performance
for the majority
● Verify that for the rest there are no performance
regressions
● Use field metrics (e.g. Chrome UX report,
web-vitals.js) to validate the real-world impact
follows the lab expectations
25. How can we fix core performance issues automatically?
Implementation based on usage
● Develop routines that inspect frontend behavior
● “Learn” the best behavior from user interaction
● Use server-side content filters (particularly with
Full Site Editing) and client-side logic to get results
as accurate as possible
Database REST API
User agent
sends viewport
related data
processes and
stores data
Optimizes response
based on data
Let’s dream for a moment…
26. • Build APIs with smart defaults
• Fine tuning options for developers
• Validation through metrics
• Implementation based on usage
Summary
Think big!
Photo by Alexander Andrews on Unsplash
big!
big!