Through the eyes of real-world users

1. The State of
PLONE Performance

2. …
© Interaktiv GmbH 2 |

3. …
© Interaktiv GmbH 3 |

4. Why does performance
matter?
© Interaktiv GmbH 4 |

5. User
Experience
© Interaktiv GmbH 5 |
User
Design
Usability
Privacy
Many more..Security
Accessibility
Performance
PERFORMANCE IS JUST ONE PART OF USER EXPERIENCE

6. User
Experience
© Interaktiv GmbH 6 |
PERFORMANCE IS JUST ONE PART OF USER EXPERIENCE
Source: https://developers.google.com/web/updates/2018/08/web-performance-made-easy

7. ✓ Website performance is a Google ranking factor
✓ Impact of web performance optimization on
user experience and busineess metrics are significant
and measurable
© Interaktiv GmbH 7 |
WHY DOES WEB PERFORMANCE MATTER?

8. The Google „Speed Update“
© Interaktiv GmbH 8 |
WHY DOES WEB
PERFORMANCE MATTER?

9. © Interaktiv GmbH 9 |
Source: www.wpostats.com
WHY DOES WEB PERFORMANCE MATTER?

10. Monetary impact estimation of
performance improvements
© Interaktiv GmbH 10 |
WHY DOES WEB PERFORMANCE MATTER?

11. © Interaktiv GmbH 11 |
WHY DOES WEB PERFORMANCE
MATTER?
Source: https://www.thinkwithgoogle.com/marketing-resources/data-measurement/mobile-page-speed-new-industry-benchmarks/

12. © Interaktiv GmbH 12 |
WHY DOES WEB PERFORMANCE
MATTER?

13. © Interaktiv GmbH 13 |
JAPAN UNITED STATES
GERMANY UNITED KINGDOM
Source: https://www.thinkwithgoogle.com/marketing-resources/data-measurement/mobile-page-speed-new-industry-benchmarks/

14. What we take away from available statistics:
 Mobile pages are almost as heavy as desktop pages
 More than half of overall web traffic comes from mobile. But: mobile conversion rates
are lower than desktop.
 The average time it takes to fully load a mobile landing page on 4G takes about 15
seconds.
 53% of mobile site visits leave a page that takes longer than 3 seconds to load.
 More than 60% of mobile connections worldwide are 2G.
© Interaktiv GmbH 14 |
WHY DOES WEB PERFORMANCE MATTER?

15. 15 |
Source: https://developers.google.com/web/updates/2018/08/web-performance-made-easy

16. How do we measure
performance?
© Interaktiv GmbH 16 |

17. © Interaktiv GmbH 17 |
Analyze how a
website is built:
• Is it built on Plone?
• How many bytes does it load?
• Does it use a CDN?
• Are images optimized?
Analyze real user
experiences:
Public tools
Tools that tell us about the
state of the web
Personal tools
Tools that tell us about particular
websites
• Desktop or mobile? (Device)
• WIFI or 4G? (Connection)
• Fast or slow page load?
(Performance)
• Visitor journey? (Behaviour)
• HTTP Archive (how it is built)
• Chrome UX Report
(User Experience)
• Browser Developer Tools
(how it is built)
• WebPageTest (how it is built)
• Google Analytics, PIWIK (User
Experience)
HOW DO WE MEASURE PERFORMANCE?

18. How does Plone perform in the HTTP archive?
© Interaktiv GmbH 18 |

19. © Interaktiv GmbH 19 |
PLONE ECOSYSTEM IN HTTP
ARCHIVE
Source: https://trends.builtwith.com/cms/Plone

20. © Interaktiv GmbH 20 |
PLONE ECOSYSTEM IN HTTP
ARCHIVE
Source: https://httparchive.org/

21. Total Page Weight (Plone)
© Interaktiv GmbH 21 |
Image Weight (Plone)
Average Desktop
2214.6 KB
= 1168.4 KB
less than overall
Average Mobile
1997.0 KB
= 747.5 KB
less than overall
Average Mobile
1121.7 KB
= 255.7 KB
less than overall
Average Desktop
1095.9 KB
= 656.2 KB
less than overall
PLONE IN HTTP ARCHIVE

22. How does Plone perform in the Chrome UX Report?
© Interaktiv GmbH 22 |
PLONE IN CHROME UX REPORT

23. First Contentful Paint DOM Content Loaded OnloadFirst Paint First Input Delay
METRICS IN CHROME UX REPORT

24. …
© Interaktiv GmbH 24 |
PLONE IN CHROME UX REPORT

25. © Interaktiv GmbH 25 |
PLONE IN CHROME UX REPORT

26. …
© Interaktiv GmbH 26 |
PLONE IN CHROME UX REPORT

27. …
© Interaktiv GmbH 27 |
PLONE IN CHROME UX REPORT

28. …
© Interaktiv GmbH 28 |
PLONE IN CHROME UX REPORT

29. © Interaktiv GmbH 29 |
PLONE IN CHROME UX REPORT

30. Statistically, Plone performs not too
badly in the Chrome UX Report.
Where is my website?
© Interaktiv GmbH 30 |

31. © Interaktiv GmbH 31 |
PERSONAL TOOLS

32. © Interaktiv GmbH 32 |
PERSONAL TOOLS

33. © Interaktiv GmbH 33 |
PERSONAL TOOLS

34. We tested 35 Plone sites on Webpagetest.org
© Interaktiv GmbH 34 |
THE STATE OF PLONE PERFORMANCE

35. We tested 50 Plone sites on Webpagetest.org
© Interaktiv GmbH 35 |
PLONE
ECOSYSTEM

36. What can we do better?
© Interaktiv GmbH 36 |
THE STATE OF PLONE PERFORMANCE

37. Awareness for performance as an important UX issue…
Develop for mobile connections
Develop mobile first
Performance as an acceptance criteria in your user stories
Monitor performance from a user perspective (load time)
Make Plone distinguish between mobile and Desktop – UX!
Publish case studies of performance improvements
37 |
PLONE
PERFORMANCE:
WHAT CAN WE
DO BETTER?

38. Development: Use documented profiling/monitoring tools
Add image optimization tools
Document best practices
Educate about image handling
Addon idea: Content statistics for editors. E.g. “how large is your
page?”
© Interaktiv GmbH 38 |
PLONE
PERFORMANCE:
WHAT CAN WE
DO BETTER?

39. One more last thing…
© Interaktiv GmbH 39 |
THE STATE OF PLONE PERFORMANCE

40. …
© Interaktiv GmbH 40 |
DOES HEADLESS SOLVE THE PROBLEM?
https://webpagetest.org

41. …
© Interaktiv GmbH 41 |
DOES HEADLESS SOLVE THE PROBLEM?
https://webpagetest.org

42. You‘ll find this presentation on
Slideshare.
© Interaktiv GmbH 42 |
THANK YOU!
zell@interaktiv.de
#InteraktivKoeln
https://www.linkedin.com/in/joergzell/
https://www.linkedin.com/company/interaktiv-gmbh
https://www.xing.com/profile/Joerg_Zell/
https://www.xing.com/companies/interaktivgmbh
By e-mail:
On Twitter:
At LinkedIn:
At XING:
Contact
me