ضاغط JavaScript
اضغط JavaScript أو جمّلها أو تحقق منها، مع إحصاءات الضغط وتحليل الشيفرة وتقرير التحسين، كل ذلك محليًا في متصفحك.
واجهة الأداة نفسها باللغة الإنجليزية حاليًا، وتعمل بالكامل داخل متصفحك.
جارٍ تحميل الأداة…
ماذا يفعل ضغط JavaScript
ضغط JavaScript أكثر تعقيدًا من ضغط CSS، لأن التحويل يجب أن يحافظ على سلوك البرنامج تمامًا. يحلل الضاغط الشيفرة إلى شجرة بناء جملة، ثم يعيد إخراجها دون مسافات أو تعليقات أو علامات ترقيم غير ضرورية، ويعيد عادةً تسمية المتغيرات المحلية بأحرف مفردة، فتصبح calculateTotalPrice هي a داخل نطاقها. وتستخدم هذه الأداة مكتبة Terser المعروفة لهذا الغرض.
وإعادة التسمية هي مصدر معظم التوفير، وهي آمنة فقط للأسماء التي يستطيع المحرك إثبات أنها محلية. فأي شيء يمكن الوصول إليه من الخارج، كالدوال المُصدَّرة والكائنات العامة والخصائص التي يُوصل إليها بالنص، يجب أن يحتفظ باسمه. ولهذا أيضًا تجعل الشيفرة المضغوطة تتبع الأخطاء عديم الفائدة، ولهذا تُنشر بناءات الإنتاج مع خرائط المصدر: ملف منفصل يربط الناتج المضغوط بأسطرك الأصلية حتى تستطيع تتبع أخطاء ما يشغّله المستخدمون.
لماذا أنشأنا هذه الأداة
ملفات البرمجة أثقل جزء في معظم الصفحات وأغلاها معالجة، لأن البايتات يجب أن تُنزّل وتُحلّل وتُترجم وتُنفّذ. وتقليصها من أعلى التحسينات قيمة في الأداء، خصوصًا على الهواتف متوسطة الأداء.
والشيفرة التي تضغطها منتجك، أحيانًا قبل إطلاقه، وقد تحتوي أحيانًا على نقطة API أو مفتاح ما كان ينبغي أن يكون فيها. وإرسالها إلى خادم غريب لتوفير بضعة كيلوبايتات صفقة خاسرة. ضاغطنا يجري دورة التحليل والإخراج كاملة داخل متصفحك، فلا تغادر شيفرتك التبويب، ولا حد لحجم الملف، ولا تُحفظ أي نسخة في أي مكان.
نصائح وأخطاء شائعة
- اختبر دائمًا الناتج المضغوط قبل نشره؛ فالضغط هو حيث تظهر أخطاء السلوك الخفية.
- الشيفرة التي تعتمد على أسماء الدوال وقت التشغيل، أو على الوصول إلى الخصائص بالنص، قد تنكسر حين تُختصر الأسماء؛ استخدم خيار الحفاظ على أسماء الدوال عند الحاجة.
- أنشئ خرائط المصدر واحتفظ بها لتبقى تتبعات الأخطاء في الإنتاج مقروءة.
- لا تضغط أبدًا شيفرة فيها مفاتيح API كوسيلة لإخفائها؛ فأي شيء يُرسل إلى المتصفح قابل للقراءة.
بداية سريعة: استخدام ضاغط JavaScript
- الصق JavaScript أو حمّل ملف .js أعلاه.
- شغّل الضاغط وتحقق من نسبة التصغير المعروضة.
- اختبر الناتج المضغوط في تطبيقك قبل نشره.
- احتفظ بالمصدر غير المضغوط في نظام إدارة الإصدارات؛ فالضغط غير قابل للعكس الكامل.
- قدّم الملف بضغط gzip أو Brotli لتوفير إضافي.
استخدمها مع ضاغط CSS وضاغط HTML لتقليص الصفحة كلها.
ما الذي يزيله الضغط
يقلّص ضاغط JavaScript حجم الملف دون تغيير السلوك بإزالة:
- التعليقات: توثيق يتجاهله المحرك.
- المسافات وفواصل الأسطر: كل التنسيق الذي يساعد على القراءة.
- الأحرف غير الضرورية: الفواصل المنقوطة الاختيارية والأقواس الزائدة حيث يسمح بناء الجملة.
والضاغطات المتقدمة تعيد تسمية المتغيرات المحلية بأحرف مفردة (userAccount تصبح a)، وهذا يوفر مساحة كبيرة في الشيفرة ذات الأسماء الطويلة الوصفية. يعمل البرنامج بالضبط كما كان؛ إنه فقط أصغر وغير مقروء.
الضغط ليس حماية
مفهوم خاطئ شائع: الشيفرة المضغوطة ليست محمية. فإعادة تسمية المتغيرات تصعّب قراءتها، لكن أي شخص يستطيع تمريرها عبر أداة تجميل ودراسة منطقها. الضغط تحسين للأداء، لا وسيلة لإخفاء الأسرار. لا تضع أبدًا مفاتيح API أو كلمات مرور أو منطقًا حساسًا في JavaScript تعمل في المتصفح متوقعًا أن يخفيها الضغط؛ فلن يفعل.
احتفظ بالمصدر وانشر المضغوط
كما في CSS، لا تصن JavaScript المضغوطة يدويًا أبدًا. احتفظ بمصدرك المقروء، وعدّله هو، ولا تضغط إلا ما تنشره. وإذا انكسر ملف مضغوط في الإنتاج، فتتبّع الخطأ في الأصل؛ فتتبعات الأخطاء المضغوطة شبه عديمة الفائدة دون خريطة مصدر.
اختبر بعد الضغط
الضغط القوي يكشف أحيانًا خطأً كامنًا: شيفرة اعتمدت على اسم متغير، أو على حالات حدّية حساسة للمسافات. شغّل الحزمة المضغوطة دائمًا مرة قبل نشرها لتتأكد من سلوكها. والضاغطات الموثوقة نادرًا ما تسبب ذلك، لكن الفحص السريع تأمين رخيص.
استخدامات شائعة
- تسريع تحميل الصفحة وزمن الوصول إلى التفاعل.
- تقليل استهلاك البيانات لملفات البرمجة.
- تجهيز الشيفرة للإنتاج.