Tag Archives: JavaScript

کمینه سازی Minification

کمینه سازی یا Minification چیست؟

کمینه سازی سورس کد یا به اختصار کمینه سازی (Minification) اصطلاحی در حوزه برنامه نویسی است و به فرایندی گفته می‌شود که طی آن تمامی اجزا و کاراکترهای غیرضروری از سورس کد حذف می‌شود. کمینه سازی علاوه بر اینکه در نتیجه اجرای سورس کد اختلال یا تغییری به وجود نمی‌آورد، حجم فایل مربوطه را نیز کاهش می‌دهد. گاهی اوقات از واژه Minimization نیز به عنوان معادلی برای این اصطلاح استفاده می‌شود.

کاراکترهای غیر ضروری (شامل کاراکتر فاصله و خط جدید) و همچنین المان هایی نظیر کامنت ها (که برای توصیف عملکرد قسمت‌های مختلف کد استفاده می‌شوند) در حین انجام فرایند Minification از سورس کد حذف می‌شوند. از آنجایی که این اجزا و کاراکترها غالبا برای خواناتر کردن سورس کد به کار می‌روند حذف آن‌ ها تاثیری روی نتیجه اجرای کد نخواهد داشت.

فرایند کمینه سازی به خصوص در مورد سورس کدهای مرتبط با صفحات وب نظیر فایل های جاوا اسکریپت (JavaScript) به عنوان یک زبان برنامه نویسی تفسیری، شیوه نامه های آبشاری (CSS) و فایل های اچ تی ام ال (HTML) به کار می‌رود. کاهش حجم این منابع باعث می‌شود فایل ها با سرعت بیشتری به دست کلاینت ها (برای مثال مرورگرهای وب) برسد و درنتیجه منجر به کاهش زمان لازم برای لود شدن صفحات وب خواهد شد.

ممکن است کمینه سازی کد تنها چند درصد از حجم یک فایل را کاهش دهد اما همین میزان اندک – به خصوص زمانی که مساله افزایش سرعت بارگیری صفحات وب در میان است – از اهمیت بالایی برخوردار خواهد بود. این افزایش سرعت نه تنها برای کلاینت ها مفید است بلکه میزان مصرف پهنای باند و ازدحام روی سرور را نیز کاهش خواهد داد.

فارغ از روش‌های ساده‌ای نظیر حذف کامنت ها و فاصله ها از سورس کد، ممکن است تکنیک‌های پیشرفته‌تری نیز برای کمینه سازی مورد استفاده قرار گیرد. جایگزینی نام‌های طولانی متغیرها و توابع با نام‌هایی با تعداد کاراکتر کمتر (و حتی تک کاراکتری) در سورس کدهای بسیاری از زبان‌ها (به خصوص JavaScript) و جایگزینی ویژگی‌های مرتبط با یک ویژگی خلاصه شده (Shorthand Property) و حذف قانون‌ها یا ویژگی‌های تکراری در CSS از جمله این موارد هستند.

معکوس این فرایند که به Unminification موسوم است قادر است سورس مینیفای شده را به یک نسخه معمولی و خواناتر تبدیل کند.

ابزارهای Minification

همان طور که انتظار می‌رود انجام فرایند کمینه سازی توسط توسعه دهندگان به صورت دستی نیز امکان‌پذیر است. با اینحال معمولا به دلیل حجم بالای سورس کدها و دشواری انجام این کار توصیه می‌شود از ابزارهای مخصوصی که قادر به انجام خودکار کمینه سازی هستند استفاده شود. به کارگیری این ابزارها علاوه بر سرعت بالاتر مانع از خرابکاری‌هایی می‌شود که ممکن است در اثر مینیفای کردن دستی سورس کدها حاصل شود.

برای برخی از زبان ها ابزارهای نرم افزاری متعددی در دسترس توسعه دهندگان قرار گرفته است که با روش‌های ساده تا پیشرفته به مینیفای کردن سورس کد می‌پردازند. از جمله مشهورترین این ابزارها می‌توان به HTMLMinifier برای اچ تی ام ال، CSSO برای سی اس اس و Google Closure Compiler و UglifyJS برای جاوا اسکریپت اشاره کرد.

هرچند بسیاری از کمینه سازها بخش عمده‌ای از فرایند Minification را به خوبی انجام می‌دهند اما ممکن است تکمیل دستی این فرایند توسط توسعه دهندگان خبره و حتی دقت در به کارگیری مناسب از کدهای با قابلیت استفاده مجدد در هنگام کدنویسی به بهبود قابل توجه خروجی بیانجامد.

کمینه سازی و فشرده سازی

با وجود اینکه کمینه سازی و فشرده سازی (Compression) داده ها هر دو می‌توانند باعث کاهش حجم فایل سورس کد شوند اما نباید آن‌ها را یکسان دانست. در واقع سورس کد کمینه شده می‌تواند بدون نیاز به انجام مرحله‌ای اضافه بلافاصله تفسیر و اجرا شود؛ این در حالیست که سورس کد فشرده شده پیش از اجرا شدن لازم است از حالت فشرده خارج شود. در عین حال مفسر می‌تواند با نسخه اصلی یا نسخه کمینه سازی شده کار کند بدون اینکه تغییری در مفسر ایجاد شود.

جالب است بدانید بسیاری از وبسایت‌ها از هر دو روش کمینه سازی و فشرده سازی فایل ها برای کاهش حجم داده هایی که باید منتقل شود استفاده می‌کنند.

