Vertex Shader: ما هو، المهام ومبدأ العمل

ما هو Vertex Shader؟

Vertex Shader هو مرحلة قابلة للبرمجة في خط أنابيب الرسومات تعالج كل رأس من نموذج ثلاثي الأبعاد بشكل فردي. الرأس (vertex) هو نقطة في الفضاء ثلاثي الأبعاد تحتوي على سمات: إحداثيات xyz، الاتجاهات (normals)، اللون وإحداثيات النسيج UV.

على عكس خط الأنابيب ذي الوظائف الثابتة (fixed-function pipeline) حيث كانت التحويلات تُنفذ وفق خوارزمية صلبة، يمنح Vertex Shader المطور تحكمًا كاملاً في تحويل الرؤوس. يتيح ذلك تنفيذ الرسوم المتحركة الإجرائية، تشويه النماذج، skinning الهيكلي وأي تحويلات رياضية على جانب GPU.

موقع Vertex Shader في خط أنابيب الرسومات

يشمل خط أنابيب الرسومات في OpenGL ES سلسلة من المراحل من بيانات الإدخال إلى الصورة النهائية. Vertex Shader يقع بعد مرحلة تجميع الرؤوس (vertex assembly) وقبل مرحلة التنقيط (rasterization). كل رأس يُرسل من CPU عبر مخزن الرؤوس يمر عبر Vertex Shader مرة واحدة بالضبط، وتُنقل النتيجة إلى المرحلة التالية لتجميع البدائيات.

كيف يعمل Vertex Shader؟

Vertex Shader يستقبل سمات الرؤوس من مخزن الرؤوس (VBO) عبر مؤشرات سمات الرؤوس (vertex attribute pointers) المكونة في كود CPU. يكتب المطور كود shader بلغة GLSL (OpenGL Shading Language) أو لغة مكافئة، والتي يترجمها برنامج تشغيل GPU إلى تعليمات آلية للرقاقة المحددة.

تدفق معالجة الرأس

لكل رأس، ينفذ Vertex Shader ثلاث عمليات بالتسلسل: قراءة سمات الإدخال — تطبيق التحويلات المحددة من قبل المطور — كتابة النتائج في متغيرات الإخراج. الحد الأدنى المطلوب للإخراج هو موضع الرأس في مساحة القص (clip space) (gl_Position). تُدرج جميع بيانات الإخراج الأخرى (اللون، الاتجاهات، إحداثيات النسيج) وتُنقل إلى المرحلة التالية — Fragment Shader.

#version 300 es
in vec3 aPosition;
in vec2 aTexCoord;
uniform mat4 uMVP;
out vec2 vTexCoord;

void main() {
    gl_Position = uMVP * vec4(aPosition, 1.0);
    vTexCoord = aTexCoord;
}

المهام الرئيسية لـ Vertex Shader

Vertex Shader يحل مجموعة واسعة من مهام خط أنابيب الرسومات المتعلقة بتحويل الهندسة. تُنفذ كل مهمة من خلال عمليات رياضية على المتجهات والمصفوفات، تُنفذ بالتوازي لآلاف الرؤوس في وقت واحد.

تحويل الإحداثيات عبر MVP

المهمة الأساسية والأكثر شيوعًا هي ضرب إحداثيات الرؤوس في مصفوفات model و view و projection (MVP). مصفوفة MVP تحول الرأس من مساحة النموذج المحلية إلى مساحة القص (clip space)، والتي تُطبع وتُحول إلى إحداثيات الشاشة في المراحل التلقائية لخط الأنابيب.

الرسوم المتحركة الهيكلية (Skinning)

للشخصيات المتحركة، ينفذ Vertex Shader الرسوم المتحركة الهيكلية (skinning). كل رأس مرتبط بعدة عظام بأوزان محددة. Vertex blending — مجموع موزون للتحويلات من العظام المرتبطة — يسمح بتشويه جلد الشخصية بسلاسة عند حركة الهيكل العظمي.

تشويه هندسي إجرائي

يستطيع Vertex Shader تعديل الهندسة بناءً على الوقت أو معاملات uniform أخرى دون مشاركة CPU. Wave deformation، إزاحة ضوضاء Perlin وتأثيرات تموج الماء — جميع هذه التأثيرات تُنفذ في shader الرؤوس دون إعادة تحميل الهندسة من RAM.

