WordPressGarage.com

WordPress is a CPU hog - use caching plugins!

Sunday, April 27th, 2008

A few days ago I wrote about 38 ways to optimize and speed up your WordPress blog. One of the issues I touched on is the use of caching plugins, like WP-Cache 2 and WP Super Cache. Little did I know how important these plugins are for ensuring a smoothly running WordPress blog. Jeff Atwood at Coding Horror noticed that his tiny WordPress site was using huge amounts of CPU time. You can see the image of the results on his post. He says the following:

This is an incredibly scary result; blog.stackoverflow.com is getting, at best, a moderate trickle of incoming traffic. It’s barely linked anywhere! With that kind of CPU load level, this site would fall over instantaneously if it got remotely popular, or God forbid, anywhere near the front page of a social bookmarking website.

He then shows an image of how the blog’s CPU usage looked after installing the above-mentioned caching plugins. The improvement is tremendous, and he explains why he can’t understand why this type of caching isn’t built in to WordPress:

It’s not like this a new issue. Personally, I think it’s absolutely irresponsible that WP-Cache like functionality isn’t already built into WordPress. I would not even consider deploying WordPress anywhere without it. And yet, according to a recent podcast, Matt Mullenweg dismisses it out of hand and hand-wavingly alludes to vague TechCrunch server reconfigurations.

A default WordPress install will query the database twenty times every time you refresh the page, even if not one single element on that page has changed. Doesn’t that strike you as a bad idea? Maybe even, dare I say it, sloppy programming?

And it’s not like he’s setting higher standards for WordPress - he happily uses Movable Type which features static rendering, and he says that the .NET framework has had caching built in for years.

The point: install a caching plugin ASAP if you have not yet done so, and save yourself the problems of a sluggish, overweight site.

Posted in Good Blogging Practice | Tags: optimization | 3 Comments »

38 ways to optimize and speed up your WordPress blog

Wednesday, April 23rd, 2008

WordPress blogs and sites can be notoriously slow. But fear not - here are ways to make your WordPress blog super speedy and fun for your visitors to view with a few tweaks, hacks and plugins. Be sure to check back because I will be updating this post as I discover new and wonderful ways to optimize and speed up WordPress blogs.

[This post is in honor of the current Pessach (Passover) season, a Jewish holiday where we clean our houses frantically in the hope that not one crumb of leavened bread (i.e. regular bread) be found during the 7 day holiday. This post is the WordPress version of Pessach cleaning, where cluttered databases are equivalent to leavened bread, etc. Happy Pessach!]

Define goals and create benchmarks:

1. First, define a goal, such as reducing page load time from 8 seconds to 2 seconds.
2. Measure your initial state and the results of each modification so that you can quantify any improvement. Test your site’s speed with the Website Speed Test, but do multiple tests since the results can be inaccurate due to fluctuations in your internet connection and other factors.
3. Use Pingdom to get a detailed analysis of your blog’s loading time and performance.
4. See what your browser is doing with tools like Firebug’s network tool, Charles Proxy or Wireshark, and review the server logs.
5. YSlow - analyzes web pages and tells you why they’re slow based on the rules for high performance web sites. YSlow is a Firefox add-on integrated with Firebug. See this presentation from Yahoo! that covers their latest research results and performance breakthroughs. It covers their existing 14 rules, plus 20 new rules for faster web pages. They’ve categorized the optimizations into: server, content, cookie, JavaScript, CSS, images, and mobile.

    

   | View | Upload your own

Reduce the number of dynamic PHP and http calls:

1. “There is an inherent overhead in each HTTP request. It takes substantially less time to serve one 30K file than it does three 10K files.” So combine all files in a type into a library. Learn how here.
2. Use different host names to increase the number of active download threads.
3. Minimize PHP and database queries - Each time a page on your site loads, if your browser has to execute any PHP queries, it adds to the load time. If you replace the PHP queries with static HTML, every time a page loads, your browser just reads the HTML. An example from WP Candy:
   With PHP requests: <title><?php bloginfo(’name’); ?><?php bloginfo(’description’); ?></title>
   Without PHP requests: <title>WPCandy - The Best of WordPress</title>
