This document discusses optimizing website performance and speed. It notes that slow page speeds can negatively impact key metrics like conversion rates. It then outlines several standard optimization methods like reducing HTTP requests, using content delivery networks, caching files, and image/file compression. The document introduces HTTP/2 and its benefits over HTTP/1.1. It proposes automating performance optimization with a proxy server that intercepts requests, applies optimizations like payload reduction and caching, and returns optimized content to users. Results show the proxy reduced page sizes by 70% and load times by over 30%.
5. Page Speed Impact
Penalty of one-second delay:
3.5% decrease in conversion rate
2.1% drop in cart size
9.4% fewer page views
8.3% increase in bounce rate
Source: State of the Union: Ecommerce Page Speed and Web Performance – Fall 2013, Radware Report.
6. Bing Experiment
50ms
200ms
-0.3% -0.4%
500ms
-0.6% -1.2% -1.0% -0.9%
1000ms -0.7% -0.9% -2.8% -1.9% -1.6%
2000ms -1.8% -2.1% -4.3% -4.4% -3.8%
(in
Tim
et
o
cre C lick
ase
in m
s)
on
isfa
c ti
Sat
Dis
t in
Qu c t
e ri
es/
Us
Qu
er
e ry
Re
fin
em
en
Re
t
ven
ue
/U
ser
An
yC
lick
s
• 1 sec delay in Bing results in 2.8% drop in
revenue, 2 sec in 4.3%
500
1200
1900
3100
Source: http://velocityconf.com/velocity2009/public/schedule/detail/8523
7. Page Stats
1.6 MB
The average weight of web page today.
Images (60%)
Javascript
(15%)
Source: HTTP Archive
Other
(25%)
8. Optimization: Standard Methods
1.
Make fewer HTTP requests
– Combine files
– Combine images with CSS sprite
– Use data URLs
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
Use CDN
Cache files (including Ajax)
Put stylesheets at the top
Put scripts at the bottom
Avoid CSS expressions
Avoid redirects
Domain sharding
Minify CSS/JS/HTML
Use image compression
Gzip components
Use intelligent script loaders
Load 3rd party assets asynchronously
Pre-fetch assets
9. Optimization: Standard Methods
1.
Make fewer HTTP requests
– Combine files
– Combine images with CSS sprite
– Use data URLs
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
Use CDN
Cache files (including Ajax)
Put stylesheets at the top
Put scripts at the bottom
Avoid CSS expressions
Avoid redirects
Domain sharding
Minify CSS/JS/HTML
Use image compression
Gzip components
Use intelligent script loaders
Load 3rd party assets asynchronously
Pre-fetch assets
10. HTTP 1.1 Flaws
• Limited number of connections
– Modern browsers support up to 6 connections to
a host (for all window tabs)
•
•
•
•
•
One request at a time per connection
Uncompressed HTTP Headers
Redundant Headers
Optional Data Compression
Exclusively client-initiated requests
11. HTTP 2.0 – Based on SPDY
Key Features:
– Multiplexed Streams
– SSL as the underlying transport protocol
– Data/Header Compression
– Redundant headers are removed
Advanced Features
– Server Push
– Server Hint
