تخطى إلى المحتوى الرئيسي

Js Minifier

JavaScript minification reduces file size by removing whitespace, shortening variable names, and eliminating dead code — without changing behavior. It is a critical step in any production web build. Our minifier uses a proper AST-based approach (not simple string replacement) to safely minify JS while preserving functionality.

إدخال JS

Minified (% smaller)

شارك هذه الأداة
Developer Tools

حول JavaScript Minifier

JavaScript minification reduces file size by removing whitespace, shortening variable names, and eliminating dead code — without changing behavior. It is a critical step in any production web build. Our minifier uses a proper AST-based approach (not simple string replacement) to safely minify JS while preserving functionality.

كيفية الاستخدام

  1. Paste JavaScript code into the input area.
  2. Choose options: mangle variable names, drop console.log, remove dead code.
  3. See minified output with size reduction and a source map option.
  4. Beautify existing minified JS to make it human-readable for debugging.

الصيغة والمنهجية

Transformations: remove whitespace and comments; shorten variable/function names (a, b, c...); inline simple variables; remove unreachable code; replace long literals (true/false → !0/!1); combine consecutive var declarations. Advanced: tree-shaking (remove unused exports — requires module analysis). Typical savings: 30–70% on unminified JS.

حالات الاستخدام الشائعة

  • Production build: minifying application JS before CDN deployment
  • Bundle size audit: measuring how much minification improves load time
  • Legacy code: minifying inline scripts without a build pipeline
  • Debugging: beautifying minified library code to inspect behavior
  • Performance budget: ensuring minified JS stays under target size limits

الأسئلة الشائعة

Minification: removes whitespace, comments, and unnecessary characters — output is still readable with proper formatting. Uglification (mangling): also renames variables to single characters, making code intentionally hard to read. UglifyJS coined the term "uglify." Most modern tools (Terser, esbuild) do both. Minification alone saves ~20%; minification + mangling saves 40–70%. Both are reversible with a source map.
A source map is a file (.js.map) that maps minified code back to the original source — enabling readable stack traces and debuggable minified code in DevTools. In production: generate source maps but do not serve them publicly (they expose source code). Store them privately and upload to your error monitoring service (Sentry, Datadog). In development: always use source maps. The browser DevTools source maps panel lets you set breakpoints in original code.

أدوات ذات صلة

كل الأدوات →

دمج هذه الأداة في موقعك

مجاني للاستخدام الشخصي والتجاري. فقط انسخ الكود أدناه.