Joost de Valk says that you can remove 11 queries to the database by doing the following in your header.php and footer.php files:

   • making your stylesheet URL’s static
   • making your pingback URL static
   • making your feed URLs static
   • removing the blog’s WordPress version
   • making your blog’s name and tagline / description staticSee more examples of how you can replace code in your WordPress template files with static HTML here and here.
4. Check if you have too many external calls to things like Amazon, eBay, MyBlogLog, etc. Try commenting them out one by one to see if it speeds things up.

Optimize your files: CSS, HTML, Javascript, images, video

1. Optimize your image files for the web.
2. Make sure that all images have height and width tags.
3. Consider hosting your images on an external site like flickr that has huge servers and can handle the load.
4. Use CSS sprites for static web images. CSS sprites are where the images are added to one larger image file, and laid out in a convenient way. Here’s a CSS Sprites generator.
5. Do not host videos on your server. Upload them to YouTube, Google Video, or any other video sharing site and let them handle the server load.
6. Compress your Javascript, using a tool or by removing formatting (and potentially by shortening function and variable names). This can reduce file size by 60%. Add gzip compression to that as well and you’re looking at a serious size reduction.
7. Compress HTML and CSS by removing HTML formatting, white space (where you divide code among separate lines for easier readability), trimming class names, omitting unambiguous quotes around attributes, etc.
8. Compress your CSS with the CSS Compress WordPress plugin - Automatically removes comments, new lines, tabs, and gzip compresses (GZIP) any CSS file called with “<?php bloginfo(’stylesheet_url’); ?>” Just activating the plugin with the default Kubrick theme will reduce the CSS file from 8k to 1.7k.
9. Compress your CSS by using shorthand CSS. Here’s an example from WP Candy:
   Long: .test {margin-top: 7px; margin-right: 1px; margin-bottom: 5px; margin-left: 3px;}
Short: .test {margin: 7px 1px 5px 3px;}
10. Use external scripts - Instead of placing tons of code in your header.php file, use external scripts. This allows the browser to cache the script so it won’t have to read it for every other page.
11. Validate your code at W3C to make sure you don’t have any major errors slowing down your page.
12. Allow progressive rendering: Load CSS files at the top of the page, from within the head section; load JavaScript files at the bottom of the HTML. And/Or…
13. Stop slow loading scripts from breaking your blog with IFrameWidgets v1.0 WordPress plugin. Slow widgets or snippets of Javascript can either time-out, or prevent the items below them from loading. The plugin creates WordPress sidebar widgets that run in an IFrame. Since IFrames load in parallel to the rest of the page, slow loading JavaScript widgets won’t affect the rest of the page.

Plugins

1. Disable or delete unused plugins - some plugins have tons of script and code, and even create database tables in your WordPress database. Use only the plugins you really need, and delete the rest.
2. Sometimes plugins require that you add a snippet of code to your theme’s template files to call the plugin. Usually, it looks something like this:
   < ?php refer_plugin(); ?>
   However, if for some reason you disable that plugin, you will get an error. Joost de Valk recommends using PHP’s special function called function_exists to prevent the blog from breaking if plugins are disabled or removed. Using it will make the code look like this:
   < ?php if (function_exists(’refer_thanks’)) { refer_thanks(); } ?>
3. Control when your WordPress plugins are loaded: WordPress processes all of the code for all active plugins, even if that plugin isn’t used on a particular page. If a particular resource heavy plugin isn’t used on certain pages, then you can tell WordPress not to load it on those pages by wrapping an if statement around the content of each function to check what page is being loaded. Learn more about how to do this here and here.

Database

1. Use phpMyAdmin to optimize your database: Log in to phpMyAdmin, select all the tables, and then “repair” and “optimize.”
2. Delete excess records in your WordPress database. All plugins use the wp_options table to store data, which is the same table used by WordPress to store all settings for your blog, and is accessed every time you open any page. When you deactivate a plugin, these records are left behind, bloating your database. To clean it up you can use the WordPress Clean Options Plugin, which finds orphaned options left after you have removed plugins and removes them from the wp_options table, or manually as follows: Back up your database, login to phpMyAdmin, open your blog’s database, and click on browser for the wp_options table. Go through this table record by record to identify any records left behind by old plugins. (from WordPress Web 2.0 Spot-Er).
3. Use the Optimize DB plugin to optimize the tables of your database.
4. Use WordPress Plugin: Fix Database to check all tables in your database and fix any errors.
5. Lester “GaMerZ” Chan’s WP-DBManager 2.11 plugin sorts your database backup files by date in descending order, can repair databases, and allows automatic scheduling of database backups and optimization.

