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

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

Embed Size (px)

Citation preview

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

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

Page 2: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement
Page 3: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Forum One is a digital agency that partners with influential organizations to craft solutions for the world’s most pressing problems.

OpenSource Since

19962,000Successful

Projects

750Influential

Clients

100% Mission-driven

Page 4: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement
Page 5: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement
Page 6: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Nice to Meet You!

John BrandenburgDeveloper, Forum One

Heather VirgaManager of Support, Forum One

Drew BettsUX Designer, Mercy Corps

Introduction

Page 7: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Partnership with Forum OneOur 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

Page 8: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

Mercy Corps

Introduction

Page 9: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Who is Mercy Corps?

Page 10: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Responding to Emergencies

Page 11: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Building Back Better

Page 12: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Why is Site Speed Important?

Page 13: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Introduction to speed

Introduction

Page 14: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Mobile was worse

Introduction

Page 15: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Conversion rateFor 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

Page 16: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

Introduction

Page 17: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Evaluating Performance & Engagement

Page 18: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

Page 19: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

It’s actually a prettycomplex subject

Evaluating Performance and Engagement

DNS Address LookupEstablishing a ConnectionCMS Software Run TimeExecuting JavascriptImage optimizationServer EnvironmentDownloading AssetsCaching

Page 20: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Tools: What you need

Evaluating Performance and Engagement

● Analyze your page structure/behavior.● How optimized are your assets.● Load testing.

Page 21: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

What we used

Evaluating Performance and Engagement

● WebPageTest.org● Google PageSpeed Insights● Apache Benchmark● New Relic● Google Analytics

Future consideration: JMeter

Page 22: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Script is available on GitHub

Evaluating Performance and Engagement

https://github.com/johnbburg/performance-testing

Content engagement script herehttp://cutroni.com/blog/2014/02/12/advanced-content-tracking-with-universal-analytics/

Page 23: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Process

Page 24: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Process

Process

1. Choose tests and metrics2. Establish baseline & goals3. Decide on changes and prioritize 4. Develop and apply changes5. Measure6. Repeat

Page 25: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Choose metrics and tests

Process

Page load speedConversion rateEngagement rate

Response time (Apache)

Page 26: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

Page 27: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Establish the baseline

Process

Conversion rate:

Page 28: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

What to Improve?

Page 29: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

Page 30: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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.

Page 31: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Maximizing Performance

Page 32: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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.

Page 33: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Views Cache Disabled vs. Enabled: Homepage (10)

Enabling Views Cache: Homepage (50)

Maximizing Performance

Page 34: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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.

Page 35: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

Page 36: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Bonus: Entity Cache

Maximizing Performance

Page 37: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Impact

Maximizing Performance

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

Page 38: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Responding in NepalOn April 26th, 2015, a 7.8 magnitude earthquake struck Nepal.

Maximizing Performance

Page 39: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Responding in NepalTraffic spiked over the weekend to 5x normal levels.

4,000 30,000

Maximizing Performance

Page 40: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Content Engagement & Conversion Rate

Maximizing Performance

Impact of first round of changes

Content engagement: ~6%

Conversion Desktop: .09%Conversion Mobile: .02%

Page 41: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

For the Future

Maximizing Performance

● Deferred Javascript● Varnish● Further work on Mobile

Page 42: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

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

looks.

Maximizing Performance

Page 43: Tune Up or Be Tuned Out! Optimizing Site Performance for User Engagement

Thank you!

Heather VirgaManager of Support, Forum One

[email protected]

Drew BettsUX Designer, Mercy [email protected]

John BrandenburgDeveloper, Forum One

[email protected]