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

Speed up your site! #wcmtl2015 by Meagan Hanes

Embed Size (px)

Citation preview

Speed Up Your Site!7 WAYS TO PUT YOUR WEBSITE ON THE FAST TRACK

#WCMTL 2015 – MEAGAN HANES - @MHANES

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

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

Recipe: Speed Up PieServes One Website

Theme Choice

Plugins

File Opti-mization

Image Opti-mization

Caching

CDNs

Database Cleanup

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

1: http://shibashake.com/w

ordpress-theme/the_cont

ent-filter-optimizing-your-w

ordpress-pluginsPluginsMore 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 Advanced Coders: You can also load plugins via a

custom taxonomy + functions.php!1

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

WARNING: Back up before playing with these!

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!

Visual content is great, but MUST be optimized!

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 right file type (jpg, gif, png)

Compress the file! TinyPNG and TinyJPG

Refer to Google’s Image Optimization Guide

CachingServe it once, refer to it forever

Serves static HTML vs dynamic database calls

Perfect for sites where content changes rarely Also great when most viewers won’t be logging in

Many premium hosts (WPEngine) do this for you!

#1 caching plugin: WP Super Cache

CDNsDeliver files from servers closer to home

Serve 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

Use them if you can afford them! CloudFare (free for basic accounts)

MaxCDN (what the pros use)

Database Cleanup

More records = more time spent combing through them

Many are of no actual valuable content: Spam and unapproved comments

Old Page + Post Revisions

Items trashed but not actually deleted

Solution: WP-Optimize (https://wordpress.org/plugins/wp-optimize/)

WARNING: BACK UP FIRST!! Don’t say I didn’t warn you.

Warp Speed, Captain!

Many factors influence site speed

Measure, Report, Improve!

Any step forward is a good step

Questions? Ideas?

@mhanes