Caching and protecting for server overload

1. WordPress has a built-in caching system. Learn how to enable the default WordPress object cache. This has apparently been disabled in version 2.5.
   
2. WP-Cache 2 - caches Worpress pages and stores them in a static file for serving future requests directly from the file rather than loading and compiling the whole PHP code and then building the page from the database.
3. WP Super Cache - This plugin is a fork of the WP-Cache 2 plugin, and generates html files which are served without ever invoking a single line of PHP.
4. PHP Speedy - PHP Speedy is a script that you can install on your web server to automatically speed up the download time of your web pages.
5. Use the Expires and cache-control max age headers for all pages; Make dynamic pages support the if-modified-since request header; Use far future expiry headers on static resources; Use the cacheability engine to test that you have caching and validation set up correctly. If you don’t know what all this means, don’t worry, neither do I, but you can find out more here.
6. Digg Protector plugin - The Digg Protector will determine if a visitor is from Digg, and if the visitor is indeed from Digg, the plugin will serve them a remotely-hosted version of the image. Otherwise, the plugin will serve the locally-hosted (on that server) image.
7. Some more caching possibilities: MySQL query cache, PHP Compiler Cache. Learn more here.
8. Configure Apache for maximum performance.

Happy Optimization!

Sources:

Speed up your website: Part One

How-to: Optimize your site for speed - really excellent article with practical tips

How to Enable the Default WordPress Object Cache - talks about wp-cache, wp-cache 2, and built in wordpress caching.

Digg Protector

4 Simple Ways To Speed Up WordPress

Speed up and clean up your WordPress!

5 Tips to Help Your Slow or Sluggish Blog or Web Site (Wordpress Especially)

Deleting excess records in your WordPress database

WordPress on Speed: 17 Tweaks to Accelerate your WP

The 3 Easiest Ways to Speed Up WordPress

WordPress Theme Hacks

Diggproof & Speed up Your Wordpress Blog

WordPress Optimisation: Control When Plugins Are Loaded

Posted in Tips | Tags: databases, digg, optimization, phpMyAdmin | 22 Comments »

4 reasons not to host your blog on WordPress.com

Tuesday, April 15th, 2008

When starting out, many bloggers seek out the cheap and easy route, either choosing to blog on Blogger, WordPress.com, or another free and hosted blogging platform. This approach makes sense, since a person can never know until they’ve started if they even like blogging, let alone whether they’ll be successful.I almost always suggest to beginner bloggers to set up a blog on WordPress.com, but the reason is not because I think this is ideal, but because it is easiest to migrate a blog from WordPress.com to a self-hosted WordPress.org site, which is ideal (as opposed to migrating from Blogger, which can be a nightmare). One of the reasons it’s so easy is because you can select the same permalink structure as in your original WP.com blog, and just change the main domain name part in a 301 redirect. Also, by using WP.com, you will become familiar with the WordPress system and interface, which is similar in the self-hosted WordPress.org version.

Why am I against WordPress.com?

I am not against WordPress.com. I think it’s a great service, and the quality of the features is unmatched in any of the other free hosted blogging platforms. In addition, people in the SEO industry have told me that due to the strength of the WordPress.com network, blogs that are hosted there do incredibly well in the SERPs. But if a person wants to take up blogging as a serious activity, or finds that their WordPress.com blog is growing, I suggest that they move their blog off of WP.com to their own self-hosted blog. Here is why:

