pagespeed and spdy

Page Speed and SPDY | Toronto Web Performance GroupJuly 8, 2014 | Blake Crosby

PageSpeed & SPDY | July 8, 2014

• Quick Introduction

• Using PageSpeed

• An introduction to SPDY

• The future of the web: HTTP 2.0.

• Questions

Agenda


• Twitter: @blakecrosby

• E-Mail: [email protected]

• Personal Website: http://www.blakecrosby.com/

• GitHub: https://github.com/blakecrosby/

I’m an Operations Engineer at Fastly, in San Francisco, California.

Blake Crosby


FASTLY

Google’s PageSpeed


• 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/


• 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


PageSpeed Suggestions

HTTP Archive, May 15, 2014 Run


Installation• Available as a package for Debian, Ubuntu, Centos, and Fedora.

• Installs two configuration files: pagespeed.conf and pagespeed_libraries.conf


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!


Results

73 → 86• Could save 63% (14KB) of bytes downloaded by compressing Twitter

images

• Could decrease page render time by not using blocking JS


FASTLY

SPDY & HTTP 2


The Problem with HTTP

Source: High Performance Browser Networking By: Ilya Grigorik


• If the bottleneck is TCP and network latency, why don’t we just use UDP?

So, Wait!! What about UDP?

QUICBlakes-mbp:~ bcrosby$ curl -I http://www.google.com/HTTP/1.1 302 FoundCache-Control: privateContent-Type: text/html; charset=UTF-8Location: http://www.google.ca/?gfe_rd=cr&ei=Y_27U-7WG4mN8QfVioGoCQContent-Length: 258Date: Tue, 08 Jul 2014 14:17:07 GMTServer: GFE/2.0Alternate-Protocol: 80:quic


• 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!



Example of SPDY Connection• chrome://net-internals/#spdy


HTTP 2.0



HTTP 2.0 Compressed Headers



HTTP 2.0 Multiplexing



HTTP 2.0 Server Push



HTTP 2.0 Backward Compatibility



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

http://caniuse.com/#feat=spdy


• 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


FASTLY

Questions/Comments

Thank You

pagespeed and spdy

Internet

pagespeed spdy

fastly spdy http

developed spdy

pagespeed doesnt

whats pagespeed

http source

ilya grigorik

f5 load balancers support