Tune Site Performance

Your site's visitors want performance! And they want it NOW!

Make lighter pages

Less stuff to load means faster loading. Lots of things to consider:

Simplify and reduce elements

Fewer design elements = less to download = more speed.

Banners and other ads, in particular, can be slow to load, as they contact external servers for their content.

Tables can also be slow, especially if nested or full-page.

JavaScript, Flash, and the like can slow things down a lot. Flash intros are so 23-skidoo now, anyway.

The Drupal connection: Sticking with a lightweight, simple Theme, with fewer files and without a lot of graphics and design elements, will go a long way toward keeping the site responsive.

The Theme is only a small part of the site's "bulk", though. Needless to say, the more modules and blocks you throw at a site, the slower it'll crawl. Simplify!

Pare the code

Toss out any unneeded code from your HTML, PHP, or other files.

That goes for unneeded comments, too, if you're sure you won't be needing them to aid further modifications. But you might want to also keep copies of the files with the comments intact, just in case.

Lighten the images

Images are the big stuff on many sites. Cut out the images, or make them smaller. In particular, use thumbnails where full-size images aren't needed. 

Keep in mind that whatever the image size, fewer colors also means smaller size.

Also use the right format for the job. JPEG or PNG are good choices for photographic images, but for simple graphics with few colors, the GIF format will produce smaller files. 

Spread the load

Can some content be moved to other servers to reduce stress on your main server? A simple example: Instead of hosting video content yourself, you could place it on YouTube, and embed the video in your pages. Actual streaming of the video will take place from YouTube's servers.  

Chop it up

If a page is really long, chop it up into multiple pages. Overdoing this will turn off visitors, but having to click through a few pages might be preferable to waiting on a single page that takes forever to load.

The Drupal connection: Use the Paging module or Pagination (Node) module.

Cache the site

Set your CMS to allow caching of content. Pages served to repeat visitors from cache will load much faster. 

The Drupal connection: Site-wide caching is built in at admin/settings/performance. You can set the minimum cache lifetime; make it long for maximum performance. Weigh this against how often you want the site to update what it's sending out to visitors. A minimum cache lifetime of one day might be fine if you only update the site once per day or less frequently, but wouldn't be ideal if you update the site many times in a day.

Note that Drupal will only serve cached pages to anonymous users, so any logged-in registered user won't see a speed improvement! On the good side, though, those users always get served "fresh" pages, with new comments or any other changes reflected.

In addition, there's a Boost module that promises large performance gains for heavy-traffic sites via static page caching. [Does anybody have info on what this performs over and above the built-in site-wide caching?] Finally, those with some technical aptitude and access to server configuration can apply the Memcache module.

Cache selected content

Your CMS may allow caching of specific content. Use this to handle slow-loading content if you're not using site-wide caching already.

The Drupal connection: Speed up a Drupal web site by enabling block caching suggests the Block Cache module as a way to cache and speed up slow-loading blocks. It can be helpful if you can't use site-wide caching, or even if you can: it will cache blocks for logged-in users, something Drupal's site-wide caching won't do.

Using the module effectively requires some testing and tweaking, so consider this an advanced technique. 

Aggregate and compress CSS files

A CMS might call upon a lot of disparate CSS files in generating its pages. If you can, consolidate those into a single short CSS file.

The Drupal connection: This is another option at admin/settings/performance. Note the caveats in the descriptive text: First, you should only use this option after you're finished mucking around with your Theme code; otherwise, you'll need to disable the aggregation when you make further changes in your Theme's CSS, and then re-enable the aggregation again afterward. Second, to enable aggregation you need to have a file system path specified, and your download method set to public. Take care of those  tasks at admin/settings/file-system.

Move inline JavaScript to a separate .js include file

More on this later.

Tune your system

Speed up the environment

Whatever platform supports your CMS is subject to infinite performance tweaks. Check up on what tweaks are most important and put them into service. If you're running on a hosting service, you may need to ask about key technical details, and whether you'll even be allowed to make any performance tweaks.

The Drupal connection: Essential steps to speed up a Drupal web site details three key areas for Drupal performance tuning: Apache file compression, PHP accelerator script caching, and MySQL query caching. There's nothing to add here to those great overviews, so have at them!

There may be other addressable causes behind slow MySQL queries. More info on that as it comes up. 

Keep your CMS up to date

Whatever your CMS, use the latest version of the CMS software, and any related software, that makes sense for your site. 

