26
Site Speed Tune Up – Putting Your Code on a Diet Brennan Heyde Technical Director – Professional Services 3/8/2012

Site Speed Tuneup: Putting Your Code On A Diet

Embed Size (px)

DESCRIPTION

Miva Merchant Conference 2012 Breakout Session by Brennan Heyde.

Citation preview

Page 1: Site Speed Tuneup: Putting Your Code On A Diet

Site Speed Tune Up – Putting Your Code on a Diet

Brennan Heyde

Technical Director – Professional Services

3/8/2012

Page 2: Site Speed Tuneup: Putting Your Code On A Diet

Overview

• Site Speed – Why Should You Care?• How to analyze your site speed• Techniques used to increase troubleshoot

problems and increase your site speed• Testing Tools• Beyond Coding – Tools to take your site

speed to the next level

Page 3: Site Speed Tuneup: Putting Your Code On A Diet

Why you should care – Visitor Abandonment

• Reduced Bounce Rate - According to surveys done by Akamai and Gomez.com, nearly half of web users expect a site to load in 2 seconds or less, and they tend to abandon a site that isn’t loaded within 3 seconds.

Source: Kiss Metrics

Page 4: Site Speed Tuneup: Putting Your Code On A Diet

Conversion Rate

• A 1 second delay in page response can result in a 7% reduction in conversions – Kiss Metrics

• From Shopzilla.com: Improving the site speed of this popular ecommerce portal by 20% resulted in an improvement in conversion rates of 7% to 12%.  Page views went up by 25%.

• Tests at Amazon, also in 2007 revealed similar results: every 100 ms (that’s 1 tenth of a second) increase in page load time of Amazon.com decreased sales by 1%.

Page 5: Site Speed Tuneup: Putting Your Code On A Diet

SEO – Used in Google’s Ranking

• April 2010 – Site Speed is one of the 200 metrics used to rank a web page.

• “While site speed is a new signal, it doesn't carry as much weight as the relevance of a page. Currently, fewer than 1% of search queries are affected by the site speed signal in our implementation”

Page 6: Site Speed Tuneup: Putting Your Code On A Diet

Where Do I start?

1. Front End Optimization- Reduce number of server requests

- Combine CSS/JS Files

- Use Sprites for icons

- Optimize Images

- Utilize Compression / Caching

- Minify CSS / JavaScript

- Fix all broken Images (404 errors)

- Calls to External Websites (facebook)

Image Sprite

Page 7: Site Speed Tuneup: Putting Your Code On A Diet

Compression – How It Works

Compression can be turned on in your .htaccess file on your server

gidnetwork.com/tools/gzio-test.php

Page 8: Site Speed Tuneup: Putting Your Code On A Diet

Tools - https://developers.google.com/pagespeed/

Page 9: Site Speed Tuneup: Putting Your Code On A Diet

Results:

Page 10: Site Speed Tuneup: Putting Your Code On A Diet

How Fast is My Site?Test with FireBug /FireFox / Chrome Developer Tools

Page 11: Site Speed Tuneup: Putting Your Code On A Diet

Other Tools:• www.pagespeedtest.org• http://tools.pingdom.com/fpt/• http://developer.yahoo.com/yslow/

Page 12: Site Speed Tuneup: Putting Your Code On A Diet

Google Webmaster ToolsLet Google tell you the speed of your website:

* Data comes from users with Google Toolbar

Page 13: Site Speed Tuneup: Putting Your Code On A Diet

2. Backend Optimization

• Bad Coding / Logic Errors (Typically Using a 3rd party module)

• Poor Performing Modules / Non Updated Modules / Module Maintenance

• Server Capacity – Can your server handle your traffic? Do you know your servers limits?

Page 14: Site Speed Tuneup: Putting Your Code On A Diet

Bad Coding• Calls to external files / Scripts• Loops / Logic Errors• Iframes

Page 15: Site Speed Tuneup: Putting Your Code On A Diet

Tools Used for Troubleshooting

• Miva Empresa Engine Logging

• Any 5.10 and higher Miva Merchant Engine can log every action to find module performance issues. (see release notes for implementation)

• Example: isokineticsinc.com

Page 16: Site Speed Tuneup: Putting Your Code On A Diet

Modules

• Poor Performing Modules• Not Keeping Modules up to date• Module Maintenance

• Large Database Files

Page 17: Site Speed Tuneup: Putting Your Code On A Diet

Server Capacity

• Who knows the specs of their server?• Who knows their traffic?

- Unique Visitors/day

- Average Pageviews/ visitor• Make sure your server is not the cause of your

site’s slow performance• Quality Miva Merchant Host

Page 18: Site Speed Tuneup: Putting Your Code On A Diet

Visits per Day / Page Views

Hits Per Day

0

200,000

400,000

600,000

800,000

1,000,000

1,200,000

1,400,000

1,600,000

1,800,000

2,000,000

5,00

06,

308

10,00

0

20,00

0

30,00

0

40,00

0

50,00

0

75,00

0

100,0

00

200,0

00

300,0

00

400,0

00

500,0

00

Visits/Day

Pag

e V

iew

s

Page Hits/Day

Page 19: Site Speed Tuneup: Putting Your Code On A Diet

Hits/Second Needed to Handle VisitorsServer Capacity Needed in Hits/Second

0.0

5.0

10.0

15.0

20.0

25.0

30.0

35.0

5,00

06,

308

10,00

0

20,00

0

30,00

0

40,00

0

50,00

0

75,00

0

100,0

00

200,0

00

300,0

00

400,0

00

500,0

00

Visits/Day

Hit

s/S

eco

nd

Hits/Second

Page 20: Site Speed Tuneup: Putting Your Code On A Diet

Server Testing Tools

• ab – Part of Apache, will show how many requests per second your Apache installation is capable of serving

• Httperf  -  It provides a flexible facility for generating various HTTP workloads and for measuring server performance

* Always test in a DEV environment.

Page 21: Site Speed Tuneup: Putting Your Code On A Diet

Recap

Three Areas to Look At To Improve Site Speed

1. Front End Optimization

2. Backend Optimization

3. Server Performance

What Else Can You Do?

Page 22: Site Speed Tuneup: Putting Your Code On A Diet

What Next?

Merchant Optimizer – Converts all your dynamic pages into static HTML pages.

- Will lose some dynamic content such as mini basket.

- 38 times server performance increase in our testing

Page 23: Site Speed Tuneup: Putting Your Code On A Diet

2.87

4.28

6.93

12.63

20.9418.96

17.1815

143.63

222.45

365.71

582.51

797.2704.37 704.64

594.85

1.81

2.47

3.59

7.55

12.8613.92 14.32 14.3

1

10

100

1000

1 2 4 8 16 24 32 40

Current Dynamic

Current Static

Old Dynamic

Page 24: Site Speed Tuneup: Putting Your Code On A Diet

3rd Party Services

• Altruik – Domain Sharding• Loading images from different sub domains at the

same time

• Front End Content Delivery Network• Blaze.io • Yotta.com• CloudFlare.com

Page 25: Site Speed Tuneup: Putting Your Code On A Diet
Page 26: Site Speed Tuneup: Putting Your Code On A Diet

Q/A

Any Questions?

Thank You!