This document summarizes efforts by Forum One, a web development company, to improve the site speed and performance of Mercy Corps, a humanitarian aid organization. Key points: - Forum One conducted tests on Mercy Corps' site using tools like WebPageTest and Google PageSpeed Insights to establish baselines and identify improvements. - Initial easy wins included enabling page caching, optimizing cache configuration, and implementing Memcache as a backend cache. These reduced load times on key pages like the homepage and donation page. - When natural disasters in Nepal drove major traffic spikes to Mercy Corps' site, the improvements helped the site handle the increased load without degrading the user experience. - Metrics like

1. May 13, 2015
Maximizing Site Speed with
Mercy Corps
#mercyspeed
1

2. Nice to Meet You!
Nice to meet you!
John Brandenburg
Developer, Forum One
@johnbburg
Drew Betts
UX Designer, Mercy Corps
2

3. 3

4. Representative Clients 4

5. 5

6. 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.
6

7. Who is
Mercy Corps?
7

8. Responding to Emergencies
8

9. Building Back Better
9

10. Why is Site Speed Important?
10

11. Introduction to speed
11

12. Mobile was worse
12

13. 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
13

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

15. Evaluating Performance
& Engagement
15

16. 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
16

17. It’s actually a pretty complex subject
Evaluating Performance and Engagement
● DNS Address Lookup
● Establishing a Connection
● CMS response time
● Executing Javascript
● Image optimization
● Server environment
● Downloading assets
● Caching
17

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

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

20. 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/
20

21. Process
21

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

23. Metrics and tests
Process
1. Page load speed
2. Conversion rate
3. Engagement rate
4. Response time (Apache)
23
Load
Begin
25%
50%
75%
100%

24. What to Improve?
24

25. Before we begin, here are some easy wins
Maximizing Performance
Page Cache for Anonymous Users
CSS/JS Aggregation and Page compression
See my blog post on forumone.com
25

26. 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
26

27. First Measure:
Views Caching
Maximizing Performance 27

28. 10 Users 50 Users
Views Cache Disabled Vs. Enabled: Homepage
28

29. 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.
29

31. Maximizing Performance
Second Measure:
Memcache
31

32. Bonus:
Entity Cache
Maximizing Performance 32

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

34. Responding in Nepal
Maximizing Performance
On April 26th, 2015, a
7.8 magnitude
earthquake struck
Nepal.
Another 7.3
earthquake struck
Tuesday morning.
34

35. Responding in Nepal
Maximizing Performance
Traffic spiked over the weekend
to 30-40x normal levels.
35
116,0004,000

36. Responding in Nepal
Maximizing Performance 36

37. Responding in Nepal
Maximizing Performance 37

38. Desktop
Results
Before:
Load time
-1.344s
After:
First Byte
- 0.648s
Start render
-0.744s
Visually complete
-6.4s
Impact:
38

39. Mobile
Results
Before:
Load time
-2.879s
After:
Start render
-2.516s
Impact:
Visually complete
0s
39

40. Content engagement - Haiyan & Nepal
40
-10.3%
-5.21%
-8.91%
+.08%
-8.85%

41. Content engagement
Baseline vs. all changes
41
After changes
41% of people reached 100%
Baseline
46% of people reached 100%

42. Conversion rate
Nepal earthquake
4/22/15 - 5/6/15
Typhoon Haiyan
11/8/13 - 11/22/13
42
Baseline
5.57%
2.83%
3.11%
3.05%
1.09%
2.66%

43. For the future
Maximizing Performance
● Deferred Javascript
● Varnish
● Image compression
● Spriting
43

44. Thank you!
Q&A
44