Post on 08-May-2015
description
www.blaze.io
2
Agenda
• Introduction• User expectations for speed• Impact of speed on conversions• Impact of speed on SEO• Tips for improving performance
3
User Expectations
2006 20090
0.5
1
1.5
2
2.5
3
3.5
4
4.5
What are your expectations for how fast a page should load?
Source: Forrester Research
4
Impact of Speed on Conversions
Research from Gomez showed that reducing load times from 8s to 2s increased conversions by 74%
5
Impact of Speed on Conversions
Research from usability consultancy, Nielson Norman Group, showed that users were 20% more likely to click on a promotion offer when the page loads instantly vs. in 8 seconds
6
Impact of Speed on Search
7
Shopzilla.com
• Shopzilla improved speed by 5 seconds
• Improved conversions by over 7%
8
Superbiketoystore.com
• Reduced NA load times from 6.8s to 3.0s.
• Reduced International load times from 16s to 6s.
• Results - improved conversions by 32%
9
Measuring Business Impact of Speed
1. Add the new tracking code to your website:– http://
www.google.com/support/analyticshelp/bin/answer.py?hl=en&answer=1205784&topic=1120718
2. Make sure you are in the new Google Analytics
3. Go to the site speed category & select a date range that you have speed data for.
4. Go to the advanced segments dropdown and check “all visits” & “visits with conversions”
10
Measuring Business Impact of Speed
5. Review your average load time for all visits vs. visits with conversions to see the effect of load time on users that converted vs. your regular website visitors:
In this example users that converted had an average load time of 4 seconds. All visits had a load time average of 9 seconds
11
Speed and SEO
• In April 2010 Google started using speed as a signal in their ranking algorithm.
• Penalizing pages deemed as “slow”.
12
How Can I See My Results?
• Log on to your Webmaster tools page in Google• See the chart for your site• Google views pages slower than 1.5s to be slow
13
How Google Measures
• Data is collected from the Google toolbar of users.
• Doesn’t use the Google
spider to measure.
• Measures complete load time of page measured by “onload” event.
14
Improving Performance
1. Measure Performance
2. Prioritize Improvements
3. Implement Optimizations
15
Measuring Performance Challenges
• Not as simple as it sounds• Need to test using conditions that reflect your
actual customer.• Factors to consider:
– Connection speed– Location– Browser version– Clear vs. primed cache– Internet traffic & variability from 3rd parties
16
Measurement Tools
• Commercial tools– Keynote, Gomez, Catchpoint
• Free tools– Webpagetest (desktop)– Mobitest (mobile)
• Bad ideas:– Manual measurement
17
Webpagetest.org
• Free service• Uses real
browsers• Multiple locations• Multiple speeds• Detailed results• Video playback
18
Analyzing Results
19
What to Measure?
Filmstrip View
Fully Loaded (4.350 sec)
20
Mobile Performance
21
Prioritizing Improvements
Backend = 0.398/7.964 = 5%Frontend = 95%
22
Prioritizing Improvements
• Backend:– Improve server hardware/infrastructure– Improve backend code
• Frontend:– Add a CDN to reduce network latency– Optimize frontend code (FEO)
23
CDN vs. DSA vs. FEO
Problem Addressed How it Works
CDN Network latency Files cached in multiple GEOs
DSA Network latency (especially with dynamic content)
Optimized routing.TCP optimization.Compression.
FEO Frontend optimization (Reduce network usage and browser bottlenecks)
Optimize HTML code and page resources
Content delivery networks (CDN), Dynamic site acceleration (DSA) and Frontend optimization (FEO) are complimentary technologies that all work together to boost performance.
Improving Frontend Performance
24
1. Make fewer requests
2. Reduce size of requests
3. Increase # of parallel requests
25
Sample Optimizations
Optimization Reduce Requests
Reduce Payload
Increase Parallel Requests
Consolidate CSS, JS and images ✔
Just in time image loading ✔
Inline small images, JS ✔
Version files for long term cachability ✔
Increase cache size using HTML5 local storage ✔
Adaptive image sizing by screen size ✔
Lossless image compression ✔
Lossy compression optimize image quality vs. size ✔
Apply GZIP compression ✔
Minify code ✔
Load scripts asynchronously ✔
Preload head section of HTML ✔
Use domain sharding ✔
Blaze Product Overview
• Automated Frontend Optimization Service– Dynamically applies
optimization best practices
• Cloud-based service– No software or hardware– Integrates with CDN
services
• Quick deployment– 1 hour or less.– No code changes required
Faster, more efficient site
Optimizations from world’s fastest sites
Shared insights from >1M pages analyzed
Blaze performance research team
27
Testing Frontend Optimization
Run a test on your own
site here.
28
Sample Report – Walmart.com
Thank You