Articulo de referencia

Lenguaje de sombreado WebGPU

El lenguaje de sombreado WebGPU ( WGSL , tipo de medio de Internet :) text/wgsl es un lenguaje de sombreado de alto nivel y el lenguaje de sombreado normativo para la API WebGPU...

El lenguaje de sombreado WebGPU ( WGSL , tipo de medio de Internet :) text/wgsles un lenguaje de sombreado de alto nivel y el lenguaje de sombreado normativo para la API WebGPU en la web. [ 1 ] [ 2 ] La sintaxis de WGSL está influenciada por Rust y está diseñada teniendo en cuenta una fuerte validación estática, una vinculación explícita de recursos y la portabilidad para una ejecución segura en navegadores. [ 1 ] En contextos web, las implementaciones de WebGPU aceptan el código fuente WGSL y realizan la compilación a formas intermedias específicas de la plataforma (por ejemplo, a SPIR-V, DXIL o MSL a través del agente de usuario), pero dichos backends no están expuestos al contenido web. [ 2 ] [ 3 ]

Historia y antecedentes

Históricamente, los gráficos en la web utilizaban WebGL , con sombreadores escritos en GLSL ES . A medida que las aplicaciones exigían características de GPU más modernas y un control más preciso sobre las canalizaciones de computación y gráficos, el Grupo Comunitario y el Grupo de Trabajo de GPU para la Web del W3C crearon WebGPU y su lenguaje de sombreado complementario, WGSL, para proporcionar un modelo seguro y portátil adecuado para la plataforma web. [ 4 ] [ 2 ] WGSL se desarrolló para ser legible para humanos, evitar el comportamiento indefinido común en los lenguajes de sombreado heredados y alinearse estrechamente con el modelo de recursos y validación de WebGPU. [ 1 ]

Objetivos de diseño

El diseño de WGSL hace hincapié en:

  • Seguridad y determinismo adecuados para las restricciones de seguridad web (validación estática extensa y semántica bien definida). [ 1 ]
  • Portabilidad entre diversos backends de GPU a través de un modelo de recursos abstracto compartido con WebGPU. [ 2 ]
  • Legibilidad y explicitud (sin preprocesador, conversiones implícitas mínimas, espacios de direcciones y enlaces explícitos). [ 1 ]
  • Alineación con las características modernas de las GPU (cálculo, búferes de almacenamiento, texturas, operaciones atómicas) manteniendo una sintaxis familiar similar a la de C/Rust. [ 1 ]

Descripción general del idioma

Tipos y valores

Los tipos escalares principales incluyen bool, i32, u32, y f32. Los vectores (por ejemplo, vec2, vec3, vec4) y las matrices (hasta 4×4) están disponibles para tipos de elementos de punto flotante. f16La precisión media opcional puede habilitarse mediante una función de WebGPU; la disponibilidad depende de la implementación. [ 1 ] [ 2 ] Los tipos atómicos ( atomic<i32>, atomic<u32>) admiten operaciones atómicas limitadas en espacios de direcciones calificados. [ 1 ]

Variables y espacios de direcciones

Las variables se declaran con let(inmutable), var(mutable) o const(constante en tiempo de compilación). Las clases de almacenamiento (espacios de direcciones) incluyen function, private, workgroup, uniform, y storagecon reado read_writeacceso según corresponda. [ 1 ] WGSL define reglas explícitas de diseño y alineación; atributos como @align, @size, y @stridecontrolan el diseño de datos para la interoperabilidad del búfer. [ 1 ]

Funciones y flujo de control

Las funciones utilizan parámetros y tipos de retorno explícitos. El flujo de control incluye construcciones if, switch, for, while, y , con / . La recursión no está permitida; los grafos de llamadas de punto de entrada deben ser acíclicos. [ 1 ]loopbreakcontinue

Puntos de entrada y atributos

Los sombreadores definen los puntos de entrada de la etapa con @vertex, @fragment, o @compute. Los atributos anotan enlaces e interfaces, incluyendo @group, @binding(enlace de recursos), @location(E/S definida por el usuario), @builtin(funciones integradas de la etapa como positiono global_invocation_id), @interpolate, y @workgroup_size. [ 1 ]

Recursos

WGSL expone búferes ( uniform, storage), texturas (variantes muestreadas, de almacenamiento y multimuestreadas) y muestreadores (filtrado/sin filtrado/comparación). El modelo de enlace es explícito a través de conjuntos de descriptores llamados grupos y enlaces, que coinciden con el modelo de diseño de canalización de WebGPU. [ 2 ] [ 1 ]

