مستوى المقال: مبتدئ
لو موقعك العربي بياخد ثانيتين قبل ما النص يظهر للزائر، المشكلة مش في السيرفر ولا في الـ JavaScript. خط زي Cairo أو Tajawal أو IBM Plex Sans Arabic ملفه الأصلي 480KB، والمتصفح بيوقف رسم الصفحة لحد ما يحمّله. Font Subsetting بأمر واحد بـ pyftsubset بياخد الأحرف اللي بتستخدمها فعلاً وبس، وبينزّل الحجم لـ 62KB. النتيجة: FCP بينزل من 2.8 ثانية لـ 0.9 ثانية على شبكة 4G حقيقية.
الخط العربي ليه تقيل بالظبط؟
افتح أي ملف .ttf لخط Cairo Regular واسأل نفسك سؤال بسيط: انت بتستخدم في موقعك كام حرف؟ غالباً 36 حرف عربي + 26 إنجليزي + 10 أرقام + علامات ترقيم. يعني حوالي 100 glyph. الملف فيه 2,400 glyph تشمل اللاتيني الكامل والسيريلي واليوناني والعلامات الصوتية النادرة والأرقام الهندية والعربية والأوروبية معاً.
المتصفح بيحمّل الملف كله. Cairo Regular بصيغة WOFF2 على Google Fonts حجمه 142KB. لو ضفت Bold و Light كمان، بقيت بتحمّل 480KB قبل ما النص يظهر، وأول رسم للصفحة بيتأخر لحد ما الـ font يوصل (الظاهرة دي اسمها FOIT — Flash of Invisible Text).
مثال للمبتدئ: مكتبة بالكامل لكتاب واحد
تخيّل إنك رحت تستعير كتاب عربي صغير من المكتبة، الموظف قالك "هنّاولك المكتبة كلها لأن الكتاب جاي معاها". انت محتاج 100 صفحة، بياخدوك مكتبة بـ 24,000 صفحة. ده اللي بيحصل بالظبط مع الخط — بتطلب 100 حرف، بياخدك 2,400.
Font Subsetting بيقول: "هات الحروف اللي محتاجها بس، وسيب الباقي". النتيجة ملف أصغر بكتير، نفس الجودة، نفس الشكل تماماً.
المفهوم العلمي: ايه هو Subsetting بالظبط؟
ملف الخط (TTF / OTF / WOFF2) فيه جدول glyphs — كل glyph رسمة لحرف. Subsetting هو إعادة بناء الملف بـ subset من الـ glyphs بدل الكل. الأداة الرسمية اسمها pyftsubset من مشروع fonttools اللي بتديره Google، وبتدعم اختيار الحروف بـ Unicode ranges أو نص مباشر من ملف.
القاعدة لاختيار النطاق العربي حسب Unicode 15:
U+0600 - U+06FF= Arabic basic block (الأحرف الأساسية).U+FB50 - U+FDFF= Arabic Presentation Forms-A (الأشكال المتصلة).U+FE70 - U+FEFF= Arabic Presentation Forms-B (التشكيل والـ ligatures).
الحل العملي: pyftsubset في 3 أوامر
التركيب أول مرة (Python 3.8+):
pip install fonttools brotliالأمر اللي بيعمل الشغل كله: