This is really nightmare for people who still use GPRS or the old 56kbps Dial-Up internet connection. It will takes minutes to load the sites or maybe it will takes forever because the browser usually won’t download it. Unfortunately, it’s very easy to solve this problem. Do you know that we can compress those files and reduce the size by half or more?

There are several method to compress javascript and I think one of the most efficient method is using Gzip Compression.

To implement the gzip compression for websites, first we need to gzip the Javascript files. For that purpose, we will need a gzip-compatible archiver / compressor. 7-zip is my favorite because it’s small, very fast and it’s completely free.

Gzip the JavaScript file, change the “gz” extension to “jgz” for safari compatibility and upload it to the same location together with the original script. Then next, we must ask apache to get the compressed version if there is available and finally tell the browser to un-compress the file before it can be used.

To do that, we add these following code in our .htaccess

RewriteEngine on
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.jgz -f
RewriteRule (.*)\.js$ $1\.js.jgz [L]
AddType "text/javascript" .js.jgz
AddEncoding gzip .jgz

That’s all. Yeah.. And if you want to look for another method this is it.:

• Joseph Scott’s Blog – Compressed JavaScript
• rakaz – Make your pages load faster by combining and compressing javascript and css files
• Added Bytes – PHP, Gzip and htaccess
• Let me have a blog – Using GZIP compression in web servers using .HTACCESS
• Apache Module – mod_deflate
• mod_gzip – Internet Content Acceleration module for the popular Apache Web Server

No related posts.

$(document).ready(function() {
$('.header-company').addClass('highlight');
});

This will add class named ‘highlight’ to element that have ‘header-company’ class. This is used generally for changing / adding class for CSS. So, when the document was loaded, the jQuery command will add the CSS Style.

Related posts:

1. Using Prototype

• Ajax
  jQuery is one of the ajax framework that used mostly by many web master.
• Shortcut access to DOM
  instead of using bulk of code in accessing DOM, jQuery have the shortcut.
• Manipulating the element content
  With jQuery, we can freely insert, update and delete every HTML element.
• Easy event handling
  Event handling is no fear again in web pages, jQuery make the process simple.
• Animation
  by default, jQuery already have ability to perform general animation on the pages.
• Action Chaining
  Instead of using many temporary variable and repetition lines, we can easily unite several lines of code that have same characteristic to a line code with chaining.
• CSS Compliance
  The jQuery selector is CSS Compliance, that make any designer that already have knowledge about CSS is able to learn jQuery easily.
• Cross browser
  using jQuery, no more hack for IE… the framework has done it automatically.

No related posts.

Another jQuery superiority is it has thousands of plugin that developed to extend jQuery’s functionality, the plugin make jQuery as an essential tool. Mastering jQuery allow you to add attractive interactions and animations to your web with AJAX, events, effects, and advanced JavaScript language features.

No related posts.