Compilación y validación

Los navegadores compilan WGSL a representaciones apropiadas para la plataforma y formatos de controlador nativos; el proceso de compilación específico no es observable por el contenido web. [ 2 ] El código fuente de WGSL se somete a un análisis sintáctico estricto y a una validación estática, y WebGPU aplica reglas de acceso a recursos robustas para evitar riesgos de memoria fuera de límites, lo que contribuye a un comportamiento predecible en todas las implementaciones. [ 2 ] [ 1 ]

Etapas de sombreado

WGSL admite tres etapas de canalización: vértice, fragmento y cómputo. [ 1 ]

sombreadores de vértices

Los sombreadores de vértices transforman las entradas por vértice y producen valores para la rasterización, incluyendo una posición en el espacio de recorte escrita en la positionfunción integrada. [ 1 ]

Ejemplo

/* Transforma las posiciones mediante una matriz MVP y transmite el color. */struct VertexInput { @location ( 0 ) position : vec3f , // vec3f es un alias para vec3<f32> @location ( 1 ) color : vec3f , };struct VertexOutput { @builtin ( position ) clip_position : vec4f , @location ( 0 ) color : vec3f , };@group ( 0 ) @binding ( 0 ) var < uniform > mvp : mat4x4f ;@vertex fn main ( v_in : VertexInput ) -> VertexOutput { var v_out : VertexOutput ; v_out . clip_position = mvp * vec4f ( v_in . position , 1.0 ); v_out . color = v_in . color ; return v_out ; }

sombreadores de fragmentos

Los sombreadores de fragmentos se ejecutan por fragmento y calculan las salidas de color (y opcionalmente de profundidad) que se escriben en los adjuntos de color. [ 1 ]

Ejemplo

/* Escribe un color interpolado con transparencia opaca. */@fragment fn main ( @location ( 0 ) color : vec3f ) -> @location ( 0 ) vec4f { return vec4f ( color , 1.0 ); }

Si se desea precisión media ( vec4h, abreviatura de ), el código debe ir precedido de una instrucción.vec4<f16>enablef16;

Shaders de cómputo

Los sombreadores de cómputo se ejecutan en grupos de trabajo y se utilizan para cálculos de GPU de propósito general. [ 1 ]

Ejemplo

/* Duplica los elementos de un búfer de entrada en un búfer de salida. */struct Params { element_count : u32 , };@group ( 0 ) @binding ( 0 ) var < storage , read > in_data : array < f32 > ; @group ( 0 ) @binding ( 1 ) var < storage , read_write > out_data : array < f32 > ; @group ( 0 ) @binding ( 2 ) var < uniform > params : Params ;@compute @workgroup_size ( 64 ) fn main ( @builtin ( global_invocation_id ) gid : vec3 < u32 > ) { let idx : u32 = gid . x ; if ( idx >= params . element_count ) { return ; } out_data [ idx ] = in_data [ idx ] * 2.0 ; }

Diferencias con GLSL y HLSL

En comparación con los lenguajes de sombreado heredados, WGSL:

  • Omite un preprocesador y requiere tipos y conversiones explícitas. [ 1 ]
  • Utiliza espacios de direcciones explícitos y anotaciones de enlace alineadas con el modelo de WebGPU. [ 2 ]
  • Aplica una validación estricta para evitar comportamientos indefinidos comunes en otros lenguajes de sombreado. [ 1 ]
  • Define un conjunto de características portátiles y centradas en la web; los tipos de 16 bits y otras características son opcionales y pueden depender de las capacidades del dispositivo. [ 2 ]

Véase también

Otros lenguajes de sombreado

Referencias

  1. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 "WebGPU Shading Language (WGSL)" . W3C . Consultado el 7 de agosto de 2025 .
  2. 1 2 3 4 5 6 7 8 9 10 "WebGPU" . W3C . Consultado el 7 de agosto de 2025 .
  3. "WGSL (WebGPU Shading Language)" . MDN Web Docs . Consultado el 7 de agosto de 2025 .
  4. "WebGPU Explainer" . Grupo comunitario de GPU para la web del W3C . Consultado el 7 de agosto de 2025 .
  • Especificación del lenguaje de sombreado WebGPU – Especificación oficial del W3C
  • Especificación WebGPU – Especificación de la API WebGPU
  • WGSL en la GPU para el repositorio web – Directorio de desarrollo de la especificación WGSL