تصغير CSS

احذف كل ما لا يحتاجه المتصفح من ملف CSS واعرف كم وفّرت من الحجم.

الصق CSS أو اكتبه، وتظهر النتيجة مع الحجم قبل التصغير وبعده فورًا.

طريقة الاستخدام

  1. الصق CSS في الخانة، أو اضغط «مثال» لترى النتيجة على ملف جاهز.
  2. اقرأ الحجم قبل التصغير وبعده تحت الناتج.
  3. انسخ الناتج أو نزّله باسم style.min.css.

عن الأداة

التصغير يحذف من ملف CSS ما يقرؤه الإنسان ولا يحتاجه المتصفح: التعليقات ⁦/* … */⁩، والمسافات البادئة، والأسطر الفارغة، والمسافات حول الأقواس والنقطتين والفواصل، والفاصلة المنقوطة بعد آخر خاصية في كل قاعدة. ملف بحجم 40 كيلوبايت يصغر عادة بين 15% و30%، وينزل أسرع على شبكات الجوال ويُضغط أفضل بـ gzip.

ما لا يمسّه التصغير أبدًا: محتوى النصوص بين علامتي تنصيص مثل ⁦content: 'a b'⁩، وما داخل ⁦url(...)⁩ حتى لو كان فيه مسافات، وأسماء المحددات والخصائص والقيم. المصغّر هنا يقرأ الملف رمزًا رمزًا فلا يخلط بين فاصلة منقوطة داخل نص وفاصلة تنهي خاصية، وهذا ما يخطئ فيه الاستبدال بالتعبيرات النمطية.

إن كان في الملف قوس لم يُغلق أو نص لم يكتمل، تتوقف الأداة وتشير إلى السطر والعمود بدل أن تُخرج ملفًا مكسورًا. والتصغير لا يغيّر ترتيب القواعد ولا يدمج المتشابه منها، فسلوك الصفحة يبقى كما كان بالضبط.

أسئلة شائعة

هل يغيّر التصغير شكل الصفحة؟

لا. يُحذف ما لا يؤثر في التفسير فقط: التعليقات والمسافات خارج النصوص وآخر فاصلة منقوطة في كل قاعدة. القواعد نفسها وترتيبها وقيمها تبقى كما هي.

ما الفرق بين التصغير وضغط gzip؟

التصغير يغيّر الملف نفسه ليصغر على القرص، وgzip يضغطه أثناء النقل من الخادم ويفكّه المتصفح. الاثنان يتكاملان: الملف المصغّر يُضغط بـ gzip أفضل، والفارق النهائي يظهر في سرعة التحميل على الجوال.

هل يحذف الأداة الخصائص المكررة أو غير المستخدمة؟

لا. معرفة ما إذا كانت قاعدة مستخدمة تحتاج إلى فحص صفحات الموقع كلها، وهذا خارج نطاق المصغّر. إن أردت ذلك فابحث عن أدوات إزالة CSS غير المستخدم ضمن أدوات البناء مثل PurgeCSS.