In WebGL, web developers take advantage of UNMASKED_VENDOR_WEBGL and UNMASKED_RENDERER_WEBGL to respectively get the vendor and renderer string of the graphics driver so that they can optimize GPU-driven content and debug GPU problems. See replies to Dean Jackson’s tweet.

The detail of information varies between browsers:

• Safari only returns Apple Inc and Apple GPU since February 2020.
• Firefox buckets WebGL renderer strings on desktop since June 2021. See SanitizeRenderer.cpp file.
• Chrome returns full information for UNMASKED_VENDOR_WEBGL and UNMASKED_RENDERER_WEBGL.

WebGPU

In WebGPU, the GPU vendor and product names may be available to web developers through GPUAdapter.name depending on the browser implementation. The spec currently defines it as below:

A human-readable name identifying the adapter. The contents are implementation-defined.

I believe the spec should formally define the contents of GPUAdapter.name to help web developers who need GPU hardware information.

Proposal 1

GPUAdapter.name returns a string that helps identify the vendor and the product without giving the exact name of the GPU hardware (.e.g "Nvidia Kepler"). The specification would have to create and maintain a registry of known PCI IDs that map to hardcoded strings. The degree of granularity would be defined by the spec.

const adapter = await navigator.gpu.requestAdapter();
if (adapter.name == 'Nvidia Kepler') {
  // TODO: Optimize...
}

We may want to have two separate fields: GPUAdapter.vendor and GPUAdapter.architecture.

Proposal 2

A new method Promise<DOMString> GPUAdapter.requestDebugInformation() indicates to the browser that the website wants full and detailed GPU hardware information.

The browser may prompt the user there since the method is asynchronous.

const adapter = await navigator.gpu.requestAdapter();
const fullDebugInfo = await adapter.requestDebugInformation();
if (fullDebugInfo == 'Nvidia GK20A') {
  // TODO: Optimize...
}

GPUAdapter.name is removed from the spec.

Proposal 3 (Mix of proposals 1 and 2)

A new method Promise<DOMString> GPUAdapter.requestDebugInformation() indicates to the browser that the website wants GPU hardware information. The browser returns a string that helps identify the vendor and the product without giving the exact name of the GPU hardware (.e.g “Nvidia Kepler”). The specification would have to create and maintain a registry of known PCI IDs that map to hardcoded strings. The degree of granularity would be defined by the spec.

const adapter = await navigator.gpu.requestAdapter();
const sanitizedDebugInfo = await adapter.requestDebugInformation();
if (sanitizedDebugInfo == 'Nvidia Kepler') {
  // TODO: Optimize...
}

We may want to return a dictionary with two separate fields: vendor and architecture.

GPUAdapter.name is removed from the spec.

Thoughts? Ideas?

⬇️ Add them below.