Keeping users engaged on your website means creating an experience that’s swift, responsive, and intuitive. Users are impatient! If a site is sluggish or confusing, they will leave…and maybe for good! Even well-performing sites can be tweaked and tuned for top performance. One of the best ways to optimize your site is by conducting a full review of its key performance indicators to drive solid recommendations for improvement. In many cases, performance gains are the result of incremental refinements to many pieces of functionality. By working iteratively, you can track the level of effort and efficacy of each adjustment, ensuring better site performance and a better experience for your users. In this presentation “Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement," Drew Betts of Mercy Corps and John Brandenburg of Forum One provide an in-depth review of the efforts they took to improve site performance on MercyCorps.org. Armed with benchmark data and the results of lots of testing, they demonstrate the variety of approaches and the effective improvements we made – ranging from simple changes in the administrative interface and theming improvements, to caching best practices and server configurations. They also demonstrate the tools used to measure these improvements in discrete increments and as a collective whole. IN THIS PRESENTATION YOU WILL LEARN: • Tips for offering your users a fast and pleasing experience • How to decrease bounce rates and increase conversions • SEO improvements that drive engagement • Ways to make your digital staff happy and more productive! PRESENTED BY: Drew Betts UX Designer Mercy Corps John Brandenburg Developer Forum One Heather Virga Support Manager Forum One

1. Tune Up or Be Tuned Out!
Optimizing Site Performance for User Engagement

3. Forum One is a digital agency that
partners with influential
organizations to craft solutions for
the world’s most pressing problems.
Open
Source Since
1996
2,000
Successful
Projects
750
Influential
Clients
100%
Mission-
driven

6. Nice to Meet You!
John Brandenburg
Developer, Forum One
Heather Virga
Manager of Support, Forum One
Drew Betts
UX Designer, Mercy Corps
Introduction

7. Partnership with Forum One
Our support services are designed to drive consistent long-term
progress toward your organizational goals.
● Dedicated team of developers, themers, quality assurance testers, and project
managers are available to help support your web presence.
● Bi-annual strategic planning workshops to discuss current business
imperatives and audience needs that inform and drive future work.
● Quarterly retainer support for sprint-based development and as-needed
ticket-based support.
● Fully managed hosting services with 24/7 on-call site support, 365 days a year.
Introduction

8. Who is Mercy Corps, what they do, and why
is site speed important for their mission?
Mercy Corps
Introduction

9. Who is
Mercy Corps?

10. Responding to Emergencies

11. Building Back Better

12. Why is Site Speed Important?

13. Introduction to speed
Introduction

14. Mobile was worse
Introduction

15. Conversion rate
For every one second of
improvement in load time, they
experienced up to a 2% increase
in conversions
For every 100 milliseconds of
improvement, incremental
revenues grew by up to 1%
Source: Walmart
Introduction

16. Other negative effects
● Negatively impacts SEO
● Lowers perceived credibility and quality
● Frustrates users
● Increases bailout rate
Introduction

17. Evaluating Performance
& Engagement

18. What is Site Speed?
Evaluating Performance and Engagement
How fast a page loads (load time)
How fast a page appears to load (start
render)
● Page load
● Time to first byte
● Start render

19. It’s actually a pretty
complex subject
Evaluating Performance and Engagement
DNS Address Lookup
Establishing a Connection
CMS Software Run Time
Executing Javascript
Image optimization
Server Environment
Downloading Assets
Caching

20. Tools: What you need
Evaluating Performance and Engagement
● Analyze your page structure/behavior.
● How optimized are your assets.
● Load testing.

21. What we used
Evaluating Performance and Engagement
● WebPageTest.org
● Google PageSpeed Insights
● Apache Benchmark
● New Relic
● Google Analytics
Future consideration: JMeter

22. Script is available on GitHub
Evaluating Performance and Engagement
https://github.com/johnbburg/performance-testing
Content engagement script here
http://cutroni.com/blog/2014/02/12/advanced-
content-tracking-with-universal-analytics/

23. Process

24. Process
Process
1. Choose tests and metrics
2. Establish baseline & goals
3. Decide on changes and prioritize
4. Develop and apply changes
5. Measure
6. Repeat

25. Choose metrics and tests
Process
Page load speed
Conversion rate
Engagement rate
Response time (Apache)

26. Engagement rate
Process
Tracks how far visitors
read on a page
Additional metrics
+ Bounce rate
+ Pages per visit
Article loaded
Began reading
25%
100%
50%
75%
Bounce rate:
Pages per visit:
97%
39%
6.85%
1.47

27. Establish the baseline
Process
Conversion rate:

28. What to Improve?

29. Before we begin, here are
some easy wins
What to Improve
● Enable Page Cache for Anonymous Users
● Use CSS/JS Aggregation and Page compression
Learn more from blog post on forumone.com:
http://bit.ly/simplesiteboost

30. Improvements for
Mercy Corps
What to Improve
1. Enable Views Caching.
2. Get Page Cache to be consistent.
3. Implement Memcache as the back-end
cache.

31. Maximizing
Performance

32. First Measure: Views Caching
Maximizing Performance
In Drupal, in addition to caching an entire
page, we can cache the parts of it that are
generated by Views.

33. Views Cache Disabled
vs. Enabled:
Homepage (10)
Enabling Views Cache:
Homepage (50)
Maximizing Performance

34. Page cache debugging
Maximizing Performance
Cached pages were served in an erratic way.
Use of the $_SESSION variable.
Expiration changed from 5 minutes to 1 hour.

35. Maximizing Performance
Drupal can use several different
mechanisms for its “Back-end” cache. By
default, it’s the database. But we can
replace this with other tools, that utilize
active memory for cache storage.
Measure: Memcache

36. Bonus:
Entity Cache
Maximizing Performance

37. Impact
Maximizing Performance
Simulated load
tests show Time
to first byte
went from 4.5 s
to 1.5 s on the
Donation page.

38. Responding in Nepal
On April 26th, 2015, a
7.8 magnitude
earthquake struck
Nepal.
Maximizing Performance

39. Responding in Nepal
Traffic spiked over the weekend
to 5x normal levels.
4,000 30,000
Maximizing Performance

40. Content Engagement & Conversion Rate
Maximizing Performance
Impact of first round of changes
Content engagement: ~6%
Conversion Desktop: .09%
Conversion Mobile: .02%

41. For the Future
Maximizing Performance
● Deferred Javascript
● Varnish
● Further work on Mobile

42. Lessons Learned
● Watch your head-ers.
● Performance testing is harder than it
looks.
Maximizing Performance

43. Thank you!
Heather Virga
Manager of Support, Forum One
hvirga@forumone.com
Drew Betts
UX Designer, Mercy Corps
dbetts@mercycorps.org
John Brandenburg
Developer, Forum One
jbrandenburg@forumone.com