Speed up your site – drop in .htaccess file

It’s very important to speed up your web sites so you don’t loose the users.

That being said, many tasks in the checklists from Yahoo or Google are quite complex and are hard to grasp for people who didn’t work all their life configuring Apache or digging deep into the depths of HTTP.

To help this, I created a drop-in .htaccess file that will enable gzipping and long term expiration (helping with unique URLs for your assets).

<IfModule mod_deflate.c>
# Insert filter
SetOutputFilter DEFLATE

# Netscape 4.x has some problems...
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip

# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won't work. You can use the following
# workaround to get the desired effect:
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html

# Don't compress images
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip
</IfModule> 

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteRule ^(.*)\.(\d+)(_m_\d+)?\.([^\.]+)$    $1.$4    [L,QSA]
</IfModule> 

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/vnd.microsoft.icon "access plus 1 year"
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/x-javascript "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType text/javascript "access plus 1 year"
</IfModule>

Gzip-ing and infinite (1 year is long enough) expiration are enabled right away.

In order for you to not have problems with cached items (infinite expirations are good, not bad), you’ll have to change URLs of all your static assets next time you change them. All you need to do is to add .XXX in front if file extension and URL will be unique (still pointing at your file, thanks to mod_rewrite rules above).

So, for example, if you have logo.png, all you need to do next time you change it is to link to it as logo.1.png and next time logo.2.png and so on, this way cache will not be used and you will no longer have cacheing problem:

    <img src="/logo.2.png" alt="Company Logo"/>

Go ahead and put it in the root of your site and let me know how it works for you.

P.S. it assumes that you use Apache 2.x and your hosting company configured apache to have mod_rewrite, mod_gzip and mod_expires modules, if they did not, just ask them, they should be able to do that easily.

ShowSlow v0.5 is smooth

Many people were frustrated with the graphs ShowSlow was showing as rankings and other measurements change too frequently if your pages are dynamic in nature and show different content on every request.

ShowSlow v0.5 is using rolling average to smooth the graphs, hope it’s going to be easier on your eyes and will help you get more meaning from the graphs.

ShowSlow 0.5 with smoothed graphs

Go ahead and download new version:
http://www.showslow.org/Installation_and_configuration#Getting_the_code

or just type “make” if you installed from Subversion.

WebPageTest.org Demo @ New York Web Performance Meetup

New York Web Performance Group Logo
WebPageTest.org is getting more and more popular, it was included in Google’s epic announcement that site performance is now part of ranking!

So, this Thursday, April 15th, get ready for WebPageTest.org Demo by Nicholas Tang at New York Web Performance Meetup!

If you haven’t RSVPed yet, now is your chance! If you can’t attend please update your RSVP as well to let others in.

http://www.meetup.com/Web-Performance-NY/calendar/12915226/

Don’t forget that we’re back at Interactive One offices and they are also sponsoring pizza and sodas!

Getting there:
205 Hudson Street (entrance on Canal St.)
6th Floor
New York, NY 10013
212-431-4477

Directions: http://bit.ly/bnbCvB
Street view: http://bit.ly/dDrToe (entrance on Canal St.)

Hope to see you all there and please forward it to your friends so they can learn about this great tool!

Presentation will start at 7:00PM. I’ll see you there!

Who’s site is faster – yours or your competitors’?

After I presented ShowSlow at Velocity Online Conference two weeks ago, I got a lot of suggestions regarding the software or a public instance and one of them was from Steve Souders who recommended creating a comparison page where people can see rankings for different sites compared over time.

It immediately resonated with me (G vs. Y! spirit) as I always try to create thought provoking features within ShowSlow that can help business people and developers ask new kinds of questions about their systems. In this case, the question is obvious – “Am I better then my competitors?“.

You can click “Compare rankings” tab on ShowSlow.com to see who is better – Google, Yahoo or Amazon?

Google vs. Yahoo! vs. Amazon YSlow ranking over time

Or you can just enter the URLs you’d like to compare and ShowSlow will display rankings graph for YSlow or PageSpeed (granted that data for these URLs was collected).

Each instance of ShowSlow can have it’s own it’s own set of URLs configured to link from “Compare rankings” tab so you can have your own competition (external or internal) measured.

Send me your fight stories or effect this tool had on your business folks, I’m very interested to see if this thing sparks the interest in performance project you’re running.

Thanks Steve!

Automating YSlow and PageSpeed using Xvfb

I’d like to welcome Aaron Kulick to ShowSlow team!

Aaron was active user and contributed a few patches and then started to actively contribute documentation to the project wiki: showslow.org.

Now Aaron is a full-blown contributor with SVN access and his first contribution is solving the most common problem – how do we automate YSlow and PageSpeed in a headless mode.

He created an automation section in the repository, feel free to check out his code and share your experience: http://code.google.com/p/showslow/source/browse/#svn/trunk/automation.

In two words, all you need to do is:

  • Run a memory framebuffer server (Xvfb)
  • Then configure Firefox profile(s) with different settings disabling some features that require user intervention and enable autorunning the extensions and beacons
  • Then you just create a list of URLs to test and feed it to test_harness.pl script that will launch Firefoxes appropriately

monitor.sh is a simple shell wrapper around the harness script that you can simply run from the cron job.

For more information read the README file and I hope we’ll have more documentation on showslow.org as well!

Please join me in thanking Aaron for this important tool!

Also, just a reminder, if you are not subscribed to a mailing list / google group, you can do that here:
http://groups.google.com/group/showslow