مثال هایی از کمینه سازی

در مثال زیر می‌توانید نمونه‌ای از یک قانون CSS را قبل و پس از انجام Minification مشاهده کنید. همانطور که می‌بینید در این قانون علاوه بر اینکه کامنت، سمی کلن اختیاری انتهایی، کاراکترهای اضافی فاصله و خط جدید حذف شده‌اند، ویژگی خلاصه شده border نیز جایگزین سه ویژگی مجزای border-width و border-style و border-color شده است.

کمینه سازی Minification
نمونه‌ای از انجام Minification روی یک قانون CSS

در مثال زیر نیز یک قطعه کد جاوا اسکریپت و نسخه حاصل از اعمال فرایند Minification توسط Google Closure Compiler را مشاهده می‌کنید:

کمینه سازی Minification
نمونه‌ای از انجام Minification روی یک قطعه کد جاوا اسکریپت

مزایا و معایب Minification

همانطور که پیشتر به آن اشاره شد Minification قادر است با کاهش حجم سورس کد به ویژه در مورد منابع وب به لود شدن سریعتر صفحات وب و کاهش پهنای باند مورد نیاز برای انتقال داده ها منجر شود.

با اینحال کدهای کمینه شده معمولا به اندازه نسخه اصلی خوانا نیستند و به علاوه فاقد مستنداتی هستند که در سورس کدهای معمولی دیده می‌شود. بنابراین نسخه‌هایی که روی آن‌ها فرایند Minification انجام شده است برای مطالعه و بررسی یا ویرایش و تغییر مناسب نیستند. به همین دلیل برخی از توسعه دهندگان، نسخه اصلی سورس کد را نیز به صورت مجزا یا همراه با پکیج اصلی منتشر می‌کنند تا خوانایی و امکان تغییر آسان آن در آینده میسر شود.

برخی از متخصصین معتقدند کمینه سازی را می‌توان روشی برای مبهم سازی (Obfuscation) سورس کد به شمار آورد؛ با این وجود مشابه با ابزارهایی که برای انجام خودکار Minification به کار می‌روند، ابزارهای ویژه‌ای نیز برای Unminification طراحی و منتشر شده است.

پیوندهای پیشنهادی تک دیک

لینک واژه در ویکیپدیا

جاوا اسکریپت JavaScript

جاوا اسکریپت یا JavaScript چیست؟

جاوا اسکریپت (JavaScript یا به اختصار JS)، یکی از زبان‌های برنامه‌نویسی اسکریپتی و سطح بالاست که در کنار HTML و CSS به عنوان یکی از اصلی‌ترین تکنولوژی‌های توسعه‌ی وب به شمار می‌رود. بسیاری از وبسایت‌ها از جاوا اسکریپت برای برنامه‌نویسی و تعیین رفتار صفحات وب استفاده می‌کنند.

JavaScript از جمله زبان‌های تفسیری (Interpreted) به شمار می‌رود و در نتیجه، دستورات آن نیازی به کامپایل شدن ندارد. در اکثر مرورگرهای وب امروزی، از JavaScript به صورت پیش‌فرض و بدون نیاز به نصب افزونه و بسته‌های تکمیلی پشتیبانی می‌شود. جالب است بدانید ریشه‌های این زبان به مرورگر Netscape باز می‌گردد.

از نظر فنی کدهای JavaScript را می‌توان در داخل بخش <head> یا <body> فایل‌های HTML قرار داد. هم‌چنین می‌توان کل اسکریپت‌های این زبان را داخل یک فایل جداگانه با پسوند js ذخیره نمود و سپس آن‌ها را در اسناد مختلف HTML فراخوانی نمود. به این نوع اسکریپت‌ها، جاوا اسکریپت خارجی یا External گفته می‌شود و این امکان را فراهم می‌آورد که بتوان بدون نیاز به تکرار قطعات کد از آن‌ها برای تمامی صفحات مختلف یک سایت استفاده نمود.

با وجود اینکه بیشترین کاربرد این زبان، افزودن رفتار قابل اجرا در سمت کلاینت (Client-side) به صفحات HTML و ایجاد وبسایت‌های پویا می‌باشد اما امروزه کدهای JavaScript می‌توانند در سمت سرور (Server-side) نیز اجرا شوند.

جاوا و جاوا اسکریپت

هرچند جاوا و جاوا اسکریپت از نظر ساختاری هر دو مشابه زبان برنامه نویسی C و دارای نام‌های مشابهی هستند اما چه از نظر کاربرد و چه از نظر ماهیت طراحی تفاوت‌های بسیاری با یکدیگر دارند. به علاوه Java یک زبان برنامه‌نویسی کامپایل‌شده است درحالیکه JavaScript یک زبان اسکریپتی تفسیری است.

کاربردهای جاوا اسکریپت

مرتب‌سازی جداول، واکنش نشان دادن به رویدادها، اعتبارسنجی مقادیر داده‌ها، تشخیص مرورگر و سیستم‌عامل کاربر، افزودن محتوا به صفحه بدون بارگیری مجدد آن (با تکنولوژی Ajax)، متحرک‌سازی المان‌های موجود در صفحات وب، پخش موسیقی و ویدیو از جمله کاربردهای رایج JS به شمار می‌رود که در بسیاری از سایت‌های امروزی قابل مشاهده است.