این ابزار درست کار نمی‌کند؟

دربارهٔ ابزار «فشرده‌سازی اسکریپت آنلاین»

این ابزار JavaScript را minify می‌کند، فضای خالی و نظرات را حذف می‌کند، نام متغیرها را در صورت امکان کوتاه می‌کند، و بهینه‌سازی‌های کوچک را برای کاهش اندازه فایل اعمال می‌کند. نتیجه از نظر عملکردی یکسان است اما به طور قابل توجهی کوچک‌تر است — اغلب ۴۰-۶۰٪ کوچک‌تر برای کد برنامه معمولی.

اسکریپت‌های minify شده سریع‌تر بر روی شبکه بارگذاری می‌شوند، فضای ذخیره‌سازی کمتری اشغال می‌کنند، و هزینه‌های پهنای باند را کاهش می‌دهند. خط لوله‌های ساخت مدرن (webpack، esbuild، vite) معمولاً به طور خودکار minify می‌کنند، اما این ابزار برای minify سریع یکباره خارج از تنظیمات ساخت مفید است.

ابزار API عمومی کتابخانه شما را حفظ می‌کند: نام‌های تابع و کلاس صادر شده از طریق module.exports یا export نگه داشته می‌شوند، در حالی که متغیرهای داخلی به شناسه‌های کوتاه تغییر نام داده می‌شوند.

چطور از این ابزار استفاده کنم؟

چطور یک فایل JavaScript را برای production فشرده کنم؟

  1. JS را بچسبانید

    JS خوانا را در فیلد «JS» قرار دهید. ماژول‌های کامل یا توابع منفرد قابل‌قبول‌اند؛ minifier روی AST حرکت می‌کند پس scope، hoisting و syntax arrow vs function را می‌فهمد.

  2. «اجرا» را بزنید

    خروجی `minified` و `savedPercent` (چقدر کوچک‌تر از ورودی) برمی‌گرداند. بُرد معمول: ۳۵-۵۵٪ روی JS دست‌نویس، کمتر روی bundle‌های از قبل tree-shake شده. نام‌های identifier طولانی بیشترین ضرر را می‌کنند.

  3. آنچه حذف می‌شود

    comment، whitespace، شاخه‌های مرده‌ای که minifier می‌تواند unreachable بودنشان را اثبات کند. identifier‌ها به single letter mangle می‌شوند جایی که safe باشد (local‌ها؛ export‌ها readable می‌مانند). string literal، body regex و template literal لمس نمی‌شوند.

  4. source map را skip نکنید

    وقتی برای deployment minify می‌کنید، یک sourcemap تولید کنید تا stack trace‌های production خوانا بمانند. این ابزار یک minifier سریع paste-and-go است — برای build واقعی از terser یا esbuild با `--sourcemap` استفاده کنید و `.map` را کنار bundle ship کنید.