Powerpoint file(incl. animations!): http://db.tt/oQiXb9lq
This is the slides of the presentation "Wordpress optimization" who presented at WordCamp 2013.
How to improve your wordpress performance and speed up your website more than 700% faster!
5. What are we going to talk
about?
How to improve your wordpress performance.
Speed up your website over than 700% faster!
6. What are we going to talk
about?
1. Huh? Performance?
2. How do I analyze my wordpress performance?
3. How to optimize!
7. Hey.. Wait a second!
Why should I do it?
1. Why not?
2. It will save you money! $$$$
3. Make your users happy
4. Stay up under heavy load..
5. Improve your google results!
8. What does it mean
“Performance”?
Loading time is influenced by
Hardware Services Requests
Better hosting Configurations Caching
Better hardware 3rd party serviced Right Development
(varnish, cdn..,apc)
Location
14. What does it mean
“Performance”?
There are two states:
Deploy Production
1 user = request at time multiple users = multiple request
low hardware high hardware
15. Analyzing tools
There are few tools to analyze our website:
1. Feeling - the website went slow
2. Requests analyzing tools
3. By-subject analyzing tools
4. Wordpress analyzing
26. How to optimize!
The obvious:
1. Keep your wordpress updated! (core & plugins)
2. Deactivate unused plugins
3. Check about the plugin before install it.
4. Analyze your website.. Duh?
27. Optimize server
Use linux!
• Configure the PHP as well - increase memory, timeout..
• Configure MySQL as well - some innodb issues may slow your website
28. Optimize server
• Use opcode accelerators - APC, Xcache, memcache
• Varnish
• Consider replacing apache2 with nginx
31. Development optimizations
Minify and aggregation
1. Aggregate all the resources(js, css, image->sprites)
2. Aggregation is reducing the requests
3. Minifying all the resources(html, css, js)
4. Minifying is speeding up your loading!
32. Development optimizations
Javascript
1. Make your ajax scripts cacheable
2. Reduce document ready events.
3. Reduce jQuery queries! –
every query is scanning the whole webpage!
use canonical finding instead:
var $section = $("#section");
$section.find(".class").text("cool");
33. Development optimizations
Write semantic and valid code!
1. Separate code from style: markup shouldn't contains style elements.
2. Use CSS’s pseudo class “:before” and “:after”
3. Use CSS3 features(gradient, shadow…)
34. Development optimizations
Write semantic code by the html5 rules!
<header role="banner">
<h1><a href="http://link.com/" title="Website" rel="home">Logo</a></h1>
<nav role="navigation"><ul>
<li class="current"><a href="http://link.com/" title="Home">Home</a></li>
<li class="page_item"><a href="http://link.com/About">About</a></li>
</ul></nav>
</header>
<section id="content">
<article id="post-19" class="post-19 post type-post">
…
</article>
<article id="post-21" class="post-21 post type-post">
…
</article>
</section>
<footer>
…
</footer>
36. Development optimizations
Set properly headers for browser-caching
Set expire headers, e-tags, etc..
GZip everything!
Compress your source files(css, js, html) with gzip.. It will accelerate your loading time.
37. What is cache?
Database
Web
Server
This is really long way..
And actually.. It’s the same result!
38. What is cache?
Cache is the way to access distant data faster by storing it locally.
39. Server-side cache
Every request for each page is making our website rebuild this page using the database
our theme, and much more..
Database
Request homepage
Server
But, actually- our page hasn’t been changed.
40. Cache optimizations
So.. Why haven’t we cache this pages?! Cached
page
is page
cached?
Database
Request homepage
Server
43. Cache optimizations
There are two leading plugins:
1. W3 Total Cache – complex, but cover much everything!
Including CDN, minifying, aggregation, and much more..
2. WP Super Cache – much simpler! Almost automatic..
Handle only caching.
47. CDN
1. Use Google’s CDN for jQuery by “use-google-libraries” plugin
2. If you have serious traffic you may use enterprise CDN
48. HARDCODE!
1. Use separate server for database server
2. Use HyperDB for multiple database servers
3. Use Memcache on separate server
4. Use nginx
5. Develop you plugin using the wordpress cache api!