الميزات الرئيسية لمصغر جافا سكريبت هذا
- ضغط JS فوري داخل المتصفح (لا توجد رفع ملفات إلى الخوادم)
- إزالة التعليقات وطي المسافات البيضاء غير الضرورية/أسطر جديدة
- ضغط قائم على AST مشابه لـ Terser (طي الثوابت، إزالة الكود الميت تحت ظروف آمنة)
- تشويه المعرفات الاختياري وإعدادات متقدمة عبر API أو تكامل البناء
- يعمل مع جافا سكريبت الحديثة (ES2015+)، النصوص الكلاسيكية ومخرجات الوحدات البسيطة
- نسخ أو تحميل جافا سكريبت المصغرة بنقرة واحدة
- يستخدم نفس المكون الأساسي لمصمم جافا سكريبت: التبديل بين المخرجات المنسقة والمصغرة بإجراء واحد
- معالجة 100% على جانب العميل لأقصى درجات الخصوصية
🛠️ كيفية تصغير جافا سكريبت for javascript-minifier
الصق أو ارفع JS الخاص بك
أسقط ملف .js/.mjs في المحرر أو الصق جافا سكريبت مباشرة. الأداة مثالية للنصوص الفردية وملفات الأدوات والحزم الصغيرة.
اختر وضع التصغير
استخدم نفس المكون كمصمم جافا سكريبت: انتقل إلى إجراء التصغير للحصول على مخرجات مضغوطة بدلاً من الكود المنسق.
تشغيل المصغر
يتم تحليل الكود الخاص بك إلى AST، وإزالة التعليقات والمسافات البيضاء الإضافية، وتطبيق عمليات الضغط الآمنة لتقليل حجم الحزمة.
انسخ أو حمّل النتيجة
انسخ جافا سكريبت المصغرة من محرر المخرجات أو حمّلها كملف .min.js وضمّنها في HTML أو CDN أو مخرجات البناء الخاصة بك.
المواصفات الفنية
التحولات الأساسية (الإعدادات الافتراضية الآمنة)
تم تصميم الإعدادات الافتراضية المحافظة للحفاظ على سلوك وقت التشغيل مع تقليل حجم الكود بشكل كبير.
| العملية | مطبق | ملاحظات |
|---|---|---|
| إزالة تعليقات الأسطر والكتل | ✅ | يمكن الاحتفاظ بتعليقات الترخيص (/*! ... */) عبر التكوين/واجهة برمجة التطبيقات |
| طي المسافات البيضاء والأسطر الجديدة | ✅ | تطبيع المسافات البيضاء حيث يكون ذلك آمنًا دلاليًا؛ مع الحفاظ على محتويات النصوص والتعبيرات النمطية |
| طي الثوابت والإدراج البسيط | ✅ | فقط عندما تكون النتيجة مكافئة بشكل مؤكد |
| إزالة الكود غير المستخدم | ✅ | يزيل الفروع التي لا يمكن الوصول إليها بعد نشر الثوابت |
| تشويه المعرفات | ✅ اختياري | يقصر أسماء المتغيرات والدوال؛ قابل للتكوين عبر الخيارات المتقدمة/واجهة برمجة التطبيقات |
| إسقاط مساعدات التصحيح (console/debugger) | ✅ اختياري | يمكن تمكينه عندما لا تعتمد على إخراج الكونسول في الإنتاج |
ضوابط السلامة والتوافق
تساعد الخيارات المتقدمة (المعروضة بشكل رئيسي عبر أدوات البناء/واجهة برمجة التطبيقات) في ضبط مدى عدوانية عملية التصغير.
| الخيار | الافتراضي | الشرح |
|---|---|---|
| الهدف ECMA | 2020 | يتحكم في بناء جملة الإخراج وبعض قواعد الضغط |
| الوحدة مقابل السكريبت | سكريبت | تمكين تحسينات الوحدة/المستوى الأعلى لحزم ESM |
| keep_fnames / keep_classnames | false | الحفاظ على الأسماء لتحسين تتبع المكدس أو أطر عمل DI |
| safari10 / legacy quirks | off | تمكين فقط عند استهداف محركات قديمة محددة |
| toplevel | false | يسمح بإسقاط الربط غير المستخدم على المستوى الأعلى لهز الشجرة المتقدم |
تخفيض الحجم النموذجي
تختلف المدخرات اعتمادًا على التنسيق الأصلي، وكثافة التعليقات، وكمية الكود غير المستخدم الموجود.
| نمط الإدخال | الضغط فقط | ضغط + تشويش (عدواني) |
|---|---|---|
| معلق عليه ومسافات بشكل كبير | 35%–55% | 50%–70% |
| كود تطبيق منسق بشكل معتدل | 20%–35% | 35%–55% |
| كود مضغوط بالفعل | 5%–15% | 10%–25% |
بدائل سطر الأوامر لبناء الإنتاج
للتطبيقات الكاملة ومشاريع الملفات المتعددة، ادمج التصغير في خط أنابيب CI/CD الخاص بك.
Node.js
Terser (الحالة الشائعة)
npx terser src/app.js -o dist/app.min.js -c ecma=2020,passes=2 -mتمريرتان للضغط بالإضافة إلى تشويش المعرفات لتقليل الحجم بقوة.
Terser مع الأسماء المحجوزة و drop_console
npx terser src/app.js -o dist/app.min.js -c passes=2,drop_console=true -m reserved=["React","ReactDOM"] --keep-fnamesاحمِ المتغيرات العامة المهمة، أزل استدعاءات الكونسول، واحتفظ بأسماء الدوال لتصحيح الأخطاء.
Linux/macOS/Windows
esbuild (سريع جداً)
npx esbuild src/app.js --minify --target=es2018 --outfile=dist/app.min.jsحزّم وصغّر في خطوة واحدة سريعة للغاية.
SWC (مبني على Rust)
npx swc src -d dist --minifyحوّل وصغّر باستخدام محرك Rust عالي الأداء.
حالات الاستخدام الشائعة
أداء الويب والمؤشرات الأساسية للويب
- تقليل حجم نقل JavaScript لتحقيق LCP و TTI أسرع
- قص التعليقات وأوامر التسجيل قبل النشر
- تصغير الحزم من جانب العميل قبل ضغط gzip/brotli
/* تعليق للبناء فقط سيتم إزالته في المخرجات المصغرة */CI/CD وأتمتة الإصدار
- صغّر JS كخطوة أخيرة في خط أنابيب البناء الخاص بك
- جهز حزم صغيرة صديقة للذاكرة المؤقتة لشبكات CDN
- أنشئ أصول جاهزة للإنتاج بجانب مصغرات HTML/CSS
الأدوات المدمجة، التضمينات والتجارب
- شحن مقاطع مضغوطة عبر مديري العلامات
- تضمين عناصر واجهة مستخدم مصغرة في صفحات الطرف الثالث
- تجربة استراتيجيات ضغط مختلفة على النصوص البرمجية الحرجة
❓ Frequently Asked Questions
هل سيغير تصغير JavaScript من طريقة تشغيل الكود الخاص بي؟
هل تتعامل هذه الأداة مع TypeScript أو JSX مباشرة؟
هل يتم رفع JavaScript الخاص بي إلى خادم؟
ما هو الحجم الأقصى لملف JavaScript الخاص بي؟
ما الفرق بين التنسيق والتصغير؟
Pro Tips
عرف NODE_ENV=production (أو ما يعادلها) في أداة الحزم الخاصة بك لفتح إمكانية إزالة الكود غير المستخدم في العديد من المكتبات.
احتفظ بالمصادر غير المصغرة (وللتطبيقات الكبيرة، خرائط المصدر) في نظام التحكم بالإصدار، وقدم فقط الأصول المصغرة في بيئة الإنتاج.
استخدم الأسماء المحجوزة عند التشويش لحماية واجهات برمجة التطبيقات العامة المعلقة على window أو globalThis.
اجمع التصغير مع gzip أو brotli على مستوى CDN أو الخادم لتحقيق توفير مضاعف في الحجم.
Additional Resources
Other Tools
- محسن CSS
- محسن HTML
- محسن Javascript
- محسن PHP
- منتقي الألوان
- مستخرج Sprite
- فك تشفير Base64
- تشفير Base64
- منسق Csharp
- منسق CSV
- Dockerfile Formatter
- منسق Elm
- منسق ENV
- منسق Go
- منسق Graphql
- منسق Hcl
- منسق INI
- منسق JSON
- منسق Latex
- منسق Markdown
- منسق Objectivec
- Php Formatter
- منسق Proto
- منسق Python
- منسق Ruby
- منسق Rust
- منسق Scala
- منسق سكريبت Shell
- منسق SQL
- منسق SVG
- منسق Swift
- منسق TOML
- Typescript Formatter
- منسق XML
- منسق YAML
- منسق Yarn
- مختصر CSS
- Html Minifier
- مختصر JSON
- مصغر XML
- عارض رؤوس HTTP
- PDF إلى نص
- مختبر Regex
- مدقق ترتيب SERP
- بحث Whois