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

1. Automating Online
Performance
Optimize your website speed
Soheil Seyfaie, Ph.D.
Mintwise Inc.

2. Why?
Is your website
driving customers away?

3. Why?
Is your website
driving customers away?
We all hate slow pages

4. Why?
Is your website
driving customers away?
We all hate slow pages
Online Performance = Business Performance

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

12. Few developers pay enough
attention to online optimization.

13. How to optimize existing
Web/Mobile sites?

14. Automating Web Performance

15. Client
Existing Site
Get Document
Server

16. Client
Existing Site
Get Document
Server

17. Automating Web Performance
Proxy Server
Client
Optimizer
Get Document
Server
Smart
Caching

18. Automating Web Performance
Proxy Server
Client
Optimizer
Get Document
Server
Smart
Caching

19. Platform Features
 Node.JS platform
 Supports HTTP/2.0 protocol
 Dynamic content optimization
 Payload reduction
 Smart content caching
 Image optimization

20. Results

21. Homepage
1.7 MB
Onload: 13.4s
Complete: 16.46s

22. Homepage
541.4 KB
(70% improvement)
Onload: 7.9s
Complete: 10.26s