The Drupal connection: "...that makes sense for your site" is an important caveat. Whatever the performance improvements, don't rush into the latest version of Drupal unless you're sure that your site's key features – especially those relying on third-party modules – are available in the new version. Many site builders have learned this lesson the hard way.

Get a fast host

If the performance techniques above still leave things slow, you might require a faster host. You may mean a faster server, or more memory alloted to your site, or both.

Shared hosting services (like this site's DreamHost) are fantastic for their low price, but typically won't supply the speed you need for a really busy site. Consider a more expensive dedicated server, especially one on which you have freedom to make plaform tweaks for performance.

Also, you may get better performance when your CMS and its underlying database live on the same server. 

The Drupal connection: Some modules have far greater memory needs than others. Views and CCK are among the big eaters, and as you'd expect, any module doing a lot of processing, such as those that resize images, will also eat up server memory and CPU. If you can't get a powerful server, cut down on power-hungry modules and give that wheezing hardware a break.

If your hosting service allows it, place both your Drupal installation and your MySQL database on the same server.

Who's equipped to host Drupal sites? Start with this list, or ask around.

Prepare for surges

Lucky you! You've been picked up by Slashdot or Digg or some such, sending a tidal wave of visitors crashing over your site. You're going to capsize, leaving visitors with nothing to see but an error message! 

Get ready for the possibility of sudden bursts of traffic:

Watch for surges

Watch for the beginning of traffic spikes so you can take quick action. 

The Drupal connection: The Incoming module promises to alert you of traffic surges.

Toss the heavy stuff overboard

Let's face it: turning off a lot of cool features in the name of performance can be heartwrenching for the site designer. Then again, maybe you don't need to run so Spartan when traffic is low. If you have the technical wherewithal, configure the slower, heavier features so they run while the server is chugging happily along, and shut down when the server is gasping for more power. During times of burst traffic, visitors might miss out on the glory of your commenting system or image galleries or whatever you've tossed overboard, but that's better than finding no operating site at all!  

The Drupal connection: There's a great tool to take care of this: the core Throttle module. When activated, it  adds "Throttle" check boxes to modules on your Modules form and to blocks on your Blocks form. Any module or block with a check will automatically be temporarily disabled when your site is under heavy load. (Set the "heavy load" threshold of visitors at admin/settings/throttle.)

Check your hosting service's policies

Ask around to find out how well your hosting service handles traffic spikes. It may be unavoidable that the server resources included in your account's pricing level will only handle so much traffic at once, but try to find a host that scores positively on questions including:

  • Will the host send warnings to you when traffic is spiking?
  • Does the host forgive some reasonable amount of spike-caused traffic over your bandwidth limit?
  • In the event of frequent spikes, will the host work help you explore solutions, or will it arbitrarily take nasty actions like suspending your account?

Measure peformance

What gets measured, gets fixed. There are countless sites out there to measure page loading times and – more importantly – tell you specifically what's wrong and what you may need to fix. Needless to say, the criticisms and suggestions provided by such services are all the opinions of the creators of the services, but with that caveat in mind, any such service should provide you with a barrel-full of areas on which to concentrate improvements, many already listed on this page and many not.

A starting list of services (add more in the comments, please!):

Site Load Test
A simple, straightforward check of performance metrics and suggested improvements. 

More resources

The Drupal connection: Drupal-specific resources:

Comments

tom's picture

great info. been using the right format for the job. JPEG or PNG are good choices for photographic images, but for simple graphics with few colors, the GIF format will produce smaller files.

-- home security systems nevada

drupalace's picture

Right. It's old news to experienced designers, but a good bit of info for those inexperienced in using images: JPEG and PNG are best for photographs or other images needing higher-quality color reproduction (with PNG the right choice if the image also calls for a transparent portion). For simple graphics (logos etc.) that don't need lots of colors, GIF is good as it offers smaller file sizes.

Thanks!

MacbookDonalds's picture

There's NO case when GIF is better than PNG.

 

drupalace's picture

Well, I can think of at least ONE case for using GIF instead of PNG: when it's known that desired visitors/users of a site are still hobbled by creaky old browsers that can't handle PNG.

Though I'll admit, I myself no longer worry about that in the least!

MacbookDonalds's picture

BTW there's a good test for optimization

http://siteloadtest.com

drupalace's picture

Hey, I like the nice straightforwardness of the service; thanks for the link. (And I see I have much work to do in improving my page loading performance...)

Add new comment