Firefox

Optimize Website Load Time | Compression Tools and Techniques

While making websites we often consider using a lot of scripts and styles in order to increase interactivity and make the website richer. As a result, we end up with slow website, while you can of course remove those scripts and styles to make it load faster Or you can make is load faster without removing any functionality by doing some easy tricks.

Compressing JavaScript

While compressing JavaScript is most recommended and has a great impact in website load time(Generally they are already compressed for many jQuery plugins). There are many tools and methods using which you can compress JavaScript, few most common tools are Yahoo’s YUI Compressor, Dean Edwards’ Packer, Douglas Crockford’s JSMin, Dojo ShrinkSafe and gzip or htaccess(explained later), these things may be sounding strange, but using them is very easy. These JavaScript minification tools preserve all the features of the JavaScript code, but reduce the code size by compressing them. There is no ‘best’ JavaScript compressor, each one of them have  their plus and minus, but you can always compare between the compressors at http://compressorrater.thruhere.net/, its really a nice tool.

Compressing CSS

CSS compressing is also a good technique to optimize website’s load time, there are many CSS minification tools too. Here is a great article on Design Shack for CSS Minification, you should definitely head over: 18 CSS Compression Tools and Techniques and one more at Cats Who Code which explains how you can do it just by PHP: 3 ways to compress CSS files using PHP.

gzip and htaccess

Understanding simply, if you use gzip or htaccess compression, what happens is your website files gets compressed, and the compressed files are send over to the web browser, and the web browser extracts it and shows it to the users. It reduces response time by reducing the size of the HTTP response, this trick is definitely beneficial. There are many tutorials for gzip compression, a good one is at Samuel Santos’ blog: Improving web performance with Apache and htaccess.

Compressor Tools

There are many websites where you can compress your code, here I am including some of the noteworthy ones.

CSS Drive Gallery- CSS Compressor


CSS Drive Gallery CSS Compressor

Compressor.Ebiene.de


Compress javascript and css. Amazing code compression. Quick easy and free

/packer/


packer

Javascript Compressor


Javascript Compressor compress code online for free

CSS Compressor


CSS Compressor Online code compressor for Cascading Style Sheets

Minify/Pack Javascript Online


Minify Javascript Online Online JavaScript Packer

Online YUI Compressor


Online YUI Compressor

Performance Tools

There are few extensions/add-ons too using which you can check the performance of your website and suggests ways to improve the performance. One of them is YSlow by Yahoo, it has a Firefox Add-on as well as a Chrome Extension. There is one more web based tool Page Speed Online hosted at Google Labs, which is equally good. There is also a simple gzip test tool: GIDZipTest.

Conclusion

Our website’s performance is an important factor, and one of the main things in it is the website load time, if our websites are slow, there are chances that user won’t return. Also, these compression techniques are easily doable by editing the .htaccess file or by adding simple snippets using php or using those web based tools. Thus, you should definitely consider doing these tricks.

 

Tackle Productivity lost due to Social Media using Chrome / Firefox Extension

You spend a lot of time on Internet without being productive at all, all thanks to those Social Media websites. Hours pass by doing not so productive work like updating your Facebook or Twitter, reading mails, watering plants on FarmVille, etc. You forget what you came to do.

Tackling it

If you are not happy with this, then you can take control of it by using an extension on your Web Browser. There are many time management desktop softwares available which you can easily get by searching on Internet. But here I am including the browser extensions, there are quite a few of these too, I am sharing two of them below, one is for Chrome and another is for Firefox.

Chrome: If you are on Google Chrome, there is this extension StayFocusd. Time Management Firefox, Chrome
You can allot time for particular website on per day basis using this extension. Like, you allot one hour for Facebook, this means you can not spend more than an hour on Facebook in total in a day, and you chose how you spend it throughout the day.

Firefox: If you are a Firefox user, you can use LeechBlock. You can specify which sites to block, and when to block them. Like blocking facebook.com from 1pm to 3pm or so. You can specify up to six sets of sites to block, with different times and days for each set.