Vertex Shader مقابل Fragment Shader: الفروق

على الرغم من أن كلا النوعين من shaders هما مرحلتان قابلتان للبرمجة في خط أنابيب الرسومات، إلا أن Vertex Shader و Fragment Shader يحلان مهام مختلفة جوهريًا ويعملان في مراحل مختلفة من معالجة الصور.

الفرق الرئيسي هو تكرار الاستدعاء. يُستدعى Vertex Shader مرة واحدة لكل رأس، بينما يُستدعى Fragment Shader لكل جزء (بكسل). في مشهد عالي الدقة، يتجاوز عدد استدعاءات Fragment Shader عدد استدعاءات Vertex Shader بآلاف المرات، مما يجعل تحسين shaders البكسل أكثر أهمية.

أداء وتحسين Vertex Shader

أداء Vertex Shader مهم جدًا للتطبيقات في الوقت الفعلي، خاصة في تطوير التطبيقات المحمولة مع استهلاك محدود للطاقة. عوامل الأداء الرئيسية هي عدد الرؤوس، تعقيد كود shader وعرض النطاق الترددي لذاكرة GPU.

العوامل المؤثرة على الأداء

• عدد الرؤوس — عدد الرؤوس المرسلة إلى GPU لكل إطار. النماذج التي تحتوي على ملايين المضلعات تخلق حملاً عاليًا على shader الرؤوس.
• تعقيد shader — عدد التعليمات في shader. الحلقات المتداخلة والفروع الشرطية (divergence) تقلل الأداء المتوازي لوحدات SIMD.
• عرض النطاق الترددي — سرعة قراءة بيانات الرؤوس من ذاكرة الفيديو. تنسيق السمات (float32، float16، عدد صحيح مُطبع) يؤثر مباشرة على الإنتاجية.

طرق تحسين shaders الرؤوس

لتقليل الحمل على Vertex Shader، تُستخدم الأساليب التالية. Level of Detail (LOD) — التبديل إلى إصدارات مبسطة من النماذج عند ابتعاد الكاميرا عن الجسم. Instancing — رسم نفس الهندسة عدة مرات بمصفوفات تحويل مختلفة في استدعاء رسم واحد (draw call).

// Vertex Shader مع دعم instancing
in vec3 aPosition;
in mat4 aInstanceMatrix;
uniform mat4 uViewProjection;

void main() {
    vec4 worldPos = aInstanceMatrix * vec4(aPosition, 1.0);
    gl_Position = uViewProjection * worldPos;
}

أمثلة كود Vertex Shader

Vertex Shader في واجهات برمجة الرسومات المختلفة له منطق مماثل، لكن بناء جملة واتفاقيات تسمية مختلفة. لنلقِ نظرة على تنفيذ shader رؤوس أساسي في GLSL لـ OpenGL ES 3.0 وفي Metal Shading Language لـ iOS و macOS.

مثال في GLSL لـ OpenGL ES 3.0

#version 300 es
in vec4 position;
in vec3 normal;
in vec2 texcoord;

uniform mat4 modelViewMatrix;
uniform mat4 projectionMatrix;
uniform mat3 normalMatrix;

out vec3 vNormal;
out vec2 vTexCoord;
out vec3 vPosition;

void main() {
    vec4 mvPosition = modelViewMatrix * position;
    vPosition = mvPosition.xyz;
    vNormal = normalMatrix * normal;
    vTexCoord = texcoord;
    gl_Position = projectionMatrix * mvPosition;
}

مثال في Metal Shading Language

#include <metal_stdlib>
using namespace metal;

struct VertexIn {
    float3 position [[attribute(0)]];
    float3 normal   [[attribute(1)]];
};

struct VertexOut {
    float4 position [[position]];
    float3 worldNormal;
};

vertex VertexOut
vertexMain(VertexIn in [[stage_in]],
           constant float4x4& mvp [[buffer(1)]]) {
    VertexOut out;
    out.position = mvp * float4(in.position, 1.0);
    out.worldNormal = in.normal;
    return out;
}