1. Limited blog design flexibility - whenever I’ve tried to use a WordPress.com blog, I’ve always found myself stuck at some point because I can’t add certain features. Users are limited on WP.com by the amount of customization they can do to the CSS, even if they pay for extra access to the CSS. They also can’t customize the loop, and the sidebars can only be modified to the extent that widgets allow. Also, WP.com users can’t add WordPress plugins, which is one of the keys to expanding your blog’s features.
2. You don’t control your content - as soon as you are using a service that is hosted by someone else, you have lost partial ownership over your content. I’m not talking about what exactly it says in the WP.com terms of service (we’ll get to that soon), but I am talking about the issue of your content sitting on someone else’s servers. I personally prefer to try to keep my content under one roof - my own. As for the WP.com Terms of Service - you are at the mercy of their discretion as to whether your content is appropriate. When hosting your content on someone else’s servers, you are always at risk that someone may decide that your content is inappropriate, and they can easily shut you down.
3. Hosting quality issues may haunt you - if the WP.com servers are having trouble, like the recent DoS attack on the WordPress.com servers, you will suffer. Of course, that is the case on all servers, but if you are really unhappy with a service provider, you can call them up, complain, and always change servers if need be. When your blog is on WP.com, it’s not as easy.
4. You are at risk of being censored in certain countries - upon finding content that they don’t like on WP.com, certain countries with undemocratic tendencies will simply block the entire system. While it is possible for them to just block the individual WP.com blogs that they find offensive, these countries either don’t care enough to try, or are happy to block an entire blogging universe since blogging is all about free speech, and they are not. Countries that have blocked WordPress.com are Turkey, China and Brazil.

WordPress.com is a great service, and the people providing it are incredibly generous. However, like any other free hosted service, it has its drawbacks which should be taken into account when deciding on which path to take for your blog: free hosted or paid and self-hosted.

Posted in Tips | Tags: security, SEO | 15 Comments »

WordPress 2.5 released - and WordPress.org gets a makeover

Monday, April 14th, 2008

I know this is coming pretty late for the world of the internet, but I’ve been really busy and I only recently started getting to know WordPress 2.5. All in all, I think that the upgrade is fantastic, and here’s my review of the new features I have used so far:

New admin design

I like the new design for the WordPress admin (and for the WordPress.org site). The colors are ok, but what’s great is that everything seems to be a bit tighter so it’s easier to get an overview of a page quickly, like which plugins you’re using, or the categories.

Smarter layout of admin navigation bar

I think that the new setup of the navigation bar in the admin section is much more user friendly. It separates the features that you use regularly while blogging, like writing and managing posts and comments, from the features that you only need to deal with once in a while, like Plugins, Settings (used to be called Options) and Users.

The only drawback that still exists is that in order to get to anything on a submenu, you have to click on the top of the menu, like Write for example, and only once the page has reloaded can you click on Post. So I’ve installed the Admin Drop Down Menu by Ozh to overcome that, but unfortunately it regroups all of the links into one long navigation bar like in previous versions of WP, which means that I don’t benefit from the new grouping.

More flexible Dashboard

The new Dashboard is a huge improvement over the old one, since it gives you a quick view of the things you need to know about your blog: how many posts, Pages, categories and tags. However, I rarely take more than a quick look at the Dashboard while I’m blogging, so although I can now add my own RSS feeds there, I probably won’t.

Write Post/Page page changes

The new layout of the Write Post/Page page is tighter and smarter in most respects. The important information is at the top, and the new expandable text editor is a pleasure, although the very useful shortcut for adding links - Ctrl+K -does not work in the new text editor. But apparently the text editor no longer messes with your code, which I guess makes up for it. The main drawback to the new layout that I’ve found is that the Post Author drop-down box is all the way at the bottom. When I’m working on multi-author blogs I keep forgetting to change the author to the correct one.

Another annoying thing, but maybe this is a problem with my installation, is that when I first start writing a post and I click on Save, it often goes out of the admin into the front end of the site to show me the page. Also, it creates another version which is saved as a draft, so I end up with two versions of every post I’m working on, and I have to go back and delete the second draft.

Media manager

Managing images, video and any other type of media in previous versions of WordPress was pretty lame. The new image manager is very handy, and allows you to easily upload and insert images, and align them however you want within the text. You can add titles, descriptions, and other information to the images as well.

