Website Performance tips
Website performance has been a critical issue for several companies I have worked for, and yes, I said several, not all. There are some common sense performance tips that apparently are not so common. I have received a few emails asking specifically if I could help them with their performance issues. For the record, most of my consulting usually is to help setup a backup system after a fatal loss, quick tip: create a backup strategy early, and backup often, and save yourself consulting fees. :-) Ok, on to website performance tips.
Find out where you are right now
People often ask, "we need to improve our sites performance". I often respond, "What are your page load times right now?". I get responses ranging from "it just seems slow" to "it isn't as fast as other sites". I love the specifics. What other sites, slow compared to what? What are you shooting for? You don't know anything on what you expect. So tip #1... What are you measuring? Where are you at? You can use Google PageSpeed Insights to get you a number for desktop and mobile. It also provides some valuable tips on what you should do. In addition to that tools.pingdom.com and the Google developer tools network tab can show you some statistics. However a HUGE note...
Pick one metric and stick with it
I have seen people attempt to use 4 different tools and compare one to another, and then improve it on one, and then compare it to another. Metrics are used for comparisons. BE CONSISTENT IN YOUR MEASUREMENTS.
Ok, that being said, let's get to some basic tips that are apparently not so common.
Minimize your JavaScript
There are a lot of tools out there (jscompress is one I have used in the past) to compress your JavaScript, that can help page load time.
Clean up your CSS
We keep adding random classes to tweak our layouts without realizing the impact. If you organize your CSS and each time you add a new class, think about what you are adding, does it already exist, DRY principle (don't repeat yourself, for those who don't know). Also, with Less and Sass, you can organize and compress your CSS easily.
Have some level of caching and compression
For you WordPress bloggers, you can use a plugin that caches for you. I use wp super-cache. Also, you can enable compression on IIS/Apache. Yes, it is that easy.
Compress your images
One of the biggest bloaters is images. People take pictures and upload them to their site immediately. Sometimes I have seen sites with 10mb files that they are wondering why they are so slow to download. Think of your audience. Images don't need to be high quality for the web. They are not going to be printed on a 36x36 canvas... they just want to see the picture. Compress your images, reduce the quality, and I try to keep my images under 100k... there are exceptions to this rule, but that is my rule of thumb.
Fix your code
Now, that seems vague and a catch-all, but I will be a little more specific.
- Remove broken links
- Fix blocking files
- Remove broken images
The 404 issues cause a timeout issue and it really slows page load time. I suppose 1 and 3 are the same, but I wanted to call out images specifically.
I didn't want to write a long drawn out blog about why perf tune your site, but give you some quick immediate action items that you can implement today. I hope this helps.
Thanks for stopping by and if you have other suggestions, let me know. I can always learn more. :-)