التطبيق العملي لتنسيق KTX2: الطريقة المثلى لضغط الخامات ثلاثية الأبعاد
كيف تختار بين ETC1S و UASTC؟ وكيف تستخدم toktx و gltf-transform؟ وطريقة تحميل ملفات KTX2 في Three.js و Babylon.js بأكواد وأوامر جاهزة للاستخدام المباشر.
استعرضت المقالة السابقة العلاقة المعمارية بين تنسيقات خامات GPU وتقنية Basis Universal وحاوية KTX2. بعد فهم الأسس النظرية، يركز هذا المقال على الجانب التطبيقي المباشر: كيفية الاختيار بين ترميزي ETC1S و UASTC، وتحديد الأدوات المناسبة، وصياغة أوامر التحويل، وتحميل الخامات المضغوطة داخل محركات الويب.
يمكنك نسخ الأوامر البرمجية التالية وتطبيقها مباشرة في مشاريعك.
القرار الأكثر أهمية: المفاضلة بين ETC1S و UASTC
توفر مكتبة Basis Universal نمطين وسيطين للترميز، واختيار النمط الخاطئ لا يؤثر على الكفاءة فحسب، بل قد يشوه خرائط النواظم وتفاصيل المشهد:
| وجه المقارنة | ترميز ETC1S | ترميز UASTC |
|---|---|---|
| نسبة الضغط | فائقة الارتفاع (تشبه كفاءة JPEG) | متوسطة (تشبه ملفات PNG عالية الجودة) |
| الجودة البصرية | ممتازة لخرائط الألوان | مطابقة تقريباً للمصدر الأصلي |
| استهلاك الذاكرة (بعد فك التشفير) | حوالي 4 بت لكل بكسل (ثُمن الحجم الأصلي) | حوالي 8 بت لكل بكسل (ربع الحجم الأصلي) |
| سرعة الترميز | بطيئة نسبياً (قابلة للتعديل) | سريعة جداً |
| الاستخدام الأمثل | خرائط الألوان الأساسية والتوهج (Albedo/Emissive) | خرائط النواظم والخشونة والمعدنية والبيانات الحساسة |
| غير ملائم لـ | خرائط النواظم والبيانات عالية الدقة | خرائط الألوان العادية (حجم إضافي غير مبرر) |
لماذا لا تناسب خرائط النواظم ترميز ETC1S؟ لأن خرائط النواظم تخزن متجهات اتجاهية ثلاثية المحاور تكون مقيدة رياضياً (طول المتجه ≈ 1). صُمم ترميز ETC1S للضغط البصري للألوان التي تراها العين البشرية، مما يسبب انحرافاً في اتجاهات المتجهات وتشويهاً واضحاً في انعكاسات الإضاءة. في المقابل، يحافظ ترميز UASTC على القيم العددية بدقة عالية تناسب متطلبات الحسابات الفيزيائية.
القاعدة العملية السريعة:
- خرائط الألوان (Albedo و Emissive) تستخدم ترميز ETC1S.
- خرائط البيانات (Normal و Roughness و Metallic و AO) تستخدم ترميز UASTC.
- إذا كنت غير متأكد وتريد توفير المساحة: جرب ETC1S أولاً، وإذا لاحظت تشوشاً في التفاصيل القريبة فانتقل إلى UASTC.
مقارنة عملية لنفس الصورة بأربعة تنسيقات
باستخدام خامة ألوان بدقة 2048×2048 كمعيار أساسي:
| التنسيق | الحجم على القرص | استهلاك ذاكرة GPU (مع Mipmaps) | سرعة الرفع إلى GPU | التوافق الشامل |
|---|---|---|---|---|
| PNG | حوالي 5 ميغابايت | حوالي 22 ميغابايت | بطيئة | مدعوم |
| WebP | حوالي 1 ميغابايت | حوالي 22 ميغابايت | بطيئة | مدعوم |
| KTX2 (ETC1S) | حوالي 0.5 إلى 0.8 ميغابايت | حوالي 2.8 ميغابايت | سريعة جداً | مدعوم |
| KTX2 (UASTC) | حوالي 3 إلى 4 ميغابايت | حوالي 5.6 ميغابايت | سريعة جداً | مدعوم |
لاحظ أن استهلاك WebP لذاكرة GPU يماثل تماماً ملف PNG؛ فالضغط ينعكس على حجم التنزيل فقط، بينما يتم فك ضغط الصورة بالكامل إلى بكسلات خام فور دخولها ذاكرة الرسوميات. في المقابل، يجمع KTX2 بترميز ETC1S بين صغر حجم التنزيل والانخفاض الكبير في استهلاك الذاكرة.
حزمة الأدوات الموصى بها
1. أداة toktx الرسمية (التحكم الأقصى)
الأداة الرسمية المعتمدة من مجموعة Khronos، وتوفر أكبر قدر من المعاملات المتقدمة لمعالجة الخامات الفردية:
# تحويل PNG إلى KTX2 بترميز ETC1S
toktx --bcmp --uastc 0 albedo.ktx2 albedo.png
# تحويل PNG إلى KTX2 بترميز UASTC
toktx --uastc 1 normal.ktx2 normal.png
أهم المعاملات المفيدة:
# ضبط مستوى جودة ETC1S (من 1 إلى 255، الافتراضي 128)
toktx --bcmp --uastc 0 --qlevel 200 albedo.ktx2 albedo.png
# تطبيق الضغط الفائق Zstandard لتقليص حجم ملف UASTC
toktx --uastc 1 --zcmp 19 normal.ktx2 normal.png
# توليد مستويات Mipmaps تلقائياً (موصى به بشدة)
toktx --bcmp --genmipmap albedo.ktx2 albedo.png
# تحديد فضاء الألوان sRGB لخرائط الألوان
toktx --bcmp --srgb albedo.ktx2 albedo.png
2. أداة gltf-transform (الأسهل والأكثر شمولاً)
إذا كان لديك نموذج glTF أو GLB متكامل، فإن gltf-transform تمكنك من ضغط جميع خامات النموذج بأمر واحد مع تحديد الترميز المناسب تلقائياً:
# التثبيت عبر npm
npm install -g @gltf-transform/cli
# ضغط كامل خامات النموذج تلقائياً
gltf-transform optimize model.glb model-optimized.glb \
--texture-compress basisu
تقوم الأداة داخلياً بتوجيه خرائط الألوان نحو ETC1S وخرائط البيانات نحو UASTC وإضافة امتداد KHR_texture_basisu دون الحاجة لمعالجة كل صورة يدوياً.
3. الأدوات السحابية المباشرة
إذا كنت تفضل عدم تثبيت حزم محلية للتجارب السريعة، تتوفر أدوات عبر المتصفح مثل gltf.report لتنفيذ التحويل السريع وتنزيل الملفات الجاهزة.
تحميل واستخدام KTX2 في محرك Three.js
يدعم محرك Three.js تنسيق KTX2 بشكل مدمج: اربط كائن KTX2Loader بمحمل النماذج GLTFLoader مع تمرير مسار وحدة تحويل الترميز (Transcoder):
const ktx2Loader = new KTX2Loader()
.setTranscoderPath("/basis/")
.detectSupport(renderer);
gltfLoader.setKTX2Loader(ktx2Loader);
تعد الدالة detectSupport(renderer) إلزامية لتحديد التنسيق العتادي المدعوم على جهاز المستخدم في وقت التشغيل. وبالنسبة لخرائط الألوان، تأكد من ضبط الفضاء اللوني عبر texture.colorSpace = THREE.SRGBColorSpace.
تحميل واستخدام KTX2 في محرك Babylon.js
في محرك Babylon.js، يدعم محمل GLTFFileLoader امتداد KHR_texture_basisu بشكل تلقائي، ويقوم بجلب وحدات Transcoder اللازمة ذاتياً دون الحاجة لإعدادات معقدة.
ضبط معاملات الجودة والحجم
يتحكم المعامل --qlevel (من 1 إلى 255) في جودة ضغط ETC1S:
| قيمة qlevel | حجم الملف | الجودة البصرية | وقت المعالجة | سيناريو الاستخدام |
|---|---|---|---|---|
| 128 (افتراضي) | صغير | ممتازة لمعظم الاستخدامات | متوسط | التطبيقات العامة |
| 200 إلى 255 | أكبر قليلاً | فائقة ومطابقة للأصل | أطول | المشاهد عالية الجودة |
| 60 إلى 100 | فائق الصغر | تشوش ملحوظ في الكتل | سريع جداً | الخامات البعيدة والصغيرة |
خطوات الضبط المقترحة:
- ابدأ بالمعاملات الافتراضية وافحص الحجم والجودة.
- إذا أردت تحسين الجودة ارفع قيمة
--qlevelلـ ETC1S أو فعل--zcmpلـ UASTC. - إذا ظهرت خريطة النواظم مشوشة، تأكد من استخدام ترميز UASTC بدلاً من ETC1S.
- إذا بدت الألوان باهتة أو داكنة، راجع إعدادات الفضاء اللوني sRGB.
حل المشكلات التقنية الشائعة
فشل تحويل الترميز في المتصفح
- تأكد من صحة مسار ملفات wasm الخاصة بـ Transcoder داخل مجلد المشروع.
- تحقق من توافق إصدار المحرك مع إصدار مكتبة Basis المستخدمة.
الألوان تبدو داكنة أو ساطعة بشكل غير طبيعي
- خريطة الألوان لم تُعيّن على فضاء sRGB.
- نسيان إضافة معامل
--srgbعند استخدام أداة toktx لخرائط الألوان.
وميض وتشوش الخامات عند الابتعاد عنها
- عدم تضمين معامل
--genmipmapأثناء الضغط لتوليد مستويات Mipmaps.
حجم الملف الناتج أكبر من المتوقع
- الخامات متناهية الصغر (أقل من 128×128 بكسل) لا تستفيد من الضغط الكتلي بسبب تكلفة الترويسة الثابتة؛ اتركها بتنسيق PNG الأصلي.
الخطوة التالية
بعد إتقان أدوات ضغط الخامات، يتناول المقال التالي إطار المفاضلة الشامل: كيف تختار التوليفة المثالية بين ضغط الرؤوس وضغط الخامات لمختلف المنصات كالحواسيب والهواتف والواقع الافتراضي.