Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Wordpress optimization
    { Speed up your wordpress
Who dafuq are you?
What are we going to talk
             about?
  How to improve your wordpress performance.


Speed up your website over th...
What are we going to talk
            about?
1. Huh? Performance?

2. How do I analyze my wordpress performance?

3. How t...
Hey.. Wait a second!
Why should I do it?
  1. Why not?
  2. It will save you money! $$$$
  3. Make your users happy   
...
What does it mean
                  “Performance”?
Loading time is influenced by



       Hardware                   Serv...
What does it mean
  “requests”?
What does it mean
               “Performance”?
There are two states:


     Deploy                     Production
     1 ...
Analyzing tools
There are few tools to analyze our website:

1. Feeling - the website went slow

2. Requests analyzing too...
Requests analyzing
Firebug’s Net tab:
Requests analyzing
 webpagetest.org




Allowing test with different engines, and test within first view or repeated.. And...
Requests analyzing
Pingdom.com tools
By-subject analyzing
YSlow:
By-subject analyzing
YSlow:
By-subject analyzing
Google pagespeed:
By-subject analyzing
Google pagespeed:
Wordpress analyzing
Wordpress plugin: P3


P3 is analyzing your
plugins and provide an
detailed analysis.
Cat time!
How to optimize!
The obvious:
1. Keep your wordpress updated! (core & plugins)
2. Deactivate unused plugins
3. Check about...
Optimize server
Use linux!


• Configure the PHP as well - increase memory, timeout..

• Configure MySQL as well - some in...
Optimize server
• Use opcode accelerators - APC, Xcache, memcache

• Varnish

• Consider replacing apache2 with nginx
Development optimizations
Remember this?

Because our browser
   have many requests, the
      loading time much longer.

...
Development optimizations
Use sprites!
Sprites make the browser load all the images at once and reducing new
requests.
Development optimizations
Minify and aggregation
1.   Aggregate all the resources(js, css, image->sprites)
2. Aggregation ...
Development optimizations
Javascript

1.   Make your ajax scripts cacheable

2. Reduce document ready events.

3. Reduce j...
Development optimizations
Write semantic and valid code!


1.   Separate code from style: markup shouldn't contains style ...
Development optimizations
 Write semantic code by the html5 rules!
<header role="banner">
  <h1><a href="http://link.com/"...
Development optimizations
Images

1.   DO NOT scale images with CSS!
2.   Save images for web

3.   You may use www.smush....
Development optimizations
Set properly headers for browser-caching
Set expire headers, e-tags, etc..



GZip everything!
C...
What is cache?
                                                Database

                          Web

                  ...
What is cache?
Cache is the way to access distant data faster by storing it locally.
Server-side cache
Every request for each page is making our website rebuild this page using the database
our theme, and mu...
Cache optimizations
So.. Why haven’t we cache this pages?!         Cached
                                                ...
Cache optimizations



                      April 2010 results..
Cache optimizations



                      April 2010 results..
Cache optimizations
There are two leading plugins:

1.   W3 Total Cache –   complex, but cover much everything!
          ...
CDN
Server




            CDN
            1s



3s
                 1s




     3.5s




                               8s


...
Server




                     CDN
                     1s



            1.5s
js                        1s




         ...
CDN
1.   Use Google’s CDN for jQuery by “use-google-libraries” plugin

2. If you have serious traffic you may use enterpri...
HARDCODE!
1.   Use separate server for database server

2.   Use HyperDB for multiple database servers

3.   Use Memcache ...
MOST IMPORTANT!

NEVER EVER hack the core.
Questions?
Thank you!
Wordpress optimization
Wordpress optimization
Wordpress optimization
Wordpress optimization
Wordpress optimization
Wordpress optimization
Wordpress optimization
Upcoming SlideShare
Loading in …5
×

of

Wordpress optimization Slide 1 Wordpress optimization Slide 2 Wordpress optimization Slide 3 Wordpress optimization Slide 4 Wordpress optimization Slide 5 Wordpress optimization Slide 6 Wordpress optimization Slide 7 Wordpress optimization Slide 8 Wordpress optimization Slide 9 Wordpress optimization Slide 10 Wordpress optimization Slide 11 Wordpress optimization Slide 12 Wordpress optimization Slide 13 Wordpress optimization Slide 14 Wordpress optimization Slide 15 Wordpress optimization Slide 16 Wordpress optimization Slide 17 Wordpress optimization Slide 18 Wordpress optimization Slide 19 Wordpress optimization Slide 20 Wordpress optimization Slide 21 Wordpress optimization Slide 22 Wordpress optimization Slide 23 Wordpress optimization Slide 24 Wordpress optimization Slide 25 Wordpress optimization Slide 26 Wordpress optimization Slide 27 Wordpress optimization Slide 28 Wordpress optimization Slide 29 Wordpress optimization Slide 30 Wordpress optimization Slide 31 Wordpress optimization Slide 32 Wordpress optimization Slide 33 Wordpress optimization Slide 34 Wordpress optimization Slide 35 Wordpress optimization Slide 36 Wordpress optimization Slide 37 Wordpress optimization Slide 38 Wordpress optimization Slide 39 Wordpress optimization Slide 40 Wordpress optimization Slide 41 Wordpress optimization Slide 42 Wordpress optimization Slide 43 Wordpress optimization Slide 44 Wordpress optimization Slide 45 Wordpress optimization Slide 46 Wordpress optimization Slide 47 Wordpress optimization Slide 48 Wordpress optimization Slide 49 Wordpress optimization Slide 50 Wordpress optimization Slide 51
Upcoming SlideShare
High Performance WordPress
Next
Download to read offline and view in fullscreen.

5 Likes

Share

Download to read offline

Wordpress optimization

Download to read offline

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!

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Wordpress optimization

  1. 1. Wordpress optimization { Speed up your wordpress
  2. 2. Who dafuq are you?
  3. 3. What are we going to talk about? How to improve your wordpress performance. Speed up your website over than 700% faster!
  4. 4. What are we going to talk about? 1. Huh? Performance? 2. How do I analyze my wordpress performance? 3. How to optimize!
  5. 5. 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!
  6. 6. 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
  7. 7. What does it mean “requests”?
  8. 8. What does it mean “Performance”? There are two states: Deploy Production 1 user = request at time multiple users = multiple request low hardware high hardware
  9. 9. 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
  10. 10. Requests analyzing Firebug’s Net tab:
  11. 11. Requests analyzing webpagetest.org Allowing test with different engines, and test within first view or repeated.. And much more
  12. 12. Requests analyzing Pingdom.com tools
  13. 13. By-subject analyzing YSlow:
  14. 14. By-subject analyzing YSlow:
  15. 15. By-subject analyzing Google pagespeed:
  16. 16. By-subject analyzing Google pagespeed:
  17. 17. Wordpress analyzing Wordpress plugin: P3 P3 is analyzing your plugins and provide an detailed analysis.
  18. 18. Cat time!
  19. 19. 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?
  20. 20. Optimize server Use linux! • Configure the PHP as well - increase memory, timeout.. • Configure MySQL as well - some innodb issues may slow your website
  21. 21. Optimize server • Use opcode accelerators - APC, Xcache, memcache • Varnish • Consider replacing apache2 with nginx
  22. 22. Development optimizations Remember this? Because our browser have many requests, the loading time much longer. So, lets try to reduce the requests!
  23. 23. Development optimizations Use sprites! Sprites make the browser load all the images at once and reducing new requests.
  24. 24. 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!
  25. 25. 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");
  26. 26. 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…)
  27. 27. 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>
  28. 28. Development optimizations Images 1. DO NOT scale images with CSS! 2. Save images for web 3. You may use www.smush.it or WP-Smush.it plugin
  29. 29. 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.
  30. 30. What is cache? Database Web Server This is really long way.. And actually.. It’s the same result!
  31. 31. What is cache? Cache is the way to access distant data faster by storing it locally.
  32. 32. 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.
  33. 33. Cache optimizations So.. Why haven’t we cache this pages?! Cached page is page cached? Database Request homepage Server
  34. 34. Cache optimizations April 2010 results..
  35. 35. Cache optimizations April 2010 results..
  36. 36. 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.
  37. 37. CDN
  38. 38. Server CDN 1s 3s 1s 3.5s 8s 7s 15s 18s
  39. 39. Server CDN 1s 1.5s js 1s 1.5s CDN img CDN 1.5s css 2s CDN 1s 1.2s
  40. 40. CDN 1. Use Google’s CDN for jQuery by “use-google-libraries” plugin 2. If you have serious traffic you may use enterprise CDN
  41. 41. 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!
  42. 42. MOST IMPORTANT! NEVER EVER hack the core.
  43. 43. Questions?
  44. 44. Thank you!
  • SanjanaMondal1

    Feb. 16, 2018
  • WalstarTechnologies

    Jul. 18, 2017
  • wirelessinternet

    Dec. 1, 2014
  • BarSamcha

    Nov. 13, 2014
  • jmmadruga

    Jun. 18, 2014

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!

Views

Total views

19,898

On Slideshare

0

From embeds

0

Number of embeds

448

Actions

Downloads

24

Shares

0

Comments

0

Likes

5

×