'Google Chrome 146' stable release, WebGPU significantly improved
2026-03-11 22:10:00 UTC
The latest stable version of the web browser Google Chrome , version 146, has been released. It includes several new features related to WebGPU . Chrome 146 | Release notes | Chrome for Developers https://developer.chrome.com/release-notes/146?hl=ja ◆ WebGPU: texture_and_sampler_let extension The texture_and_sampler_let language extension has been added to WGSL (WebGPU Shading Language) . By using texture_and_sampler_let, you can assign texture objects and sampler objects to variables declared with let in a WGSL shader. [code] @group(0) @binding(0) var tex: texture_2d ; @group(1) @binding(0) var store : texture_storage_2d ; @fragment fn main() { let a = tex; var res: vec4f = textureLoad(a, vec2i(1i), 0); textureStore(store, vec2i(0i), res); } [/code] ◆ WebGPU: Compatibility mode A limited subset of the WebGPU APIs is added as an opt-in mode that can run legacy graphics APIs such as OpenGL and Direct3D 11. By selecting this mode and following certain restrictions, WebGPU applications can run on many older devices that do not have the latest graphics APIs that WebGPU requires. [code] // Request a GPUAdapter in compatibility mode. const adapter = await navigator.gpu.requestAdapter({ featureLevel: 'compatibility' }); const device = await adapter.requestDevice(); [/code] ◆WebGPU: temporary attachment The newly supported TRANSIENT_ATTACHMENT GPUTextureUsage flag allows you to create memory-efficient attachments, which allow rendering pass operations to remain in tiled memory, avoiding VRAM traffic and VRAM allocation for textures. Declaring a texture as temporary (memoryless) tells the GPU that the texture's contents are only needed within the current rendering pass. Furthermore, since the texture's contents are discarded after the rendering pass, in some cases the driver does not need to allocate VRAM for the texture. [code] const adapter = await navigator.gpu.requestAdapter(); const device = await adapter.requestDevice(); if ('TRANSIENT_ATTACHMENT' in GPUTextureUsage) { const transientTexture = device.createTexture({ size: [42, 42], // The TRANSIENT_ATTACHMENT flag indicates that the texture contents are temporary, // Possibly held in fast on-chip memory. usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TRANSIENT_ATTACHMENT, format: 'rgba8unorm', }); } [/code] ◆Added keywords for the CSS text-indent property Two new keywords have been added to the text-indent property. each-line : Apply indentation to every line (except the next line if auto-wrapped) - hanging : applies indentation to all lines except the first line [code] text-indent: 5em each-line; text-indent: 5em hanging; text-indent: 5em hanging each-line; [/code] Sanitizer API This update adds the Sanitizer API , which aims to make it easier to build web applications that are free from the risk of cross-site scripting (XSS) , and can be used to remove content that may execute malicious scripts from HTML content. [code] const untrustedString = 'abc <script>alert(1)<' + '/script> def'; // Untrusted HTML (perhaps from user input) const someTargetElement = document.getElementById('target'); // someElement.innerHTML = untrustedString; someElement.setHTML(untrustedString); console.log(target.innerHTML); // abc def [/code] Scoped Custom Element Registry The scoped custom element registry feature allows multiple custom element definitions for the same tag name to exist on the same page, preventing custom element name conflicts in web apps that use multiple libraries. Previously, all custom element definitions for a web page existed in a single shared registry called window.customElements . Therefore, if two libraries used by a web page separately defined custom elements with the same tag name (e.g., <my-card>), an error would occur. This can be avoided by calling new CustomElementRegistry() to create an independent registry for each library, and managing custom elements with the same name in separate registries. [code] // Create a separate custom registry const registry = new CustomElementRegistry(); // Define custom elements in the created registry registry.define('my-card', class extends HTMLElement { connectedCallback() { this.textContent = 'Hello from scoped registry!'; } }); [/code] ◆Other updates - Scroll trigger: Allows you to control animation based on the scroll position CSS trigger-scope property: Restricts the trigger name of animations declared with the trigger-instantiating property. Navigation API : Improved to allow post-commit handlers to be registered while calling precommitHandler. Launch Handler API : Improved to ensure LaunchParams.targetURL is set when a PWA is launched via file handling.・Added Intl.Locale.prototype.variants Iterator ordering: An implementation of the TC39 proposal to create an iterator by sequencing existing iterators.・New meta tag: meta name='text-scale' -Retain the dropEffect value from the dragover event to the drop event - Retain MIME type parameters of Data URL Selective Permission Intervention: Prevent third-party scripts from using the permissions you grant a site to access powerful APIs.・WebAudio playback statistics API・LCP : Align the output specifications of the candidate with the behavior of other engines ◆Origin Trial・WebNN CPU Performance API Speculation rules : form_submission field Focusgroup: Move focus between a set of elements using the keyboard arrow keys Google Chrome 146 also includes numerous security bug fixes .
