یکی از روش های بهینه سازی کد های وب، مینیفای کردن (Minify) کد های جاوا اسکریپت، جی کوئری و… می باشد که به آن مینیفیکیشن می گویند (Minification یا Minimization). یک کد مینیفای شده بدین صورت است:
jQuery(document).ready(function(){jQuery("#submenu ul.sfmenu").superfish({delay:500,animation:{opacity:"show",height:"show"},dropShadows:true});jQuery("#kentcarousel").flexslider({animation:"slide",controlNav:false,animationLoop:false,slideshow:true,itemWidth:140,itemMargin:20,asNavFor:"#kentslider"});jQuery("#kentslider").flexslider({animation:"slide",controlNav:false,directionNav:false,animationLoop:false,slideshow:true,sync:"#kentcarousel"});jQuery("#tabs div").hide();jQuery("#tabs div:first").show();jQuery("#tabs ul.tabnav li:first").addClass("active");jQuery("#tabs ul.tabnav li a").click(function(){jQuery("#tabs ul.tabnav li").removeClass("active");jQuery(this).parent().addClass("active");var e=jQuery(this).attr("href");jQuery("#tabs div").hide();jQuery(e).show();return false});jQuery(".squarebanner ul li:nth-child(even)").addClass("rbanner")})
همه ی کد در یک خط ذخیره شده است.
این امر باعث حذف کاراکتر های Space اضافی و در نتیجه اشغال فضای کمتر و همچنین سرعت بارگذاری بالاتر می شود. همچنین خوبی دیگر این کار این است که دیگران براحتی نمی توانند کد های شما را تحلیل کنند؛ یا بعبارتی آبفوسکیت می شود (Obfuscation).
اما اگر شما بخواهید کد های minified را تحلیل کنید، نیاز به unminify کردن کد دارید.
ابزار های زیادی در دسترس هستند برای شما که این کار را انجام دهید. یکی از آنها سایت:
http://jsbeautifier.org
می باشد. این سایت مانند یک تول باکس رایگان و بی دردسر به شما امکان آن-مینیفای کردن کد های فشرده شده را می دهد،
تا چنین کدی بدست بیاید:
jQuery(document).ready(function() { /* Navigation */ jQuery('#submenu ul.sfmenu').superfish({ delay: 500, // 0.1 second delay on mouseout animation: { opacity:'show',height:'show'}, // fade-in and slide-down animation dropShadows: true // disable drop shadows }); /* Flexslider */ jQuery('#kentcarousel').flexslider({ animation: "slide", controlNav: false, animationLoop: false, slideshow: true, itemWidth: 140, itemMargin: 20, asNavFor: '#kentslider' }); jQuery('#kentslider').flexslider({ animation: "slide", controlNav: false, directionNav: false, animationLoop: false, slideshow: true, sync: "#kentcarousel" }); /* Tabs */ jQuery('#tabs div').hide(); jQuery('#tabs div:first').show(); jQuery('#tabs ul.tabnav li:first').addClass('active'); jQuery('#tabs ul.tabnav li a').click(function(){ jQuery('#tabs ul.tabnav li').removeClass('active'); jQuery(this).parent().addClass('active'); var currentTab = jQuery(this).attr('href'); jQuery('#tabs div').hide(); jQuery(currentTab).show(); return false; }); /* Banner claaass */ jQuery('.squarebanner ul li:nth-child(even)').addClass('rbanner');
همانطور که می بینید این سایت برای شما کدها را بصورت اتوماتیک و خودکار indent می دهد.
همچنین یک اکستنشن گوگل کروم وجود دارد بنام JSBeautify for Google Chrome که این کار را برای فایل های JavaScript ی که در بروزر (مرورگر) خود باز می کنید تسهیل می بخشد.