From f8da47a2200a0a68bd3b915bc097c64a93fe36b8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fran=C3=A7ois=20Beaufort?= Date: Thu, 10 Jul 2025 11:43:29 +0200 Subject: [PATCH] Use texture shorthands instead of view when possible --- package-lock.json | 11 ++++----- package.json | 2 +- sample/a-buffer/main.ts | 16 +++++-------- sample/animometer/main.ts | 4 +--- sample/bitonicSort/main.ts | 5 ++--- sample/blending/main.ts | 10 ++++----- sample/cameras/main.ts | 8 +++---- sample/computeBoids/main.ts | 4 +--- sample/cornell/radiosity.ts | 2 +- sample/cornell/rasterizer.ts | 6 ++--- sample/cornell/raytracer.ts | 4 ++-- sample/cornell/tonemapper.ts | 4 ++-- sample/cubemap/main.ts | 6 ++--- sample/deferredRendering/main.ts | 30 ++++++++++++------------- sample/fractalCube/main.ts | 7 +++--- sample/gameOfLife/main.ts | 3 +-- sample/generateMipmap/main.ts | 2 +- sample/helloTriangle/main.ts | 4 ++-- sample/helloTriangleMSAA/main.ts | 5 ++--- sample/imageBlur/main.ts | 16 ++++++------- sample/instancedCube/main.ts | 6 ++--- sample/multipleCanvases/main.ts | 5 ++--- sample/normalMap/main.ts | 26 ++++++--------------- sample/occlusionQuery/main.ts | 4 ++-- sample/particles/main.ts | 6 ++--- sample/points/main.ts | 6 ++--- sample/renderBundles/main.ts | 8 +++---- sample/resizeCanvas/main.ts | 11 ++++----- sample/resizeObserverHDDPI/main.ts | 2 +- sample/reversedZ/main.ts | 12 +++++----- sample/rotatingCube/main.ts | 6 ++--- sample/samplerParameters/main.ts | 9 +++----- sample/shadowMapping/main.ts | 11 ++++----- sample/skinnedMesh/main.ts | 12 +++++----- sample/stencilMask/main.ts | 4 ++-- sample/textRenderingMsdf/main.ts | 6 ++--- sample/textRenderingMsdf/msdfText.ts | 2 +- sample/texturedCube/main.ts | 8 +++---- sample/timestampQuery/main.ts | 6 ++--- sample/transparentCanvas/main.ts | 6 ++--- sample/twoCubes/main.ts | 6 ++--- sample/videoUploading/main.ts | 3 +-- sample/volumeRenderingTexture3D/main.ts | 10 ++++----- sample/wireframe/main.ts | 4 ++-- sample/worker/worker.ts | 6 ++--- sample/workloadSimulator/index.html | 10 ++++----- 46 files changed, 140 insertions(+), 204 deletions(-) diff --git a/package-lock.json b/package-lock.json index b8d1ba12..7fa21a23 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,7 +31,7 @@ "@types/showdown": "^2.0.6", "@types/stats.js": "^0.17.4", "@typescript-eslint/eslint-plugin": "^7.18.0", - "@webgpu/types": "^0.1.61", + "@webgpu/types": "^0.1.64", "chokidar": "^4.0.3", "eslint": "^8.57.1", "eslint-config-prettier": "^8.10.0", @@ -1103,10 +1103,11 @@ "dev": true }, "node_modules/@webgpu/types": { - "version": "0.1.61", - "resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.61.tgz", - "integrity": "sha512-w2HbBvH+qO19SB5pJOJFKs533CdZqxl3fcGonqL321VHkW7W/iBo6H8bjDy6pr/+pbMwIu5dnuaAxH7NxBqUrQ==", - "dev": true + "version": "0.1.64", + "resolved": "https://registry.npmjs.org/@webgpu/types/-/types-0.1.64.tgz", + "integrity": "sha512-84kRIAGV46LJTlJZWxShiOrNL30A+9KokD7RB3dRCIqODFjodS5tCD5yyiZ8kIReGVZSDfA3XkkwyyOIF6K62A==", + "dev": true, + "license": "BSD-3-Clause" }, "node_modules/accepts": { "version": "1.3.8", diff --git a/package.json b/package.json index 15de58af..0b918390 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "@types/showdown": "^2.0.6", "@types/stats.js": "^0.17.4", "@typescript-eslint/eslint-plugin": "^7.18.0", - "@webgpu/types": "^0.1.61", + "@webgpu/types": "^0.1.64", "chokidar": "^4.0.3", "eslint": "^8.57.1", "eslint-config-prettier": "^8.10.0", diff --git a/sample/a-buffer/main.ts b/sample/a-buffer/main.ts index dffb5b3d..b3295bd6 100644 --- a/sample/a-buffer/main.ts +++ b/sample/a-buffer/main.ts @@ -365,10 +365,6 @@ const configure = () => { label: 'depthTexture', }); - const depthTextureView = depthTexture.createView({ - label: 'depthTextureView', - }); - // Determines how much memory is allocated to store linked-list elements const averageLayersPerFragment = 4; @@ -466,7 +462,7 @@ const configure = () => { }, { binding: 3, - resource: depthTextureView, + resource: depthTexture, }, { binding: 4, @@ -510,7 +506,7 @@ const configure = () => { ], }); - opaquePassDescriptor.depthStencilAttachment.view = depthTextureView; + opaquePassDescriptor.depthStencilAttachment.view = depthTexture; // Rotates the camera around the origin based on time. function getCameraViewProjMatrix() { @@ -552,10 +548,10 @@ const configure = () => { } const commandEncoder = device.createCommandEncoder(); - const textureView = context.getCurrentTexture().createView(); + const canvasTexture = context.getCurrentTexture(); // Draw the opaque objects - opaquePassDescriptor.colorAttachments[0].view = textureView; + opaquePassDescriptor.colorAttachments[0].view = canvasTexture; const opaquePassEncoder = commandEncoder.beginRenderPass(opaquePassDescriptor); opaquePassEncoder.setPipeline(opaquePipeline); @@ -577,7 +573,7 @@ const configure = () => { slice * sliceHeight; // Draw the translucent objects - translucentPassDescriptor.colorAttachments[0].view = textureView; + translucentPassDescriptor.colorAttachments[0].view = canvasTexture; const translucentPassEncoder = commandEncoder.beginRenderPass( translucentPassDescriptor ); @@ -600,7 +596,7 @@ const configure = () => { translucentPassEncoder.end(); // Composite the opaque and translucent objects - compositePassDescriptor.colorAttachments[0].view = textureView; + compositePassDescriptor.colorAttachments[0].view = canvasTexture; const compositePassEncoder = commandEncoder.beginRenderPass( compositePassDescriptor ); diff --git a/sample/animometer/main.ts b/sample/animometer/main.ts index 4d45b2a3..dc5f35d4 100644 --- a/sample/animometer/main.ts +++ b/sample/animometer/main.ts @@ -298,9 +298,7 @@ function configure() { uniformTime[0] = (timestamp - startTime) / 1000; device.queue.writeBuffer(uniformBuffer, timeOffset, uniformTime.buffer); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/bitonicSort/main.ts b/sample/bitonicSort/main.ts index 5373d548..3f02756e 100644 --- a/sample/bitonicSort/main.ts +++ b/sample/bitonicSort/main.ts @@ -717,9 +717,8 @@ SampleInitFactoryWebGPU( device.queue.writeBuffer(computeUniformsBuffer, 8, stepDetails); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = + context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); bitonicDisplayRenderer.startRun(commandEncoder, { diff --git a/sample/blending/main.ts b/sample/blending/main.ts index 59b41388..dd8c1424 100644 --- a/sample/blending/main.ts +++ b/sample/blending/main.ts @@ -193,7 +193,7 @@ const srcBindGroupUnpremultipliedAlpha = device.createBindGroup({ layout: bindGroupLayout, entries: [ { binding: 0, resource: sampler }, - { binding: 1, resource: srcTextureUnpremultipliedAlpha.createView() }, + { binding: 1, resource: srcTextureUnpremultipliedAlpha }, { binding: 2, resource: { buffer: srcUniform.buffer } }, ], }); @@ -202,7 +202,7 @@ const dstBindGroupUnpremultipliedAlpha = device.createBindGroup({ layout: bindGroupLayout, entries: [ { binding: 0, resource: sampler }, - { binding: 1, resource: dstTextureUnpremultipliedAlpha.createView() }, + { binding: 1, resource: dstTextureUnpremultipliedAlpha }, { binding: 2, resource: { buffer: dstUniform.buffer } }, ], }); @@ -211,7 +211,7 @@ const srcBindGroupPremultipliedAlpha = device.createBindGroup({ layout: bindGroupLayout, entries: [ { binding: 0, resource: sampler }, - { binding: 1, resource: srcTexturePremultipliedAlpha.createView() }, + { binding: 1, resource: srcTexturePremultipliedAlpha }, { binding: 2, resource: { buffer: srcUniform.buffer } }, ], }); @@ -220,7 +220,7 @@ const dstBindGroupPremultipliedAlpha = device.createBindGroup({ layout: bindGroupLayout, entries: [ { binding: 0, resource: sampler }, - { binding: 1, resource: dstTexturePremultipliedAlpha.createView() }, + { binding: 1, resource: dstTexturePremultipliedAlpha }, { binding: 2, resource: { buffer: dstUniform.buffer } }, ], }); @@ -518,7 +518,7 @@ function render() { const canvasTexture = context.getCurrentTexture(); // Get the current texture from the canvas context and // set it as the texture to render to. - renderPassDescriptor.colorAttachments[0].view = canvasTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = canvasTexture; // Apply the clearValue, pre-multiplying or not it based on the settings. { diff --git a/sample/cameras/main.ts b/sample/cameras/main.ts index dcd2fdef..4e629057 100644 --- a/sample/cameras/main.ts +++ b/sample/cameras/main.ts @@ -167,7 +167,7 @@ const uniformBindGroup = device.createBindGroup({ }, { binding: 2, - resource: cubeTexture.createView(), + resource: cubeTexture, }, ], }); @@ -183,7 +183,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -217,9 +217,7 @@ function frame() { modelViewProjection.byteOffset, modelViewProjection.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/computeBoids/main.ts b/sample/computeBoids/main.ts index 088f88d4..7a3f5ad8 100644 --- a/sample/computeBoids/main.ts +++ b/sample/computeBoids/main.ts @@ -259,9 +259,7 @@ let computePassDurationSum = 0; let renderPassDurationSum = 0; let timerSamples = 0; function frame() { - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); { diff --git a/sample/cornell/radiosity.ts b/sample/cornell/radiosity.ts index 9645443c..ae3eba3b 100644 --- a/sample/cornell/radiosity.ts +++ b/sample/cornell/radiosity.ts @@ -119,7 +119,7 @@ export default class Radiosity { { // lightmap binding: 1, - resource: this.lightmap.createView(), + resource: this.lightmap, }, { // radiosity_uniforms diff --git a/sample/cornell/rasterizer.ts b/sample/cornell/rasterizer.ts index 190141f4..71a141ea 100644 --- a/sample/cornell/rasterizer.ts +++ b/sample/cornell/rasterizer.ts @@ -35,14 +35,14 @@ export default class Rasterizer { label: 'RasterizerRenderer.renderPassDescriptor', colorAttachments: [ { - view: framebuffer.createView(), + view: framebuffer, clearValue: [0.1, 0.2, 0.3, 1], loadOp: 'clear', storeOp: 'store', }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', depthStoreOp: 'store', @@ -74,7 +74,7 @@ export default class Rasterizer { { // lightmap binding: 0, - resource: radiosity.lightmap.createView(), + resource: radiosity.lightmap, }, { // sampler diff --git a/sample/cornell/raytracer.ts b/sample/cornell/raytracer.ts index 98ca67bc..5b7beab0 100644 --- a/sample/cornell/raytracer.ts +++ b/sample/cornell/raytracer.ts @@ -57,7 +57,7 @@ export default class Raytracer { entries: [ { binding: 0, - resource: radiosity.lightmap.createView(), + resource: radiosity.lightmap, }, { binding: 1, @@ -71,7 +71,7 @@ export default class Raytracer { }, { binding: 2, - resource: framebuffer.createView(), + resource: framebuffer, }, ], }); diff --git a/sample/cornell/tonemapper.ts b/sample/cornell/tonemapper.ts index a7d26c6a..c3c4962c 100644 --- a/sample/cornell/tonemapper.ts +++ b/sample/cornell/tonemapper.ts @@ -51,12 +51,12 @@ export default class Tonemapper { { // input binding: 0, - resource: input.createView(), + resource: input, }, { // output binding: 1, - resource: output.createView(), + resource: output, }, ], }); diff --git a/sample/cubemap/main.ts b/sample/cubemap/main.ts index 06dc6613..1442bb86 100644 --- a/sample/cubemap/main.ts +++ b/sample/cubemap/main.ts @@ -186,7 +186,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -234,9 +234,7 @@ function frame() { modelViewProjectionMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/deferredRendering/main.ts b/sample/deferredRendering/main.ts index 86956dd0..f4905571 100644 --- a/sample/deferredRendering/main.ts +++ b/sample/deferredRendering/main.ts @@ -87,10 +87,10 @@ const depthTexture = device.createTexture({ usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING, }); -const gBufferTextureViews = [ - gBufferTexture2DFloat16.createView(), - gBufferTextureAlbedo.createView(), - depthTexture.createView(), +const gBufferTextures = [ + gBufferTexture2DFloat16, + gBufferTextureAlbedo, + depthTexture, ]; const vertexBuffers: Iterable = [ @@ -257,14 +257,14 @@ const deferredRenderPipeline = device.createRenderPipeline({ const writeGBufferPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view: gBufferTextureViews[0], + view: gBufferTextures[0], clearValue: [0.0, 0.0, 1.0, 1.0], loadOp: 'clear', storeOp: 'store', }, { - view: gBufferTextureViews[1], + view: gBufferTextures[1], clearValue: [0, 0, 0, 1], loadOp: 'clear', @@ -272,7 +272,7 @@ const writeGBufferPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -354,15 +354,15 @@ const gBufferTexturesBindGroup = device.createBindGroup({ entries: [ { binding: 0, - resource: gBufferTextureViews[0], + resource: gBufferTextures[0], }, { binding: 1, - resource: gBufferTextureViews[1], + resource: gBufferTextures[1], }, { binding: 2, - resource: gBufferTextureViews[2], + resource: gBufferTextures[2], }, ], }); @@ -551,9 +551,8 @@ function frame() { // Left: depth // Middle: normal // Right: albedo (use uv to mimic a checkerboard texture) - textureQuadPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + textureQuadPassDescriptor.colorAttachments[0].view = + context.getCurrentTexture(); const debugViewPass = commandEncoder.beginRenderPass( textureQuadPassDescriptor ); @@ -563,9 +562,8 @@ function frame() { debugViewPass.end(); } else { // Deferred rendering - textureQuadPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + textureQuadPassDescriptor.colorAttachments[0].view = + context.getCurrentTexture(); const deferredRenderingPass = commandEncoder.beginRenderPass( textureQuadPassDescriptor ); diff --git a/sample/fractalCube/main.ts b/sample/fractalCube/main.ts index c6f98e73..4e7f73ae 100644 --- a/sample/fractalCube/main.ts +++ b/sample/fractalCube/main.ts @@ -139,7 +139,7 @@ const uniformBindGroup = device.createBindGroup({ }, { binding: 2, - resource: cubeTexture.createView(), + resource: cubeTexture, }, ], }); @@ -155,7 +155,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -194,8 +194,7 @@ function frame() { ); const swapChainTexture = context.getCurrentTexture(); - // prettier-ignore - renderPassDescriptor.colorAttachments[0].view = swapChainTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = swapChainTexture; const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/gameOfLife/main.ts b/sample/gameOfLife/main.ts index 363485e4..88af9aa6 100644 --- a/sample/gameOfLife/main.ts +++ b/sample/gameOfLife/main.ts @@ -221,11 +221,10 @@ function resetGameData() { loopTimes = 0; render = () => { - const view = context.getCurrentTexture().createView(); const renderPass: GPURenderPassDescriptor = { colorAttachments: [ { - view, + view: context.getCurrentTexture(), loadOp: 'clear', storeOp: 'store', }, diff --git a/sample/generateMipmap/main.ts b/sample/generateMipmap/main.ts index a2c02b3c..4d0398cb 100644 --- a/sample/generateMipmap/main.ts +++ b/sample/generateMipmap/main.ts @@ -225,7 +225,7 @@ function render(time: number) { time *= 0.001; const canvasTexture = context.getCurrentTexture(); - renderPassDescriptor.colorAttachments[0].view = canvasTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = canvasTexture; const aspect = canvas.clientWidth / canvas.clientHeight; const projection = mat4.perspective((90 * Math.PI) / 180, aspect, 0.1, 20); diff --git a/sample/helloTriangle/main.ts b/sample/helloTriangle/main.ts index 81e75d80..8d5b9a47 100644 --- a/sample/helloTriangle/main.ts +++ b/sample/helloTriangle/main.ts @@ -45,12 +45,12 @@ const pipeline = device.createRenderPipeline({ function frame() { const commandEncoder = device.createCommandEncoder(); - const textureView = context.getCurrentTexture().createView(); + const canvasTexture = context.getCurrentTexture(); const renderPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view: textureView, + view: canvasTexture, clearValue: [0, 0, 0, 0], // Clear to transparent loadOp: 'clear', storeOp: 'store', diff --git a/sample/helloTriangleMSAA/main.ts b/sample/helloTriangleMSAA/main.ts index e8783292..2dfb4106 100644 --- a/sample/helloTriangleMSAA/main.ts +++ b/sample/helloTriangleMSAA/main.ts @@ -54,7 +54,6 @@ const texture = device.createTexture({ format: presentationFormat, usage: GPUTextureUsage.RENDER_ATTACHMENT, }); -const view = texture.createView(); function frame() { const commandEncoder = device.createCommandEncoder(); @@ -62,8 +61,8 @@ function frame() { const renderPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view, - resolveTarget: context.getCurrentTexture().createView(), + view: texture, + resolveTarget: context.getCurrentTexture(), clearValue: [0, 0, 0, 0], // Clear to transparent loadOp: 'clear', storeOp: 'discard', diff --git a/sample/imageBlur/main.ts b/sample/imageBlur/main.ts index dfb4c96c..fc39b6bf 100644 --- a/sample/imageBlur/main.ts +++ b/sample/imageBlur/main.ts @@ -144,11 +144,11 @@ const computeBindGroup0 = device.createBindGroup({ entries: [ { binding: 1, - resource: imageTexture.createView(), + resource: imageTexture, }, { binding: 2, - resource: textures[0].createView(), + resource: textures[0], }, { binding: 3, @@ -164,11 +164,11 @@ const computeBindGroup1 = device.createBindGroup({ entries: [ { binding: 1, - resource: textures[0].createView(), + resource: textures[0], }, { binding: 2, - resource: textures[1].createView(), + resource: textures[1], }, { binding: 3, @@ -184,11 +184,11 @@ const computeBindGroup2 = device.createBindGroup({ entries: [ { binding: 1, - resource: textures[1].createView(), + resource: textures[1], }, { binding: 2, - resource: textures[0].createView(), + resource: textures[0], }, { binding: 3, @@ -208,7 +208,7 @@ const showResultBindGroup = device.createBindGroup({ }, { binding: 1, - resource: textures[1].createView(), + resource: textures[1], }, ], }); @@ -271,7 +271,7 @@ function frame() { const passEncoder = commandEncoder.beginRenderPass({ colorAttachments: [ { - view: context.getCurrentTexture().createView(), + view: context.getCurrentTexture(), clearValue: [0, 0, 0, 1], loadOp: 'clear', storeOp: 'store', diff --git a/sample/instancedCube/main.ts b/sample/instancedCube/main.ts index ab51cf89..48b043f4 100644 --- a/sample/instancedCube/main.ts +++ b/sample/instancedCube/main.ts @@ -194,7 +194,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -213,9 +213,7 @@ function frame() { mvpMatricesData.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/multipleCanvases/main.ts b/sample/multipleCanvases/main.ts index 8e2ccec9..f4e469aa 100644 --- a/sample/multipleCanvases/main.ts +++ b/sample/multipleCanvases/main.ts @@ -305,7 +305,7 @@ function render(time: number) { // Get the current texture from the canvas context and // set it as the texture to render to. const canvasTexture = context.getCurrentTexture(); - renderPassDescriptor.colorAttachments[0].view = canvasTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = canvasTexture; renderPassDescriptor.colorAttachments[0].clearValue = clearValue; // If we don't have a depth texture OR if its size is different @@ -325,8 +325,7 @@ function render(time: number) { }); canvasInfo.depthTexture = depthTexture; } - renderPassDescriptor.depthStencilAttachment.view = - depthTexture.createView(); + renderPassDescriptor.depthStencilAttachment.view = depthTexture; const fov = (60 * Math.PI) / 180; const aspect = canvas.clientWidth / canvas.clientHeight; diff --git a/sample/normalMap/main.ts b/sample/normalMap/main.ts index 253ab69b..db32c09c 100644 --- a/sample/normalMap/main.ts +++ b/sample/normalMap/main.ts @@ -166,7 +166,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -206,23 +206,13 @@ const surfaceBGDescriptor = createBindGroupDescriptor( ], // Multiple bindgroups that accord to the layout defined above [ + [sampler, woodAlbedoTexture, spiralNormalTexture, spiralHeightTexture], + [sampler, woodAlbedoTexture, toyboxNormalTexture, toyboxHeightTexture], [ sampler, - woodAlbedoTexture.createView(), - spiralNormalTexture.createView(), - spiralHeightTexture.createView(), - ], - [ - sampler, - woodAlbedoTexture.createView(), - toyboxNormalTexture.createView(), - toyboxHeightTexture.createView(), - ], - [ - sampler, - brickwallAlbedoTexture.createView(), - brickwallNormalTexture.createView(), - brickwallHeightTexture.createView(), + brickwallAlbedoTexture, + brickwallNormalTexture, + brickwallHeightTexture, ], ], 'Surface', @@ -360,9 +350,7 @@ function frame() { mapInfoView.setFloat32(24, settings.depthLayers, true); device.queue.writeBuffer(mapInfoBuffer, 0, mapInfoArray); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/occlusionQuery/main.ts b/sample/occlusionQuery/main.ts index 95b19cda..49b112a1 100644 --- a/sample/occlusionQuery/main.ts +++ b/sample/occlusionQuery/main.ts @@ -274,8 +274,8 @@ function render(now: number) { } const colorTexture = context.getCurrentTexture(); - renderPassDescriptor.colorAttachments[0].view = colorTexture.createView(); - renderPassDescriptor.depthStencilAttachment.view = depthTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = colorTexture; + renderPassDescriptor.depthStencilAttachment.view = depthTexture; const encoder = device.createCommandEncoder(); const pass = encoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/particles/main.ts b/sample/particles/main.ts index 89a89bfd..29786571 100644 --- a/sample/particles/main.ts +++ b/sample/particles/main.ts @@ -158,7 +158,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -386,7 +386,7 @@ const computeBindGroup = device.createBindGroup({ }, { binding: 2, - resource: texture.createView(), + resource: texture, }, ], }); @@ -439,7 +439,7 @@ function frame() { ); const swapChainTexture = context.getCurrentTexture(); // prettier-ignore - renderPassDescriptor.colorAttachments[0].view = swapChainTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = swapChainTexture; const commandEncoder = device.createCommandEncoder(); { diff --git a/sample/points/main.ts b/sample/points/main.ts index fc48775b..86a1ff85 100644 --- a/sample/points/main.ts +++ b/sample/points/main.ts @@ -194,7 +194,7 @@ const bindGroup = device.createBindGroup({ entries: [ { binding: 0, resource: { buffer: uniformBuffer } }, { binding: 1, resource: sampler }, - { binding: 2, resource: texture.createView() }, + { binding: 2, resource: texture }, ], }); @@ -236,7 +236,7 @@ function render(time: number) { // Get the current texture from the canvas context and // set it as the texture to render to. const canvasTexture = context.getCurrentTexture(); - renderPassDescriptor.colorAttachments[0].view = canvasTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = canvasTexture; // If we don't have a depth texture OR if its size is different // from the canvasTexture when make a new depth texture @@ -254,7 +254,7 @@ function render(time: number) { usage: GPUTextureUsage.RENDER_ATTACHMENT, }); } - renderPassDescriptor.depthStencilAttachment.view = depthTexture.createView(); + renderPassDescriptor.depthStencilAttachment.view = depthTexture; const { size, fixedSize, textured } = settings; diff --git a/sample/renderBundles/main.ts b/sample/renderBundles/main.ts index 1232d994..8250e77e 100644 --- a/sample/renderBundles/main.ts +++ b/sample/renderBundles/main.ts @@ -228,7 +228,7 @@ function createSphereBindGroup( }, { binding: 2, - resource: texture.createView(), + resource: texture, }, ], }); @@ -285,7 +285,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -388,9 +388,7 @@ function frame() { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/resizeCanvas/main.ts b/sample/resizeCanvas/main.ts index 1d5dc674..55034305 100644 --- a/sample/resizeCanvas/main.ts +++ b/sample/resizeCanvas/main.ts @@ -50,7 +50,6 @@ const pipeline = device.createRenderPipeline({ }); let renderTarget: GPUTexture | undefined = undefined; -let renderTargetView: GPUTextureView; function frame() { const currentWidth = canvas.clientWidth * devicePixelRatio; @@ -62,7 +61,7 @@ function frame() { if ( (currentWidth !== canvas.width || currentHeight !== canvas.height || - !renderTargetView) && + !renderTarget) && currentWidth && currentHeight ) { @@ -83,18 +82,16 @@ function frame() { format: presentationFormat, usage: GPUTextureUsage.RENDER_ATTACHMENT, }); - - renderTargetView = renderTarget.createView(); } - if (renderTargetView) { + if (renderTarget) { const commandEncoder = device.createCommandEncoder(); const renderPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view: renderTargetView, - resolveTarget: context.getCurrentTexture().createView(), + view: renderTarget, + resolveTarget: context.getCurrentTexture(), clearValue: [0.2, 0.2, 0.2, 1.0], loadOp: 'clear', storeOp: 'store', diff --git a/sample/resizeObserverHDDPI/main.ts b/sample/resizeObserverHDDPI/main.ts index 65eef702..3adbcfee 100644 --- a/sample/resizeObserverHDDPI/main.ts +++ b/sample/resizeObserverHDDPI/main.ts @@ -118,7 +118,7 @@ function frame() { const renderPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view: context.getCurrentTexture().createView(), + view: context.getCurrentTexture(), clearValue: [0.2, 0.2, 0.2, 1.0], loadOp: 'clear', storeOp: 'store', diff --git a/sample/reversedZ/main.ts b/sample/reversedZ/main.ts index 14ec31ef..629981dd 100644 --- a/sample/reversedZ/main.ts +++ b/sample/reversedZ/main.ts @@ -330,19 +330,17 @@ const depthTexture = device.createTexture({ format: depthBufferFormat, usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING, }); -const depthTextureView = depthTexture.createView(); const defaultDepthTexture = device.createTexture({ size: [canvas.width, canvas.height], format: depthBufferFormat, usage: GPUTextureUsage.RENDER_ATTACHMENT, }); -const defaultDepthTextureView = defaultDepthTexture.createView(); const depthPrePassDescriptor: GPURenderPassDescriptor = { colorAttachments: [], depthStencilAttachment: { - view: depthTextureView, + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -366,7 +364,7 @@ const drawPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: defaultDepthTextureView, + view: defaultDepthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -384,7 +382,7 @@ const drawPassLoadDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: defaultDepthTextureView, + view: defaultDepthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -426,7 +424,7 @@ const depthTextureBindGroup = device.createBindGroup({ entries: [ { binding: 0, - resource: depthTextureView, + resource: depthTexture, }, ], }); @@ -557,7 +555,7 @@ function frame() { mvpMatricesData.byteLength ); - const attachment = context.getCurrentTexture().createView(); + const attachment = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); if (settings.mode === 'color') { for (const m of depthBufferModes) { diff --git a/sample/rotatingCube/main.ts b/sample/rotatingCube/main.ts index ccdf5685..886bb2c3 100644 --- a/sample/rotatingCube/main.ts +++ b/sample/rotatingCube/main.ts @@ -129,7 +129,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -166,9 +166,7 @@ function frame() { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/samplerParameters/main.ts b/sample/samplerParameters/main.ts index 984dc92e..1e62a259 100644 --- a/sample/samplerParameters/main.ts +++ b/sample/samplerParameters/main.ts @@ -202,7 +202,6 @@ const checkerboard = device.createTexture({ size: [kTextureBaseSize, kTextureBaseSize], mipLevelCount: 4, }); -const checkerboardView = checkerboard.createView(); const kColorForLevel = [ [255, 255, 255, 255], @@ -248,7 +247,7 @@ const showTexturePipeline = device.createRenderPipeline({ const showTextureBG = device.createBindGroup({ layout: showTexturePipeline.getBindGroupLayout(0), - entries: [{ binding: 0, resource: checkerboardView }], + entries: [{ binding: 0, resource: checkerboard }], }); // @@ -312,18 +311,16 @@ function frame() { { binding: 0, resource: { buffer: bufConfig } }, { binding: 1, resource: { buffer: bufMatrices } }, { binding: 2, resource: sampler }, - { binding: 3, resource: checkerboardView }, + { binding: 3, resource: checkerboard }, ], }); - const textureView = context.getCurrentTexture().createView(); - const commandEncoder = device.createCommandEncoder(); const renderPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view: textureView, + view: context.getCurrentTexture(), clearValue: [0.2, 0.2, 0.2, 1.0], loadOp: 'clear', storeOp: 'store', diff --git a/sample/shadowMapping/main.ts b/sample/shadowMapping/main.ts index dc5069db..b34895db 100644 --- a/sample/shadowMapping/main.ts +++ b/sample/shadowMapping/main.ts @@ -63,7 +63,6 @@ const shadowDepthTexture = device.createTexture({ usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING, format: 'depth32float', }); -const shadowDepthTextureView = shadowDepthTexture.createView(); // Create some common descriptors used for both the shadow pipeline // and the color rendering pipeline. @@ -203,7 +202,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -251,7 +250,7 @@ const sceneBindGroupForRender = device.createBindGroup({ }, { binding: 1, - resource: shadowDepthTextureView, + resource: shadowDepthTexture, }, { binding: 2, @@ -330,7 +329,7 @@ function getCameraViewProjMatrix() { const shadowPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [], depthStencilAttachment: { - view: shadowDepthTextureView, + view: shadowDepthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', depthStoreOp: 'store', @@ -347,9 +346,7 @@ function frame() { cameraViewProj.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); { diff --git a/sample/skinnedMesh/main.ts b/sample/skinnedMesh/main.ts index 62a6f379..ec6e91da 100644 --- a/sample/skinnedMesh/main.ts +++ b/sample/skinnedMesh/main.ts @@ -363,7 +363,7 @@ const gltfRenderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthLoadOp: 'clear', depthClearValue: 1.0, depthStoreOp: 'store', @@ -507,13 +507,11 @@ function frame() { } // Difference between these two render passes is just the presence of depthTexture - gltfRenderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + gltfRenderPassDescriptor.colorAttachments[0].view = + context.getCurrentTexture(); - skinnedGridRenderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + skinnedGridRenderPassDescriptor.colorAttachments[0].view = + context.getCurrentTexture(); // Update node matrixes for (const scene of whaleScene.scenes) { diff --git a/sample/stencilMask/main.ts b/sample/stencilMask/main.ts index 725dcfd9..0301c84f 100644 --- a/sample/stencilMask/main.ts +++ b/sample/stencilMask/main.ts @@ -461,8 +461,8 @@ function drawScene( ) { const { objectInfos } = scene; - renderPassDescriptor.colorAttachments[0].view = canvasTexture.createView(); - renderPassDescriptor.depthStencilAttachment.view = depthTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = canvasTexture; + renderPassDescriptor.depthStencilAttachment.view = depthTexture; const pass = encoder.beginRenderPass(renderPassDescriptor); pass.setPipeline(pipeline); diff --git a/sample/textRenderingMsdf/main.ts b/sample/textRenderingMsdf/main.ts index 7041c92e..bc66edb2 100644 --- a/sample/textRenderingMsdf/main.ts +++ b/sample/textRenderingMsdf/main.ts @@ -248,7 +248,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -314,9 +314,7 @@ function frame() { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/textRenderingMsdf/msdfText.ts b/sample/textRenderingMsdf/msdfText.ts index adcd3ebd..4d944f20 100644 --- a/sample/textRenderingMsdf/msdfText.ts +++ b/sample/textRenderingMsdf/msdfText.ts @@ -313,7 +313,7 @@ export class MsdfTextRenderer { { binding: 0, // TODO: Allow multi-page fonts - resource: pageTextures[0].createView(), + resource: pageTextures[0], }, { binding: 1, diff --git a/sample/texturedCube/main.ts b/sample/texturedCube/main.ts index cefbf80b..c5130d2e 100644 --- a/sample/texturedCube/main.ts +++ b/sample/texturedCube/main.ts @@ -148,7 +148,7 @@ const uniformBindGroup = device.createBindGroup({ }, { binding: 2, - resource: cubeTexture.createView(), + resource: cubeTexture, }, ], }); @@ -164,7 +164,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -201,9 +201,7 @@ function frame() { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/timestampQuery/main.ts b/sample/timestampQuery/main.ts index b35d853c..dd3da76e 100644 --- a/sample/timestampQuery/main.ts +++ b/sample/timestampQuery/main.ts @@ -162,7 +162,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -201,9 +201,7 @@ function frame() { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/transparentCanvas/main.ts b/sample/transparentCanvas/main.ts index d67d0f80..0f5f61d8 100644 --- a/sample/transparentCanvas/main.ts +++ b/sample/transparentCanvas/main.ts @@ -125,7 +125,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -162,9 +162,7 @@ function frame() { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/twoCubes/main.ts b/sample/twoCubes/main.ts index 6bd9bfe5..0f6c1266 100644 --- a/sample/twoCubes/main.ts +++ b/sample/twoCubes/main.ts @@ -148,7 +148,7 @@ const renderPassDescriptor: GPURenderPassDescriptor = { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -215,9 +215,7 @@ function frame() { modelViewProjectionMatrix2.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/videoUploading/main.ts b/sample/videoUploading/main.ts index 8e37fcad..c957dea6 100644 --- a/sample/videoUploading/main.ts +++ b/sample/videoUploading/main.ts @@ -91,12 +91,11 @@ function frame() { }); const commandEncoder = device.createCommandEncoder(); - const textureView = context.getCurrentTexture().createView(); const renderPassDescriptor: GPURenderPassDescriptor = { colorAttachments: [ { - view: textureView, + view: context.getCurrentTexture(), clearValue: [0, 0, 0, 1], loadOp: 'clear', storeOp: 'store', diff --git a/sample/volumeRenderingTexture3D/main.ts b/sample/volumeRenderingTexture3D/main.ts index a6e75d78..e09d59f1 100644 --- a/sample/volumeRenderingTexture3D/main.ts +++ b/sample/volumeRenderingTexture3D/main.ts @@ -121,7 +121,6 @@ const texture = device.createTexture({ format: presentationFormat, usage: GPUTextureUsage.RENDER_ATTACHMENT, }); -const view = texture.createView(); const uniformBufferSize = 4 * 16; // 4x4 matrix const uniformBuffer = device.createBuffer({ @@ -253,15 +252,14 @@ function frame() { const inverseModelViewProjection = getInverseModelViewProjectionMatrix(deltaTime); device.queue.writeBuffer(uniformBuffer, 0, inverseModelViewProjection); - renderPassDescriptor.colorAttachments[0].view = view; - renderPassDescriptor.colorAttachments[0].resolveTarget = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = texture; + renderPassDescriptor.colorAttachments[0].resolveTarget = + context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); if (volumeTexture) { - bindGroupDescriptor.entries[2].resource = volumeTexture.createView(); + bindGroupDescriptor.entries[2].resource = volumeTexture; const uniformBindGroup = device.createBindGroup(bindGroupDescriptor); passEncoder.setPipeline(pipeline); passEncoder.setBindGroup(0, uniformBindGroup); diff --git a/sample/wireframe/main.ts b/sample/wireframe/main.ts index 014f90eb..f8bec210 100644 --- a/sample/wireframe/main.ts +++ b/sample/wireframe/main.ts @@ -377,7 +377,7 @@ function render(ts: number) { // Get the current texture from the canvas context and // set it as the texture to render to. const canvasTexture = context.getCurrentTexture(); - renderPassDescriptor.colorAttachments[0].view = canvasTexture.createView(); + renderPassDescriptor.colorAttachments[0].view = canvasTexture; // If we don't have a depth texture OR if its size is different // from the canvasTexture when make a new depth texture @@ -395,7 +395,7 @@ function render(ts: number) { usage: GPUTextureUsage.RENDER_ATTACHMENT, }); } - renderPassDescriptor.depthStencilAttachment.view = depthTexture.createView(); + renderPassDescriptor.depthStencilAttachment.view = depthTexture; const fov = (60 * Math.PI) / 180; const aspect = canvas.clientWidth / canvas.clientHeight; diff --git a/sample/worker/worker.ts b/sample/worker/worker.ts index 0be8298a..0ef4ff65 100644 --- a/sample/worker/worker.ts +++ b/sample/worker/worker.ts @@ -147,7 +147,7 @@ async function init(canvas) { }, ], depthStencilAttachment: { - view: depthTexture.createView(), + view: depthTexture, depthClearValue: 1.0, depthLoadOp: 'clear', @@ -189,9 +189,7 @@ async function init(canvas) { transformationMatrix.byteOffset, transformationMatrix.byteLength ); - renderPassDescriptor.colorAttachments[0].view = context - .getCurrentTexture() - .createView(); + renderPassDescriptor.colorAttachments[0].view = context.getCurrentTexture(); const commandEncoder = device.createCommandEncoder(); const passEncoder = commandEncoder.beginRenderPass(renderPassDescriptor); diff --git a/sample/workloadSimulator/index.html b/sample/workloadSimulator/index.html index 7605fdf3..30f6bd90 100644 --- a/sample/workloadSimulator/index.html +++ b/sample/workloadSimulator/index.html @@ -712,7 +712,7 @@

