It’s 2022 and highly skilled engineering teams are yet to be immune against seasonal web performance regressions. Is performance a particularly tricky discipline – or is it a cultivated frame of mind? At performance.now() 2022, I drew from collective reflections and my own experience, to plate up the tastiest morsels of food for thought on topics like: * Speed ≈ money * Fostering (and scaling) a strong performance culture * Embracing apoptosis This was about helping organizations to wrangle that tricky beast: sustainable web performance optimization.

1. @doramilitaru

2. performance

5. “Users really respond
to speed.”
— Marissa Mayer
In Search of... A better, faster, stronger Web (Velocity '09) – youtu.be/WFsQvcdmLxc

6. wpostats.com
“Swappie reduced load time by 23%,
LCP by 55%, CLS by 91% and FID by 90%
and saw a 42% increase in mobile revenue
and a 10 pp increase in relative mobile
conversion rate.”
#revenue .#conversion rate .#2021. BBQ?

7. A site’s carbon impact
as part of #webperf!
— Robin Osborne
What Does My Site
Cost [users]?
— Tim Kadlec
WWW: World Wide Web, not
Wealthy Westerners' Web
— Bruce Lawson

8. 1998 [!]

9. RUM Archive
WebPerfWG

10. “40% of large brands
regress on web performance
within 6 months.”
— Katie Hempenius, Addy Osmani
Speed At Scale (I/O '19) – youtu.be/YJGCZCaIZkQ

11. designingforperformance.com/changing-culture
“The largest hurdle to creating and
maintaining stellar site
performance is the
culture of your organization.”
— Lara Hogan

12. 1. Top-down support
2. Data-driven
3. Clear targets
4. Automation
5. Knowledge sharing
6. Culture of experimentation
7. User focused, not tool focused
timkadlec.com/remembers/2019-05-30-performance-culture-characteristics
— Tim Kadlec
Characteristics of a strong performance culture:

14. a management
maturity model for
performance
infrequently.org/2022/05/performance-management-maturity
— Alex Russell

15. value of
performance
locus of control
tools
users
reactive
tactical
cultural
operational
strategic
understanding of
user needs
understanding of
systems
sustainability

16. photo by matt c

17. speed

18. 🔥 🔍 🛠 🎉
fire
noticeable
performance
degradation
investigation
data points
& metrics
remediation
time, pain
& stress
celebration
relief
& extra dashboards
ad infinitum confidence

19. "the system is up/down"
"they're leaving"
⭐⭐⭐⭐⭐
system
users ⭐⭐⭐⭐⭐

20. preparation identification containment eradication recovery lessons
sans.org/media/score/504-incident-response-cycle.pdf
🔥 🔍 🛠 🎉 ☠📉
📈
󰡰󰙪

21. core web vitals
LCP
(largest contentful paint)
2.5s 4s 100ms 300ms
FID
(first input delay)
0.1 0.25
CLS
(cumulative layout shift)
loading performance interactivity visual stability

22. inconsistent velocity
retention

23. photo by dan meyers

24. speed

25. "the system is complex and must be investigated"
"the average user…"
⭐⭐⭐⭐⭐
system
users ⭐⭐⭐⭐⭐

26. first contentful paint time to interactive total blocking time
largest contentful paint cumulative layout shift time to first
byte start render speed index first input delay interaction to
next paint first CPU idle first meaningful paint total bytes
DOM content loaded navigationStart unloadEventStart
unloadEventEnd redirectStart redirectEnd workerStart
fetchStart domainLookupStart domainLookupEnd
connectStart connectEnd secureConnectionStart
requestStart responseStart responseEnd domLoading
domInteractive domContentLoadedEventStart
domContentLoadedEventEnd domComplete loadEventStart
loadEventEnd

27. slideshare.net/tammyeverts/realworld-performance-budgets-perfnow-2022

28. “We can now afford
~100KiB of HTML/CSS/fonts and
~300-350KiB of JS (gzipped).”
— Alex Russell in 2021
infrequently.org/2021/03/the-performance-inequality-gap

29. fog of
measurements
incidental
collection
meaningful
metrics
continual
reporting
discovery knowledge

30. a11y
security
o11y
privacy
design
testability
performance

31. product success
data
protecting the
commons
lab ≉ field
business value
shared ownership

32. waning focus
product pressure

33. photo by ousa chea

34. speed

35. "at the outlying parts of the distribution, the system behaves…"
"the marginal user…"
⭐⭐⭐⭐⭐
system
users ⭐⭐⭐⭐⭐

36. article
paywall
limited time offer
payment
registration
f(Δv)

37. 0 1 2 3 4 5 6 7
0K
4K
8K
12K
16K
50th (median)
75th
2.521s
1.845s
95th
5.207s
LCP
average
2.4s

39. RUM +
experimentation
reducing
variance
low-noise
lab conditions

40. lab ≉ field
tunnel vision

41. photo by alexandra lazarescu

42. speed

43. "individually innocuous changes add up to a slow bleed"
"important user flows"
⭐⭐⭐⭐⭐
system
users ⭐⭐⭐⭐⭐

44. 🚀
quality
gate
blocks changes that
tank performance
branch commits PR review merge
field + lab

45. continuous
monitoring
performance
budgets
performance
team
reward
people
reactive
remediation
hype
train
silver
bullets
kellanem.com/notes/new-tech

46. featuritis
"In every successful product there lurks the carrier of
an insidious disease called 'featuritis'*, with its main
symptom being 'creeping featurism'."
*John Mashey (early UNIX developer, Bell Labs, 1976)

47. anc. Gr.: ἀπόπτωσις, lit. ''falling off':
an ordered and orchestrated process of
programmed cell death that occurs in
multicellular organisms
software apoptosis
matt.chadburn.co.uk/notes/apoptosis.html

48. leadership turnover
hiring / promoting the wrong people

49. photo by nasa

50. speed

51. "mastery: best possible outcomes in essential flows"
"faster is better, but only when it serves user needs"
⭐⭐⭐⭐🐴
system
users ⭐⭐⭐⭐🐴

52. empowered
to say no
advocate internally +
externally
performance as a
differentiator
way of working > single
optimisation
earned through
product success
fast ≠ free but it
has cumulative value
performance
evangelism
latency
budgets
intelligent
trade-offs
competitive
benchmarking
culture =
strategic asset
business
support

53. great
experiences
consistent
quality
cultural norms
training
guardrails

54. political pressure
failure to reward continual
improvement
maintaining culture + value +
system health

55. reactive
tactical
cultural
operational
strategic
understanding of users
mastery of systems
value of performance
sustainability
recap

56. Do we understand how better performance would improve our
business?
What constraints have we given the team?
Have we developed a management fluency with histograms
and distributions over time?
What support do we give teams that want to improve
performance?
What support do we give mid-level managers who push back
on shiny tech in favour of better performance?
Have we planned to staff a performance infrastructure team?
infrequently.org/2022/05/performance-management-maturity

57. CREDITS: Icons by Flaticon, vectors by Freepik
GIFs by Giphy, and images by Unsplash
thanks!
keep in touch, will you?
@doramilitaru
dmilitaru@fastly.com
#perfnow