The video manager has not worked for me at all. When I insert a video URL into the form, it just inserts a link to the video as opposed to embedding it. So I’m still using a plugin for video management. I haven’t tried adding audio or other media yet.

Auto-suggest for tags

Now, when you add tags to a WordPress post, it suggests tags that have already been used on the blog. This is great because it ensures that you do not create multiple tags that are really the same, like “blogs,” “blog,” and “blogging.” However, be aware that it takes a few seconds for the suggestions to pop up. I didn’t realize this in the beginning, and I ended up with multiple related tags.

This new features also means that I can now use one less plugin, which I’m always happy about. Simple Tags (and its predecessor Simple Tagging), you were the best and thanks for everything. No wait - I just checked out Simple Tags and I realized I still can’t live without it.

Automatic plugin updates!!!

Now if one of your plugins needs updating, you get a message that says something like “This plugin needs updating. Click here to download, or click here to upgrade automatically.” Um let’s see - either I can download the new plugin, unzip it, delete the current plugin files from my server to make sure it’s all gone, upload the new plugin and reactivate, or I can click on one link. I’m clicking on the link baby!

No more Category IDs

If you go to Manage > Pages or Manage > Categories, the ID numbers no longer appear. That is annoying for theme editors who want to hard code inclusion or exclusion of pages or categories in menus or in The Loop. You can still find out what the Page or Category ID is by mousing over the title and looking at the link in the bottom of your browser to find the number, but that’s not very intuitive, is it?

No more WordPress bookmarklet

WordPress used to have a bookmarklet and Link bookmarklet that you could drag to your browser toolbar, where it would become a button that you could click to post about a page you are visiting, or to add a link from a page you are visiting. These bookmarklets have disappeared in WordPress 2.5.

That’s it for now. If I discover anything else that is new and interesting, I’ll be sure to let y’all know.

Here are some more good articles on what users can expect from WordPress 2.5:

Wordpress 2.5 - nice security improvements

Themes for WordPress 2.5 and Web 3.0 Design and Functionality - good overview of WP’s new features

Weblogtools: FAQ on WordPress 2.5 and FAQ On WordPress 2.5 Version 2

The WordPress Blog: WordPress 2.5

Posted in News & Views | Tags: upgrades | 5 Comments »

Stylish Firefox add-on plus Google Redesigned equals pretty Gmail

Wednesday, April 2nd, 2008

I know that Gmail and Firefox don’t really have anything to do with WordPress, but I decided to write about them anyways because:

1. I have nothing earth-shattering to say about WordPress right now. Everyone else is talking about version 2.5, and I still haven’t installed it (my bad) so I don’t have anything to add to the conversation.
2. I would guess that most WP users are Firefox fans and probably Gmail fans too, so…so nothing. That’s not a very good argument, so I’ll stop right here.

ANYWAYS, Gmail is ugly. The interface is so eye-poppingly cluttered and unimaginative that this is actually one of the reasons I haven’t really gotten into Gmail. I just found it hard to get my eyes used to.

Well, now there’s a solution! There is a cool Firefox add-on called Stylish, that lets you define custom styles for any page on the web. For example, if you didn’t like the brown on WordPress Garage and prefer a nice shade of magenta, you could use Stylish and define a new CSS style that will make all text on this site magenta. Basically, as they say on the Gmail Redesigned page, “Stylish is to CSS what Greasemonkey is to JavaScript.”

ANYWAYS, the people at Globex Designs have created a special Stylish style for Gmail - Gmail Redesigned. They have taken the over 1500 (!!) styles and very complicated structure of Gmail and redesigned it. They are updating the styles almost daily, and if you’ve already installed Gmail Redesigned and you visit their site, it will tell you if any updates have been made since your last install and you can update with one click.

I installed it, and I can tell you it makes a world of difference. Gmail is now…pretty. Pretty Gmail is no longer an oxymoron.

Gmail Redesigned says it currently only supports English, but Hebrew worked for me too, and is not supported with the “Better Gmail 2″ or the “Remember The Milk” extensions. Support for these extensions will be added in the future.

And now, a partial screenshot of my Gmail account with all incriminating evidence either archived or painted over (hopefully):

Posted in Tips | Tags: firefox, gmail | 2 Comments »