pagespeed and spdy
DESCRIPTION
A 30 minute presentation given to the Toronto Web Performance Meetup about Google's PageSpeed and the SPDY Protocol. This presentation covers the following topics. - What is PageSpeed, how to use and install. - Should you use SPDY? Or wait for HTTP 2? - Shortcomings of HTTP 1.1TRANSCRIPT
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
PageSpeed & SPDY | July 8, 2014
• 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
PageSpeed & SPDY | July 8, 2014
FASTLY
Google’s PageSpeed
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/
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
PageSpeed & SPDY | July 8, 2014
PageSpeed Suggestions
HTTP Archive, May 15, 2014 Run
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
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!
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
PageSpeed & SPDY | July 8, 2014
FASTLY
SPDY & HTTP 2
PageSpeed & SPDY | July 8, 2014
The Problem with HTTP
Source: High Performance Browser Networking By: Ilya Grigorik
PageSpeed & SPDY | July 8, 2014
The Problem with HTTP
Source: High Performance Browser Networking By: Ilya Grigorik
PageSpeed & SPDY | July 8, 2014
The Problem with HTTP
Source: High Performance Browser Networking By: Ilya Grigorik
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?
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
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
PageSpeed & SPDY | July 8, 2014
Example of SPDY Connection• chrome://net-internals/#spdy
PageSpeed & SPDY | July 8, 2014
HTTP 2.0
Source: High Performance Browser Networking By: Ilya Grigorik
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Compressed Headers
Source: High Performance Browser Networking By: Ilya Grigorik
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Multiplexing
Source: High Performance Browser Networking By: Ilya Grigorik
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Server Push
Source: High Performance Browser Networking By: Ilya Grigorik
PageSpeed & SPDY | July 8, 2014
HTTP 2.0 Backward Compatibility
Source: High Performance Browser Networking By: Ilya Grigorik
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
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
PageSpeed & SPDY | July 8, 2014
FASTLY
Questions/Comments
Thank You