Grading your website's performance can be difficult. How do you know the changes you've made are good or bad? How do you what the best practices are? How do you know what you should focus on that needs the most improvements? Thankfully, there is YSlow from Yahoo. YSlow is a browser extension that instantly rates your website's performance via a handy report card like the one below for Chillidog Software.
What does it take to achieve a decent score in YSlow? It turns out, it isn't very difficult after all. Let's take a look.
How to increase your YSlow score in RapidWeaver
Before I begin, I should note that getting all A's here is very hard within RapidWeaver. A 'C' is actually very good. YSlow is a very difficult grader. :)
In RapidWeaver, here are the 3 main things you can do to easily achieve a decent score in YSlow.
- If you're using Stacks, make sure you're using version 2.5 or later. Version 2.5 will combine all CSS and JS files on a page into one.
Turn on 'consolidate common files' and 'consolidate CSS files' within RapidWeaver's preferences.
Use GZip compression.
</body> tag. If you're unsure if your theme supports this, please contact the theme designer.
- Optimize your images using a tool like ImageOptim.
What is a 'C' considered 'good' for RapidWeaver sites
I consider a 'C' in YSlow to be good because for RapidWeaver sites for a few reasons centered around how RapidWeaver works internally. Let's look at a few of these failing marks and explain how this happens.
- Use a CDN It isn't easy to manage and publish your files to a CDN. Instead, I'd recommend CloudFlare
- Add Expires Header The Expires Header will make the browser cache the pages locally. This greatly speeds up your site. The issue, however, is that your changes aren't immediately picked up. If you set an Expires value for 1 day, then users won't see your changes until this time lapses. I personally don't use it at the moment so that I can see my changes immediately. In the future, I may do something in the range of 4hrs.
- Put CSS at the top When you use a plugin like PlusKit, assets are embedded directly within the page. As a result, CSS assets end up within the
<body> of your page. This will hurt your YSlow score slightly.
- Put JS at the bottom Unfortunately, this isn't something that is possible within the RapidWeaver SDK for plugin developers. Themes may do this, but plugin developers can not. As a result, some of your JS files will end up in
Phew. Now go grab YSlow and get to work making your site as fast as possible! :)
Your top dog,