Alachisoft NCache 4.1 - Online Documentation

Java Script Minification

 
All ASP.NET applications have to deal with extra overhead of loading multiple CSS and JavaScript files. Whenever a page is being rendered in the browser, the browser issues separate GET calls for each JavaScript file and each CSS file. And, this can easily result into many extra calls to IIS and slow down the response time of the ASP.NET pages.
 
Why Minify CSS and JavaScript Files?
 
JavaScript Minification is a process in which NCache reduces the size of all CSS and JavaScript files and also merges them into one or two files. As a result, a web browser only makes one or two extra calls to IIS when requesting a web page. Here are some reasons why you should minify JavaScript and CSS files:
  • Reduce number of HTTP requests a browser makes.
  • Set a futuristic date so browser caches files longer.
  • Minify JavaScript and CSS files and reduce their payload size.
  • Merge multiple JavaScript and CSS files into one.
  • Boost response time of web pages.
 
How does NCache Minify JavaScript and CSS?
 
NCache reduces the size of all JavaScript and CSS files by going through and removing all white spaces, tabs, and any other extra characters. It also reduces names of local variables and parameters but ensures that no logic is broken. Below is an example of a typical JavaScript function and then how it looks after it is minified.
 
function AddMPOverhang(leftOverhangId, rightOverhangId)
{                
var leftOverhang=document.getElementById(leftOverhangId);               
var rightOverhang=document.getElementById(rightOverhangId);                
if (leftOverhang !=null && leftOverhang.style !=null)                       
{                                
leftOverhang.style.position='relative';                                
leftOverhang.style.bottom='-7px';                        
}                
if (rightOverhang !=null && rightOverhang.style !=null)                        
{                                
rightOverhang.style.position='relative';                               
rightOverhang.style.bottom='-7px';                        
}        
}
 
Below is the same JavaScript function after it has been minified.
 
function AddMPOverhang(C,D){var B=document.getElementById(C);var
A=document.getElementById(D);if(B!=null&&B.style!=null)
{B.style.position="relative";B.style.bottom="-7px"}if       
(A!=null&&A.style!=null){A.style.position="relative";A.style.bottom="-7px"}}
 
In addition to reducing the size of all JavaScript and CSS files, NCache also merges multiple files into one, so the browser has to download only one or two files at most (one for JavaScript and one for CSS). This reduces the number of HTTP requests a browser has to make for loading an ASP.NET page and improves performance and scalability of web server farm.
Caching can be enabled on JavaScript and CSS files when a web page includes more then one JavaScript/CSS files. NCache caches the JavaScript and CSS files, reduces the size of all files and merge them into a single page (both CSS and JavaScript will be saved in separate files). In this case cached item doesn't expire automatically. To perish the content of JavaScript and CSS from cache, NCache provides you the following tool to clear the content:
 
clearcache cacheid/w[ebcontent]
 
This command will expire only the actual data while mapping remains in the cache.
 
 
See Also
 
Copyright © 2005-2012 Alachisoft. All rights reserved.