Skip to content

Commit

Permalink
chore: Cleanup WebGL specific apis and features (#1962)
Browse files Browse the repository at this point in the history
  • Loading branch information
ibgreen committed Feb 24, 2024
1 parent 2c75364 commit 17b32bd
Show file tree
Hide file tree
Showing 26 changed files with 159 additions and 245 deletions.
18 changes: 5 additions & 13 deletions docs/api-reference/core/device-features.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -50,28 +50,20 @@ be queried on a per-texture basis

| `luma.gl Feature` | This<br /> Browser | Description |
| ------------------------------------------ | ------------------------------------------------- | -------------------------------------------- |
| **Platform** |
| `webgpu` | <F f="webgpu"/> | WebGPU device. |
| `webgl` | <F f="webgl"/> | WebGL2 device. |
| `glsl` | <F f="glsl"/> | GLSL shader language. |
| `wgsl` | <F f="wgsl"/> | WGSL shader language. |
| **Features** |
| `depth-clip-control` | <F f="depth-clip-control"/> | Disable depth clipping `unclippedDepth` |
| `indirect-first-instance` | <F f="indirect-first-instance"/> | Specify via GPU buffer |
| `timestamp-query` | <F f="timestamp-query"/> | |
| **WebGL-only Features** |
| `timer-query-webgl` | <F f="timer-query-webgl"/> | GPU timer support |
| `compilation-status-async-webgl` | <F f="compilation-status-async-webgl"/> | Non-blocking compile/link status |
| `compilation-status-async-webgl` | <F f="compilation-status-async-webgl"/> | Non-blocking compile/link status |
| `polygon-mode-webgl` | <F f="shader-clip-cull-distance-webgl"/> | Wireframe rendering parameters |
| `provoking-vertex-webgl` | <F f="provoking-vertex-webgl"/> | Primitive vertex used for flat shading |
| `polygon-mode-webgl` | <F f="shader-clip-cull-distance-webgl"/> | Wireframe rendering parameters |
| `shader-clip-cull-distance-webgl` | <F f="polygon-mode-webgl"/> | Enable `gl_ClipDistance[]/gl_CullDistance[]` |
| **WebGL-only Features** |
| `transform-feedback-webgl` | <F f="transform-feedback-webgl"/> | `TransformFeedback` support |
| `uniforms-webgl` | <F f="uniforms-webgl"/> | non-UBO uniforms support |
| `constant-attributes-webgl` | <F f="constant-attributes-webgl"/> | Constant attributes |
| **Shaders** |
| `shader-f16` | <F f="shader-f16"/> | WGSL supports `f16` |
| `shader-noperspective-interpolation-webgl` | <F f="shader-noperspective-interpolation-webgl"/> | GLSL `noperspective` interpolation qualifier |
| `shader-conservative-depth-webgl` | <F f="shader-conservative-depth-webgl"/> | GLSL enable early depth test optimizations |
| `shader-clip-cull-distance-webgl` | <F f="polygon-mode-webgl"/> | Enable `gl_ClipDistance[]/gl_CullDistance[]` |
| **Textures** |
| `depth24unorm-stencil8` | <F f="depth24unorm-stencil8"/> | `UNSIGNED_INT_24_8_WEBGL` |
| `depth32float-stencil8` | <F f="depth32float-stencil8"/> | WebGPU only |
Expand Down Expand Up @@ -103,7 +95,7 @@ if (device.features.has('timer-query-webgl')) {
...
}
// Alternatively - do the same query using raw WebGL extensions
if (webglDevice.gl.getExtension('EXT_disjoint_timer_query') || webglDevice.gl.getExtension('EXT_disjoint_timer_query_webgl2')) {
if (wwebglDevice.gl.getExtension('EXT_disjoint_timer_query_webgl2')) {
...
}
```
Expand Down
71 changes: 35 additions & 36 deletions docs/api-reference/core/parameters.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,42 +6,41 @@ luma.gl provides a unified API for working with GPU parameters.

All parameters listed in a single table

| Function | How to set | Description | Values | WebGL counterpart |
| ---------------------------- | ------------------------------ | --------------------------------------------------------------------- | --------------------------------- | -------------------------- |
| **Rasterization Parameters** |
| `cullMode` | `RenderPipeline` | Which face to cull | **`'none'`**, `'front'`, `'back'` |
| `frontFace` | `RenderPipeline` | Which triangle winding order is front | **`ccw`**, `cw` |
| `viewport` | `RenderPass.setParameters()` | Specifying viewport size |
| `scissor` | `RenderPass.setParameters()` | Specifying scissor rect size |
| **Depth Buffer Parameters** |
| `depthBias` | `RenderPipeline` | Small depth offset for polygons | `float` | `gl.polygonOffset` |
| `depthBiasSlopeScale` | `RenderPipeline` | Small depth factor for polygons | `float` | `gl.polygonOffset` |
| `depthBiasClamp` | `RenderPipeline` | Max depth offset for polygons | `float` | N/A |
| **Stencil Buffer** |
| `stencilReference` | `RenderPass.setParameters()` |
| `stencilReadMask` | `RenderPipeline` | Binary mask for reading stencil values | `number` (**`0xffffffff`**) |
| `stencilWriteMask` | `RenderPipeline` | Binary mask for writing stencil values | `number` (**`0xffffffff`**) | `gl.frontFace` |
| `stencilCompare` | `RenderPipeline` | How the mask is compared | **`always`**, `not-equal`, ... | `gl.stencilFunc` |
| `stencilPassOperation` | `RenderPipeline` | | **`'keep'`** | `gl.stencilOp` |
| `stencilDepthFailOperation` | `RenderPipeline` | | **`'keep'`** | `gl.stencilOp` |
| `stencilFailOperation` | `RenderPipeline` | | **`'keep'`** | `gl.stencilOp` |
| **Blending** |
| `blendConstant` | | Color used by blend factors `constant`, `one-minus-constant` |
| `blendColor` | `RenderPass.setParameters()` |
| `blendEquation` | `RenderPipeline(targets})` |
| `blendOperation` | `RenderPipeline(targets).` |
| `blendSrcFactor` | `RenderPipeline(targets).` |
| `blendDstFactor` | `RenderPipeline(targets).` |
| **Clear color** |
| `clearColor` | `RenderPass(colorAttachments)` |
| **Extension Parameters** |
| `unclippedDepth` | `RenderPipeline` | Disable depth value clipping . Requires `depth-clip-control` | `boolean` |
| `provokingVertex` | `RenderPipeline` | Vertex used for flat shading. Requires `provoking-vertex-webgl` | **`'last'`**, `'first'` | `WEBGL_provoking_vertex` |
| `polygonMode` | `RenderPipeline` | Enable wire frame rendering. Requires `polygon-mode-webgl` | **`'fill'`**, `'line'` | `WEBGL_polygon_mode` |
| `polygonOffsetLine` | `RenderPipeline` | Vertex used for flat shading. Requires `polygon-mode-webgl` | `boolean` | `WEBGL_polygon_mode` |
| `clipDistance0` (`0-7`) | `RenderPipeline` | Enable `gl_ClipDistance, gl_CullDistance`. `shader-clip-cull-distance-webgl` | `boolean` | `WEBGL_clip_cull_distance` |

## Other types of parameters
| Function | How to set | Description | Values | WebGL counterpart |
| --------------------------- | ------------------------------ | -------------------------------------------------------------------- | --------------------------------- | -------------------------- |
| **Rasterization** |
| `cullMode` | `RenderPipeline` | Which face to cull | **`'none'`**, `'front'`, `'back'` | `gl.cullFace()` |
| `frontFace` | `RenderPipeline` | Which triangle winding order is front | **`ccw`**, `cw` | `gl.frontFace()` |
| `viewport` | `RenderPass.setParameters()` | Specifying viewport size | | `gl.viewpot()` |
| `scissor` | `RenderPass.setParameters()` | Specifying scissor rect size | | `gl.scissor()` |
| `clearColor` | `RenderPass(colorAttachments)` | | | `gl.clearColor()` |
| **Blending** |
| `blendConstant` | | Color used by blend factors `constant`, `one-minus-constant` |
| `blendColor` | `RenderPass.setParameters()` |
| `blendEquation` | `RenderPipeline(targets})` |
| `blendOperation` | `RenderPipeline(targets).` |
| `blendSrcFactor` | `RenderPipeline(targets).` |
| `blendDstFactor` | `RenderPipeline(targets).` |
| **Depth Buffer** |
| `depthBias` | `RenderPipeline` | Small depth offset for polygons | `float` | `gl.polygonOffset` |
| `depthBiasSlopeScale` | `RenderPipeline` | Small depth factor for polygons | `float` | `gl.polygonOffset` |
| `depthBiasClamp` | `RenderPipeline` | Max depth offset for polygons | `float` | N/A |
| **Stencil Buffer** |
| `stencilReference` | `RenderPass.setParameters()` |
| `stencilReadMask` | `RenderPipeline` | Binary mask for reading stencil values | `number` (**`0xffffffff`**) |
| `stencilWriteMask` | `RenderPipeline` | Binary mask for writing stencil values | `number` (**`0xffffffff`**) | `gl.frontFace` |
| `stencilCompare` | `RenderPipeline` | How the mask is compared | **`always`**, `not-equal`, ... | `gl.stencilFunc` |
| `stencilPassOperation` | `RenderPipeline` | Operation on stencil buffer when test passes | **`'keep'`** | `gl.stencilOp` |
| `stencilDepthFailOperation` | `RenderPipeline` | Operation on stencil buffer when depth test fails | **`'keep'`** | `gl.stencilOp` |
| `stencilFailOperation` | `RenderPipeline` | Operation on stencil buffer when test fails | **`'keep'`** | `gl.stencilOp` |
| **Extensions** |
| `unclippedDepth` | `RenderPipeline` | `depth-clip-control`: Disable depth value clipping. | `boolean` | `WEBGL_depth_clamp` |
| `provokingVertex` | `RenderPipeline` | `provoking-vertex-webgl`: Vertex used for flat shading | **`'last'`**, `'first'` | `WEBGL_provoking_vertex` |
| `polygonMode` | `RenderPipeline` | `polygon-mode-webgl`: Enable wire frame rendering. | **`'fill'`**, `'line'` | `WEBGL_polygon_mode` |
| `polygonOffsetLine` | `RenderPipeline` | `polygon-mode-webgl`: Vertex used for flat shading. Requires | `boolean` | `WEBGL_polygon_mode` |
| `clipDistance0` (`0-7`) | `RenderPipeline` | `shader-clip-cull-distance-webgl`: `gl_ClipDistance/gl_CullDistance` | `boolean` | `WEBGL_clip_cull_distance` |

F## Other types of parameters

Note that there are certain types of parameters affecting GPU operation that are not handled by the main parameter system:

Expand Down
2 changes: 1 addition & 1 deletion examples/script/webgl/transform-feedback/app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ export default class AppAnimationLoopTemplate extends AnimationLoopTemplate {
constructor({device}: AnimationProps) {
super();

if (!device.features.has('transform-feedback-webgl')) {
if (device.info.type !== 'webgl') {
throw new Error(ALT_TEXT);
}

Expand Down
4 changes: 0 additions & 4 deletions modules/constants/src/webgl-types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -264,15 +264,11 @@ export type GLValueParameters = {
[GL.STENCIL_BACK_PASS_DEPTH_PASS]?: GLStencilOp;
[GL.VIEWPORT]?: [number, number, number, number] | NumberArray;

// WEBGL1 PIXEL PACK/UNPACK MODES
[GL.PACK_ALIGNMENT]?: number;
[GL.UNPACK_ALIGNMENT]?: number;
[GL.UNPACK_FLIP_Y_WEBGL]?: boolean;
[GL.UNPACK_PREMULTIPLY_ALPHA_WEBGL]?: boolean;
[GL.UNPACK_COLORSPACE_CONVERSION_WEBGL]?: GL.NONE | GL.BROWSER_DEFAULT_WEBGL;

// WEBGL2 PIXEL PACK/UNPACK MODES
// RASTERIZER_DISCARD ...
[GL.PACK_ROW_LENGTH]?: number;
[GL.PACK_SKIP_PIXELS]?: number;
[GL.PACK_SKIP_ROWS]?: number;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,16 +5,9 @@ import test from 'tape-promise/tape';
import {webglDevice} from '@luma.gl/test-utils';
import {DeviceFeature} from '@luma.gl/core';

// true: always supported in WebGL2, false: never supported in WebGL1
const WEBGL2_ALWAYS_FEATURES: DeviceFeature[] = [
'webgl',
'glsl',
// api support
'transform-feedback-webgl'
// features
];

const WEBGL2_NEVER_FEATURES: DeviceFeature[] = ['webgpu', 'wgsl'];
// TODO - we are not actually testing any features
const WEBGL2_ALWAYS_FEATURES: DeviceFeature[] = [];
const WEBGL2_NEVER_FEATURES: DeviceFeature[] = [];

test('WebGLDevice#features (unknown features)', t => {
// @ts-expect-error
Expand All @@ -25,17 +18,12 @@ test('WebGLDevice#features (unknown features)', t => {
});

test('WebGLDevice#hasFeatures (WebGL)', t => {
t.notOk(webglDevice.features.has('webgpu'), 'features.has should return false');
t.notOk(webglDevice.features.has('wgsl'), 'features.has should return false');
// t.notOk(webglDevice.features.has('float32-renderable-webgl'), 'features.has should return false');


for (const feature of WEBGL2_ALWAYS_FEATURES) {
t.equal(webglDevice.features.has(feature), true, `${feature} is always supported under WebGL2`);
t.equal(webglDevice.features.has(feature), true, `${feature} is always supported under WebGL`);
}

for (const feature of WEBGL2_NEVER_FEATURES) {
t.equal(webglDevice.features.has(feature), false, `${feature} is never supported under WebGL1`);
t.equal(webglDevice.features.has(feature), false, `${feature} is never supported under WebGL`);
}
t.end();
});
3 changes: 0 additions & 3 deletions modules/core-tests/test/adapter/resources/texture.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -151,9 +151,6 @@ test.skip('WebGL#Texture format creation with data', t => {
test.skip('WebGL#Texture WebGL2 format creation', t => {
for (const format in TEXTURE_FORMATS) {
if (!WEBGL1_FORMATS.indexOf(format)) {
}
}
let texture = webglDevice.createTexture({});
t.ok(texture instanceof Texture, 'Texture construction successful');
Expand Down
15 changes: 3 additions & 12 deletions modules/core/src/adapter/device.ts
Original file line number Diff line number Diff line change
Expand Up @@ -125,23 +125,18 @@ export type WebGPUDeviceFeature =
| 'texture-compression-etc2'
| 'texture-compression-astc';

// obsolete...
// Removed WebGPU features...
// 'depth-clamping' |
// 'pipeline-statistics-query' |

export type WebGLDeviceFeature =
// webgl standard features
| 'transform-feedback-webgl' // device.createTransformFeedback()
| 'constant-attributes-webgl' // vertexArray.setConstant()
| 'uniforms-webgl' // Supports non-UBO uniforms: renderPipeline.setUniforms()

// webgl extension features
| 'timer-query-webgl' // unify with WebGPU timestamp-query?
| 'compilation-status-async-webgl' // Non-blocking shader compile/link status query available
| 'provoking-vertex-webgl' // parameters.provokingVertex
| 'polygon-mode-webgl' // parameters.polygonMode and parameters.polygonOffsetLine

// GLSL extension features
// GLSL extension feGLatures
| 'shader-noperspective-interpolation-webgl' // Vertex outputs & fragment inputs can have a `noperspective` interpolation qualifier.
| 'shader-conservative-depth-webgl' // GLSL `gl_FragDepth` qualifiers `depth_unchanged` etc can enable early depth test
| 'shader-clip-cull-distance-webgl' // Makes gl_ClipDistance and gl_CullDistance available in shaders
Expand Down Expand Up @@ -173,11 +168,7 @@ type WebGLCompressedTextureFeatures =
export type DeviceFeature =
| WebGPUDeviceFeature
| WebGLDeviceFeature
| WebGLCompressedTextureFeatures
| 'webgl'
| 'glsl'
| 'webgpu'
| 'wgsl';
| WebGLCompressedTextureFeatures;

/**
* WebGPU Device/WebGL context abstraction
Expand Down
Loading

0 comments on commit 17b32bd

Please sign in to comment.