If you do the code you should know that while reading your code of javaScript and CSS browser delete all line breaks and spaces browser do not need any space in any statement of javaScript that’s why if you are writing alert();document.write(); browser will still understand but that would be a little difficult for you to understand cause its having no comments, no spaces, no line breaks.
What is Minify javaScript
As browser do not need line breaks, white spaces, comments to read the code cause browser separate code statement with colan ; in JavaSCript we give space, line breaks, comments to make code understandable for humans not browsers 🙂 Thus removing spaces, line breaks, comments from javaScript make minify javaScript.
Example of Minify JavaScript
Following is a compressed javaScript we can use online available tools or adobe dreamweaver to compress javaScript to make it minify.
[code lang=”js”]
;(function($){$.fn.adminMenu=function(selectedItemId){return this.each(function(){var $adminMenu=$(this);var cookieName=’am-menu’;if(selectedItemId&&!$adminMenu.data(‘selected’)){$adminMenu.data(‘selected’,1);selectItem(selectedItemId)}if($adminMenu.data(‘initialized’)){return}else{$adminMenu.data(‘initialized’,1)}$(‘a.folder’,$adminMenu).each(function(){var id=$(this).attr(‘id’);if(!isOpened(id)){$(this).closest(‘li’).find(‘ul’).hide();$(this).closest(‘li’).addClass(‘closed’)}else{$(this).closest(‘li’).addClass(‘opened’)}})$(‘a.folder’,$adminMenu).click(function(){var id=$(this).attr(‘id’);if(isOpened(id)){$(this).closest(‘li’).find(‘ul’).slideUp(‘slow’);setClosed(id);$(this).closest(‘li’).removeClass(‘opened’).addClass(‘closed’)}else{$(this).closest(‘li’).find(‘ul’).slideDown(‘slow’);setOpened(id);$(this).closest(‘li’).removeClass(‘closed’).addClass(‘opened’)}return false})function isOpened(id){id=prepareId(id);var openedIds=getOpenedIds();for(var i=0;i<openedIds.length;i++){if(openedIds[i]==id){return true}}return false}function selectItem(id){id=’menu-‘+id;$(‘li.active’,$adminMenu).removeClass(‘active’);$(‘#’+id,$adminMenu).parents(‘li’,$adminMenu).addClass(‘active’)}function setOpened(id){id=prepareId(id);var openedIds=getOpenedIds();if(!isOpened(id)){openedIds.push(id)}setCookie(cookieName,openedIds.join(‘;’))}function setClosed(id){id=prepareId(id);var openedIds=getOpenedIds();for(var i=0;i<openedIds.length;i++){if(openedIds[i]==id){openedIds.splice(i,1);break}}setCookie(cookieName,openedIds.join(‘;’))}function getOpenedIds(){var cookie=getCookie(cookieName);return cookie?cookie.split(‘;’):[]}function prepareId(id){return id.slice(5)}function setCookie(name,value){var today=new Date();var expiresDate=new Date();expiresDate.setTime(today.getTime()+365*24*60*60*1000);document.cookie=name+"="+escape(value)+"; path=/; expires="+expiresDate.toGMTString()+";"}function getCookie(name){var prefix=name+"=";var start=document.cookie.indexOf(prefix);if(start==-1)return null;var end=document.cookie.indexOf(";",start+prefix.length);if(end==-1)end=document.cookie.length;return unescape(document.cookie.substring(start+prefix.length,end))}})}})(jQuery);
[/code]
Why to minify JavaScript?
As we know that Jquery we mostly use minify version because that is a big code of javaScript and we minify it to reduce the browser effort, browser would not need to remove spaces, remove line breaks, remove comments to read the code. And when browser need to find any block of code suppose a function browser will feel easy to search that as well. To make our website light and fast we make javaScript minify.
To minify javaScript we can use Dreaweaver, we can use online pgorams like JavaSCript compressor, online JavaSCript compressor tool
If you are going to make your javaScript minify please save a backup and always provide a decoded version not compressed version to your clients as well so if they need to edit or play with anything. Also keep backup for your self sometime decoding from compressed javaScript do not work as expected. Thanks 🙂