DeviceFeatures
The luma.gl Device
provides a device "feature" system that allows applications
to check whether specific advanced capabilities are present on the current browser or GPU.
Background
Both WebGL 2 and WebGPU provide extension mechanisms that allow implementations to expose additional capabilities that may not be supported on all browsers and GPUs. This allows new GPU features to be provided without waiting for new official versions of the WebGL or WebGPU standards to be approved and published.
Device.features
luma.gl provides a unified feature detection system across WebGPU, WebGL, WGLSL and GLSL.
Each device has a device.features
field that holds a DeviceFeatures
object with an API similar to Set<DeviceFeature>
.
Feature Name | This Browser | Description | WebGL counterpart |
---|---|---|---|
WebGPU Extensions | |||
depth-clip-control | N/A | Disable depth clipping via unclippedDepth | WEBGL_depth_texture |
indirect-first-instance | N/A | Specify instance index via GPU buffer | N/A |
timestamp-query | N/A | GPU timer query support | N/A |
WebGL Extensions | |||
timer-query-webgl | N/A | GPU timer support | EXT_disjoint_timer_query |
compilation-status-async-webgl | N/A | Non-blocking compile/link status | KHR_parallel_shader_compile |
polygon-mode-webgl | N/A | Wireframe rendering parameters (debug only) | WEBGL_polygon_mode |
provoking-vertex-webgl | N/A | Primitive vertex used for flat shading | WEBGL_provoking_vertex |
Shader Extensions | |||
shader-f16 | N/A | WGSL supports f16 | N/A |
shader-noperspective-interpolation-webgl | N/A | GLSL noperspective interpolation qualifier | NV_shader_noperspective_interpolation |
shader-conservative-depth-webgl | N/A | GLSL enable early depth test optimizations | EXT_conservative_depth |
shader-clip-cull-distance-webgl | N/A | GLSL gl_ClipDistance[]/gl_CullDistance[] | WEBGL_clip_cull_distance |
Texture Extensions | |||
depth32float-stencil8 | N/A | N/A | |
rg11b10ufloat-renderable | N/A | rg11b10ufloat textures renderable | N/A |
float32-renderable-webgl | N/A | float32 textures renderable | EXT_color_buffer_float |
float16-renderable-webgl | N/A | float16 textures renderable | EXT_color_buffer_half_float |
rgb9e5ufloat-renderable-webgl | N/A | rgb9e5ufloat renderable | 'WEBGL_render_shared_exponent' |
snorm8-renderable-webgl | N/A | r,rg,rgba8snorm renderable | EXT_render_snorm |
norm16-renderable-webgl | N/A | r,rg,rgba16norm renderable | [EXT_texture_norm16][EXT_texture_norm16] |
snorm16-renderable-webgl | N/A | r,rg,rgba16snorm renderable | [EXT_texture_norm16][EXT_texture_norm16], EXT_render_snorm |
float32-filterable | N/A | float32 textures are filterable | OES_texture_float_linear |
float16-filterable-webgl | N/A | float16 textures are filterable | OES_texture_half_float_linear |
texture-filterable-anisotropic-webgl | N/A | anisotropic filtering, common | EXT_texture_filter_anisotropic |
bgra8unorm-storage | N/A | can be used as storage binding. | |
texture-blend-float-webgl | N/A | float texture blending | EXT_float_blend |
Compressed Texture Support | |||
texture-compression-bc | N/A | DXT (BC1-BC7). Desktops. | |
texture-compression-bc5-webgl | N/A | DXT (BC1-BC5). Desktops. | |
texture-compression-etc2 | N/A | Performance caveats. | |
texture-compression-astc | N/A | ASTC. | |
texture-compression-etc1-webgl | N/A | Qualcomm Snapdragon. Android. | |
texture-compression-pvrtc-webgl | N/A | PowerVR GPUs, iOS devices. | |
texture-compression-atc-webgl | N/A | Qualcomm Adreno GPUs. Android. |
The table above uses the luma.gl Device.feature
field to check the capabilities of your current browser.
You can open this page in different browsers and on different machines to compare capabilities.
Remarks
- On WebGL, extensions will not be enabled until they have been queried.
- Given that queries to driver and GPU are typically expensive in WebGL, the Device will cache any queried extensions.
- A substantial set of features are devoted to texture capabilites, however these can also be queried on a per-texture basis.
- Both WebGL2 and WebGPU are continuously developing new extensions. The feature list will be updated as new extensions are added to the standards.
Usage
An example of feature detection
// Checks if `Query` objects can do async queries of GPU timings
if (device.features.has('timer-query-webgl')) {
...
}
// Alternatively - do the same query using raw WebGL extensions
if (webglDevice.gl.getExtension('EXT_disjoint_timer_query_webgl2')) {
...
}