1.
Page Speed and SPDY | Toronto Web Performance Group
July 8, 2014 | Blake Crosby

2.
PageSpeed & SPDY | July 8, 2014
• Quick Introduction
• Using PageSpeed
• An introduction to SPDY
• The future of the web: HTTP 2.0.
• Questions
Agenda

3.
PageSpeed & SPDY | July 8, 2014
• Twitter: @blakecrosby
• E-Mail: me@blakecrosby.com
• Personal Website: http://www.blakecrosby.com/
• GitHub: https://github.com/blakecrosby/
I’m an Operations Engineer at Fastly, in San Francisco, California.
Blake Crosby

4.
PageSpeed & SPDY | July 8, 2014
FASTLY
Google’s PageSpeed

5.
PageSpeed & SPDY | July 8, 2014
• It’s split into two components:
• A browser plugin and web service for analyzing your site
• A module for Apache and Nginx to perform FEO on the fly.
What’s PageSpeed?
http://developers.google.com/speed/pagespeed/insights/

6.
PageSpeed & SPDY | July 8, 2014
• Gives you a web performance score (out of 100 points).
• Also has an API (used by HTTP Archive)
PageSpeed Insight
Website PageSpeed Score
Google 98
Facebook 99
YouTube 93
Yahoo 97
HTTP Archive, May 15, 2014 Run

7.
PageSpeed & SPDY | July 8, 2014
PageSpeed Suggestions
HTTP Archive, May 15, 2014 Run

8.
PageSpeed & SPDY | July 8, 2014
Installation
• Available as a package for Debian, Ubuntu, Centos, and Fedora.
• Installs two configuration files: pagespeed.conf and pagespeed_libraries.conf

9.
PageSpeed & SPDY | July 8, 2014
Turning On Features
• By default mod_pagespeed doesn’t enable certain features (for safety
reasons)
• In order to Minify Javascript & CSS, and recompress images:
• ModPagespeedEnableFilters recompress_images
• ModPagespeedEnableFilters collapse_whitespace
• ModPagespeedEnableFilters rewrite_javascript
• Keep in mind that your output is now different than what is stored on disk!

10.
PageSpeed & SPDY | July 8, 2014
Results
73 → 86
• Could save 63% (14KB) of bytes downloaded by compressing Twitter images
• Could decrease page render time by not using blocking JS

11.
PageSpeed & SPDY | July 8, 2014
FASTLY
SPDY & HTTP 2

12.
PageSpeed & SPDY | July 8, 2014
The Problem with HTTP
Source: High Performance Browser Networking By: Ilya Grigorik

13.
PageSpeed & SPDY | July 8, 2014
The Problem with HTTP
Source: High Performance Browser Networking By: Ilya Grigorik

14.
PageSpeed & SPDY | July 8, 2014
The Problem with HTTP
Source: High Performance Browser Networking By: Ilya Grigorik

15.
PageSpeed & SPDY | July 8, 2014
• If the bottleneck is TCP and network latency, why don’t we just use UDP?
So, Wait!! What about UDP?
QUIC
Blakes-mbp:~ bcrosby$ curl -I http://www.google.com/
HTTP/1.1 302 Found
Cache-Control: private
Content-Type: text/html; charset=UTF-8
Location: http://www.google.ca/?gfe_rd=cr&ei=Y_27U-7WG4mN8QfVioGoCQ
Content-Length: 258
Date: Tue, 08 Jul 2014 14:17:07 GMT
Server: GFE/2.0
Alternate-Protocol: 80:quic

16.
PageSpeed & SPDY | July 8, 2014
• Developed SPDY in early 2009, with the following goals in mind:
• Target a 50% reduction in page load time (PLT).
• Avoid the need for any changes to content by website authors.
• Minimize deployment complexity, avoid changes in network infrastructure.
• Develop this new protocol in partnership with the open-source community.
• Gather real performance data to (in)validate the experimental protocol.
Google: We can fix this!
Source: High Performance Browser Networking By: Ilya Grigorik

17.
PageSpeed & SPDY | July 8, 2014
Example of SPDY Connection
• chrome://net-internals/#spdy

18.
PageSpeed & SPDY | July 8, 2014
HTTP 2.0
Source: High Performance Browser Networking By: Ilya Grigorik

19.
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Compressed Headers
Source: High Performance Browser Networking By: Ilya Grigorik

20.
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Multiplexing
Source: High Performance Browser Networking By: Ilya Grigorik

21.
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Server Push
Source: High Performance Browser Networking By: Ilya Grigorik

22.
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Backward Compatibility
Source: High Performance Browser Networking By: Ilya Grigorik

23.
PageSpeed & SPDY | July 8, 2014
Should You Use SPDY?
• Ask yourself:
• Is the majority of your traffic over HTTPS?
• Am I using load balancing software/hardware?
• Are your clients typically over high latency connections (satellite)?
• Are you comfortable using an experimental protocol?
• Don’t mind delivering assets over SPDY for only ~60% of your visitors*
* From http://caniuse.com/#feat=spdy

24.
PageSpeed & SPDY | July 8, 2014
• HTTP 2 will replace SPDY by 2015. (Final draft of specification being
submitted this November)
• HTTP 2 support already in CURL and libcurl.
• F5 Load balancers support HTTP 2.
Current Status
Recommendation: Wait for HTTP 2 instead of implementing SPDY

25.
PageSpeed & SPDY | July 8, 2014
FASTLY
Questions/Comments

26.
Thank You