Speed up your site! #WCTO2015

12
Speed Up Your Site! 7 WAYS TO PUT YOUR WEBSITE ON THE FAST TRACK #WCTO 2015 – MEAGAN HANES - @MHANES Slides! http://goo.gl/ AfR9YF

Transcript of Speed up your site! #WCTO2015

Page 1: Speed up your site! #WCTO2015

Speed Up Your Site!7 WAYS TO PUT YOUR WEBSITE ON THE FAST TRACK#WCTO 2015 – MEAGAN HANES - @MHANES

Slides!

http://goo.gl/AfR9YF

Page 2: Speed up your site! #WCTO2015

About Meagan

15+ years coding websites Started using WordPress in 2005 Works on sites as small as ants & as large as

elephants Favourite Colour: Rainbow!

Follow: @mhanes on Twitter

Page 3: Speed up your site! #WCTO2015

Why is speed important?

User Satisfaction & Audience Building Slow site = unhappy users, won’t return

Affects your PageRank Slow site = lower rank in Google, harder to be found

Impacts Sales and Success of Website Slow site = higher abandonment rates, marketing dollars wasted

And many, many more reasons why… Like bragging rights!!

Page 4: Speed up your site! #WCTO2015

Recipe: Speed Up PieServes One Website

Theme Choice

Plugins

File Opti-mization

Image Opti-mization

Caching

CDNs

Database Cleanup

Page 5: Speed up your site! #WCTO2015

Theme ChoicePretty, but at what cost?

Not all themes are created equal! Twenty Fifteen: 328KB, 13 files, 0.6s Premium Themes: 850KB – 2.5MB, 40+ files, 1.5-

3.0s More features + plugins = more bloat Be specific with your theme needs!

What can be done via plugins or functions.php? Use a fast framework, or try a different theme Measure, measure, measure!

GTMetrix, Pingdom, Webpagetest

Page 6: Speed up your site! #WCTO2015

1: http://shibashake.com/w

ordpress-theme/the_cont

ent-filter-optimizing-your-w

ordpress-plugins

PluginsMore plugins, more problems

Each plugin you use adds overhead to your site. Even admin-only plugins!

Get Data: P3 (Plugin Performance Profiler) Don’t need it? Deactivate and delete it! Add simple plugin functionality to functions.php

Turning off all comments, adding custom post types, etc Disable plugins on unneeded pages – Plugin Organizer

by Jeff Sterup May cause troubles, so test, test, test! Advanced Coders: You can also load plugins via a custom

taxonomy + functions.php!1

Page 7: Speed up your site! #WCTO2015

File OptimizationFile this under ‘u’ for ‘useful’

Minify CSS and JavaScript Remove unneeded whitespace, padding, simplify variable names Makes code not easily readable by humans BWP Minify Plugin

Defer JavaScript Wait to load JS until page is loaded Achieve via BWP Minify or manually

<script source=“myScript.js” defer> Google PageSpeed Insights = your best friend for more information WARNING: Back up before playing with these!

Page 8: Speed up your site! #WCTO2015

https://developers.google.com/w

eb/fundamentals/p

7erformance/optim

izing-content-efficiency/image-o

ptimization?hl=en

Image OptimizingNot all of us have high speed connections!

NEVER use images for text – unreadable by SEO! Use only the image dimensions you need

Full Camera image size: 3000x2400 pixels, ~2MB Common web size: 640x480, ~40KB That’s over 50 times smaller!

Use the correct file type for your purpose JPG: Rich Photos PNG: Vector/Transparency GIF: <256 Colours/Animated

Compress the file! TinyPNG, TinyJPG, EZGIF

Refer to Google’s Image Optimization Guide1

Page 9: Speed up your site! #WCTO2015

CachingMake it once, serve it over and over!

Serves static HTML vs dynamic database calls Perfect for sites where content changes rarely

Also great when viewers won’t be logging in to see custom content Many premium hosts (WPEngine) do this for you! #1 caching plugin: WP Super Cache

“What about Queries?” Transients API Query Caching1

Query Optimization2

http://www.wpbeginner.com/wp-tutorials/speed-up-y

our-wordpress-by-caching-custom-queries-using-tra

nsients-api/https://thom

asgriffin.io/optim

ize-wordpress-queries/

Page 10: Speed up your site! #WCTO2015

CDNsNo, it doesn’t stand for Canadian ;)

Deliver files from server closest to viewer You wouldn’t order a pizza from another province, right?

Saves connection time, network hops Distributes load when one server is overwhelmed Best for when concurrent users, server stress is your bottleneck Use them if it makes sense!

CloudFlare (free for basic accounts) MaxCDN (what the pros use)

Page 11: Speed up your site! #WCTO2015

Database CleanupOh yay, Spring Cleaning time!

More records = more time spent combing through them Many are of no actual value:

Spam and unapproved comments Old Page + Post Revisions Items trashed but not purged Leftover cruft from deleted plugins

Solution: WP-Optimize (https://wordpress.org/plugins/wp-optimize/) Feeling brave? Play with phpMyAdmin! WARNING: BACK UP FIRST!!

Don’t say I didn’t warn you.

Page 12: Speed up your site! #WCTO2015

Warp Speed, Captain! Many factors influence site speed Measure, Report, Improve! Any step forward is a good step

Questions? Ideas?Slides: http://goo.gl/AfR9YF

@mhanes