Optimize Your Website Performance for Fun & Profit

Perl::Dancer Conference · Hancock, NY

Who?

Josh Lavin · Perusion

@perusionjosh

Why and How

Why care about speed?

“People have broadband Internet. So what?”
—Joe Webmaster

Why?

Bigger resources

• jQuery, Bootstrap, JS Frameworks
• Masthead images, Retina Displays

Why?

Comparisons

• Phone apps are fast; your site is not
• Competitors?

Why?

SEO

• Speed & ranking
• HTTPS & ranking
  • isTLSfastyet.com

Why?

Sales

• Load time & bounces
• Load time & conversions
• Performance bottlenecks
  • slashdotting / Reddit effect / hug of death

How to be fast

How

Image Optimization

• Lossless compression
  • jpegoptim
  • optipng
• CSS sprites
  

How

Minify & Concatenate

• GruntJS
• Google's mod_pagespeed
• Google's Closure Compiler Service
• js_minify UserTag for IC 5

How

CDNs

• Static files
• HTTPS gotchas
• Multiple hostnames
  • Consistency (example)
• "I updated an image, so I wiped the cache"

How

CDNs for 3rd-party resources

• jQuery & others
• Outages, security
• jsDelivr

How

Apache/nginx Best Practices

HTML5 Boilerplate server-configs

• MIME types, compression, expires
• Cache busting:
  • Not: foo.css?1234, but: foo.2.css (file on disk is foo.css)

How

A word on Responsive Design

Probably not good enough.

How

3rd Party Widgets

• Facebook, Twitter, ads, etc
• Single Point of Failure?
• Is it worth it?

How

Other

• Cache bits of code
• Call 3rd-party services on server, not client

Resources

• developers.google.com/speed
• www.stevesouders.com
• www.webpagetest.org
• Chrome's developer tools (network waterfall)

Questions?

Thank You