Web graphics workload simulator

entries: [ { binding: 0, resource: { buffer: uniformBuffer } }, { binding: 1, resource: sampler }, - { binding: 2, resource: texture.createView() }, + { binding: 2, resource: texture }, ], }); } catch(e) { @@ -729,7 +729,7 @@

Web graphics workload simulator

return; } try { - const canvasView = canvasContext.getCurrentTexture().createView(); + const canvasTexture = canvasContext.getCurrentTexture(); device.queue.writeBuffer(uniformBuffer, 0, new Float32Array([position[0] / size * 2 - 1, 1 - position[1] * 2 / size])); let buffer = null; @@ -797,14 +797,14 @@

Web graphics workload simulator

// Record command buffer. const commandEncoder = device.createCommandEncoder(); - let renderAttachment = canvasView; + let renderAttachment = canvasTexture; if (multisampling.checked) { - renderAttachment = multisampleRenderAttachment.createView(); + renderAttachment = multisampleRenderAttachment; } const passEncoder = commandEncoder.beginRenderPass({ colorAttachments: [ { view: renderAttachment, - resolveTarget: multisampling.checked ? canvasView : undefined, + resolveTarget: multisampling.checked ? canvasTexture : undefined, loadOp: 'clear', clearValue: [1, 1, 1, 1], storeOp: multisampling.checked ? 'discard' : 'store',