WordPress Optimization

WordPress optimization, loading wordpress fasterWordPress optimization is not just important for high traffic blogs but also small websites/blogs who want to get higher listing in search engine rankings. A faster WordPress blog would enhance your server efficiency and help in gaining more traffic. As the 80/20 principle states that 80% of the websites impact comes from 20% of its features, a faster loading WordPress installation can greatly enhance wordpress optimization by improving the end user response times which is directly proportional to number of components in a page .While WordPress officially guides on how you can increase the performance of your WordPress installation, but either these are too technical or sometimes not enough for optimizing WordPress when it comes to faster loading.

As a web designer/developer many times you do not get the choice of selecting the right hosting environment for your website, therefore the task of WordPress optimization becomes more critical.

The aim of this article is to suggest tricks and tools which can yield good results in WordPress optimization.

  1. Create subdomain to fetch images/javascript/css

    As the HTTP/1.1 spec suggests that browsers download two components in parallel per hostname. Interestingly this varies from browser to browser with IE7 supporting 2 components in parallel per hostname and Firefox supporting 8. Unfortunately by default WordPress downloads all the components from a single hostname. Change your default upload directory to a top level directory and connect it to a subdomain. Since all the images will be loaded to that directory use the subdomain as image source wherever you are using images.      eg: https://vibethemes.wpengine.com/img/VeryVibe-125×125.png and http://img.vibethemes.com/VeryVibe-125×125.png . It works like forcing the browser to make more simultaneous server requests.

  2. Using CSS sprites

    CSS sprites is one of the best trick to keep your html document size in check and enhance your user experience. Since all the images are combined into a single image the number of http requests are decreased dramatically and to the user all the images load at once.

  3. Image Optimization using Smush.it from Yahoo

    Smush.it is a great tool form YUI, Yahoo. It uses state of the art loss-less image compression techniques to give you the best possible compressed image without loosing on the image quality. I

  4. Combine and Minify all Css & Js

    The same logic which applies in case of CSS sprites also applies here. Minifying scripts would remove the reduce the size of your scripts and combining them into a single CSS or JS file would reduce the number of http requests by a great amount.

  5. Move <script> tags in footer or bottom of content

    Whenever a browser encounters javascript, it halts the stack of yet-to-be-performed HTTP requests until the script has finished parsing and then executing. Move the not so essential scripts to the bottom of the page and you enhance your website’s user experience.

  6. Load jquery from Google

    Jquery is a big resource hog it is 70-89KB in size which essentially takes away a lot of your precious bandwidth and since most of the scripts are loaded after jquery load the overall performance is impacted. The best part is that Google’s servers are pretty fast and would help in parallel loading of jquery in the browser. But most important thing I want to advice to all my designer friends is including the jquery the right way to avoid conflicts and multiple jquery inclusions. See example here on WordPress.org

  7. Use CDN

    By Default CDNs are the best way to increase your website or blog’s speed. A CDN is a content delivery network which functions like a cloud, a combination of multiple servers which increase the site’s loading speed by fetching the HTML components from the nearest servers to the receptor.

  8. Cache Cache Cache! use W3 Total Cache : Object Cache/html cache/query cache

    Last but not the least “Cache” is the way to decrease the loading time of your blog/website. This is an Awesome plugin from  W3edge which is a complete cache package. An ultimate caching tool for your blog with multiple inbuilt features a must install for every WordPress installation.

Apart from the above listed tricks other suggestions such as:

  1. Using a Minimalist WordPress theme
  2. Grade your blog by using Yslow plugin for Mozilla and Chrome from Yahoo
  3. Replace normal comments by facebook comment

also can decrease the loading time of your blog.

The bottom line  is any method which can reduce the number of http request of your page would help you in decreasing load time of your blog/website.

15 comments

  1. Sandy says:

    Excellent post…!!!

  2. HTM says:

    w3 total cache – best cache plugin!
    use sprite for image – always)

  3. I am using this plugin in my blog. Thanks for the information about the plugin..

  4. Mrinal says:

    Everybody is saying cache plugin are good thing to use. But I read that in beginning it actually slows down the whole site and give to much load on server. Is that correct?
    If it is so; then how much time it takes to come out of that initial period?

    1. Mr.Vibe says:

      It will slow down once per pageview, because the plugin would cache that page. How about this argument: If your site is visited by 100 people per month and it slows down only for 1 user then would you still like to do it?

  5. Anas says:

    Thanks for the helpful article. Please include some best optimization plugins.

  6. Imran says:

    thank you very for great tips for wordpress optimization. I am not a developer i am just gets tips from you and install Wp Super cached and its increase my site speed 90% faster then before it was 86% slower thanks again for tips

  7. I used CDN but it made my site more slower than what it was so i then just left it. I am even searching for a code or something like to call all the google ads java at once. If you can help me in that ??

  8. Raj says:

    Can we have more optimisation plugin and WP-minify is not available in plugins reposatory .any idea

  9. iSaumya says:

    Is there any plugin for the point one? I just wanna Parallelize my css and js scripts, because of I’m using photo, I dont need to Parallelize images.

  10. Mr.Vibe says:

    Why not try the WordPress CDN in Jetpack, it does the same thing.

  11. MWR says:

    Some great pointers here, but by far the most effective for me has been w3 total cache plugin, I use it on most of my sites to great effect.

Leave a Reply

%d bloggers like this: