mirror of
https://github.com/jiawanlong/Cesium-Examples.git
synced 2025-07-06 16:31:03 +00:00
845 lines
19 KiB
JavaScript
845 lines
19 KiB
JavaScript
/*// debugger tools
|
|
import 'https://greggman.github.io/webgpu-avoid-redundant-state-setting/webgpu-check-redundant-state-setting.js';
|
|
//*/
|
|
|
|
import { GPUFeatureName, GPUTextureFormat, GPULoadOp, GPUStoreOp, GPUIndexFormat, GPUTextureViewDimension } from './utils/WebGPUConstants.js';
|
|
|
|
import WGSLNodeBuilder from './nodes/WGSLNodeBuilder.js';
|
|
import Backend from '../common/Backend.js';
|
|
|
|
import { DepthTexture, DepthFormat, DepthStencilFormat, UnsignedInt248Type, UnsignedIntType, WebGPUCoordinateSystem } from 'three';
|
|
|
|
import WebGPUUtils from './utils/WebGPUUtils.js';
|
|
import WebGPUAttributeUtils from './utils/WebGPUAttributeUtils.js';
|
|
import WebGPUBindingUtils from './utils/WebGPUBindingUtils.js';
|
|
import WebGPUPipelineUtils from './utils/WebGPUPipelineUtils.js';
|
|
import WebGPUTextureUtils from './utils/WebGPUTextureUtils.js';
|
|
|
|
// statics
|
|
|
|
let _staticAdapter = null;
|
|
|
|
if ( navigator.gpu !== undefined ) {
|
|
|
|
_staticAdapter = await navigator.gpu.requestAdapter();
|
|
|
|
}
|
|
|
|
//
|
|
|
|
class WebGPUBackend extends Backend {
|
|
|
|
constructor( parameters = {} ) {
|
|
|
|
super( parameters );
|
|
|
|
// some parameters require default values other than "undefined"
|
|
|
|
this.parameters.antialias = ( parameters.antialias === true );
|
|
|
|
if ( this.parameters.antialias === true ) {
|
|
|
|
this.parameters.sampleCount = ( parameters.sampleCount === undefined ) ? 4 : parameters.sampleCount;
|
|
|
|
} else {
|
|
|
|
this.parameters.sampleCount = 1;
|
|
|
|
}
|
|
|
|
this.parameters.requiredLimits = ( parameters.requiredLimits === undefined ) ? {} : parameters.requiredLimits;
|
|
|
|
this.adapter = null;
|
|
this.device = null;
|
|
this.context = null;
|
|
this.colorBuffer = null;
|
|
|
|
this.defaultDepthTexture = new DepthTexture();
|
|
this.defaultDepthTexture.name = 'depthBuffer';
|
|
|
|
this.utils = new WebGPUUtils( this );
|
|
this.attributeUtils = new WebGPUAttributeUtils( this );
|
|
this.bindingUtils = new WebGPUBindingUtils( this );
|
|
this.pipelineUtils = new WebGPUPipelineUtils( this );
|
|
this.textureUtils = new WebGPUTextureUtils( this );
|
|
|
|
}
|
|
|
|
async init( renderer ) {
|
|
|
|
await super.init( renderer );
|
|
|
|
//
|
|
|
|
const parameters = this.parameters;
|
|
|
|
const adapterOptions = {
|
|
powerPreference: parameters.powerPreference
|
|
};
|
|
|
|
const adapter = await navigator.gpu.requestAdapter( adapterOptions );
|
|
|
|
if ( adapter === null ) {
|
|
|
|
throw new Error( 'WebGPUBackend: Unable to create WebGPU adapter.' );
|
|
|
|
}
|
|
|
|
// feature support
|
|
|
|
const features = Object.values( GPUFeatureName );
|
|
|
|
const supportedFeatures = [];
|
|
|
|
for ( const name of features ) {
|
|
|
|
if ( adapter.features.has( name ) ) {
|
|
|
|
supportedFeatures.push( name );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
const deviceDescriptor = {
|
|
requiredFeatures: supportedFeatures,
|
|
requiredLimits: parameters.requiredLimits
|
|
};
|
|
|
|
const device = await adapter.requestDevice( deviceDescriptor );
|
|
|
|
const context = ( parameters.context !== undefined ) ? parameters.context : renderer.domElement.getContext( 'webgpu' );
|
|
|
|
this.adapter = adapter;
|
|
this.device = device;
|
|
this.context = context;
|
|
|
|
this.updateSize();
|
|
|
|
}
|
|
|
|
get coordinateSystem() {
|
|
|
|
return WebGPUCoordinateSystem;
|
|
|
|
}
|
|
|
|
async getArrayBufferAsync( attribute ) {
|
|
|
|
return await this.attributeUtils.getArrayBufferAsync( attribute );
|
|
|
|
}
|
|
|
|
beginRender( renderContext ) {
|
|
|
|
const renderContextData = this.get( renderContext );
|
|
|
|
const device = this.device;
|
|
|
|
const descriptor = {
|
|
colorAttachments: [ {
|
|
view: null
|
|
} ],
|
|
depthStencilAttachment: {
|
|
view: null
|
|
}
|
|
};
|
|
|
|
const colorAttachment = descriptor.colorAttachments[ 0 ];
|
|
const depthStencilAttachment = descriptor.depthStencilAttachment;
|
|
|
|
const antialias = this.parameters.antialias;
|
|
|
|
if ( renderContext.texture !== null ) {
|
|
|
|
const textureData = this.get( renderContext.texture );
|
|
const depthTextureData = this.get( renderContext.depthTexture );
|
|
|
|
const view = textureData.texture.createView( {
|
|
baseMipLevel: 0,
|
|
mipLevelCount: 1,
|
|
baseArrayLayer: renderContext.activeCubeFace,
|
|
dimension: GPUTextureViewDimension.TwoD
|
|
} );
|
|
|
|
if ( textureData.msaaTexture !== undefined ) {
|
|
|
|
colorAttachment.view = textureData.msaaTexture.createView();
|
|
colorAttachment.resolveTarget = view;
|
|
|
|
} else {
|
|
|
|
colorAttachment.view = view;
|
|
colorAttachment.resolveTarget = undefined;
|
|
|
|
}
|
|
|
|
depthStencilAttachment.view = depthTextureData.texture.createView();
|
|
|
|
if ( renderContext.stencil && renderContext.depthTexture.format === DepthFormat ) {
|
|
|
|
renderContext.stencil = false;
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
if ( antialias === true ) {
|
|
|
|
colorAttachment.view = this.colorBuffer.createView();
|
|
colorAttachment.resolveTarget = this.context.getCurrentTexture().createView();
|
|
|
|
} else {
|
|
|
|
colorAttachment.view = this.context.getCurrentTexture().createView();
|
|
colorAttachment.resolveTarget = undefined;
|
|
|
|
}
|
|
|
|
depthStencilAttachment.view = this._getDepthBufferGPU( renderContext ).createView();
|
|
|
|
}
|
|
|
|
if ( renderContext.clearColor ) {
|
|
|
|
colorAttachment.clearValue = renderContext.clearColorValue;
|
|
colorAttachment.loadOp = GPULoadOp.Clear;
|
|
colorAttachment.storeOp = GPUStoreOp.Store;
|
|
|
|
} else {
|
|
|
|
colorAttachment.loadOp = GPULoadOp.Load;
|
|
colorAttachment.storeOp = GPUStoreOp.Store;
|
|
|
|
}
|
|
|
|
//
|
|
|
|
if ( renderContext.depth ) {
|
|
|
|
if ( renderContext.clearDepth ) {
|
|
|
|
depthStencilAttachment.depthClearValue = renderContext.clearDepthValue;
|
|
depthStencilAttachment.depthLoadOp = GPULoadOp.Clear;
|
|
depthStencilAttachment.depthStoreOp = GPUStoreOp.Store;
|
|
|
|
} else {
|
|
|
|
depthStencilAttachment.depthLoadOp = GPULoadOp.Load;
|
|
depthStencilAttachment.depthStoreOp = GPUStoreOp.Store;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if ( renderContext.stencil ) {
|
|
|
|
if ( renderContext.clearStencil ) {
|
|
|
|
depthStencilAttachment.stencilClearValue = renderContext.clearStencilValue;
|
|
depthStencilAttachment.stencilLoadOp = GPULoadOp.Clear;
|
|
depthStencilAttachment.stencilStoreOp = GPUStoreOp.Store;
|
|
|
|
} else {
|
|
|
|
depthStencilAttachment.stencilLoadOp = GPULoadOp.Load;
|
|
depthStencilAttachment.stencilStoreOp = GPUStoreOp.Store;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
//
|
|
|
|
const encoder = device.createCommandEncoder( { label: 'renderContext_' + renderContext.id } );
|
|
const currentPass = encoder.beginRenderPass( descriptor );
|
|
|
|
//
|
|
|
|
renderContextData.descriptor = descriptor;
|
|
renderContextData.encoder = encoder;
|
|
renderContextData.currentPass = currentPass;
|
|
renderContextData.currentAttributesSet = {};
|
|
|
|
//
|
|
|
|
if ( renderContext.viewport ) {
|
|
|
|
this.updateViewport( renderContext );
|
|
|
|
}
|
|
|
|
if ( renderContext.scissor ) {
|
|
|
|
const { x, y, width, height } = renderContext.scissorValue;
|
|
|
|
currentPass.setScissorRect( x, y, width, height );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
finishRender( renderContext ) {
|
|
|
|
const renderContextData = this.get( renderContext );
|
|
|
|
renderContextData.currentPass.end();
|
|
|
|
this.device.queue.submit( [ renderContextData.encoder.finish() ] );
|
|
|
|
//
|
|
|
|
if ( renderContext.texture !== null && renderContext.texture.generateMipmaps === true ) {
|
|
|
|
this.textureUtils.generateMipmaps( renderContext.texture );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
updateViewport( renderContext ) {
|
|
|
|
const { currentPass } = this.get( renderContext );
|
|
const { x, y, width, height, minDepth, maxDepth } = renderContext.viewportValue;
|
|
|
|
currentPass.setViewport( x, y, width, height, minDepth, maxDepth );
|
|
|
|
}
|
|
|
|
clear( renderContext, color, depth, stencil ) {
|
|
|
|
const device = this.device;
|
|
const renderContextData = this.get( renderContext );
|
|
|
|
const { descriptor } = renderContextData;
|
|
|
|
depth = depth && renderContext.depth;
|
|
stencil = stencil && renderContext.stencil;
|
|
|
|
const colorAttachment = descriptor.colorAttachments[ 0 ];
|
|
|
|
const antialias = this.parameters.antialias;
|
|
|
|
// @TODO: Include render target in clear operation.
|
|
if ( antialias === true ) {
|
|
|
|
colorAttachment.view = this.colorBuffer.createView();
|
|
colorAttachment.resolveTarget = this.context.getCurrentTexture().createView();
|
|
|
|
} else {
|
|
|
|
colorAttachment.view = this.context.getCurrentTexture().createView();
|
|
colorAttachment.resolveTarget = undefined;
|
|
|
|
}
|
|
|
|
descriptor.depthStencilAttachment.view = this._getDepthBufferGPU( renderContext ).createView();
|
|
|
|
if ( color ) {
|
|
|
|
colorAttachment.loadOp = GPULoadOp.Clear;
|
|
colorAttachment.clearValue = renderContext.clearColorValue;
|
|
|
|
}
|
|
|
|
if ( depth ) {
|
|
|
|
descriptor.depthStencilAttachment.depthLoadOp = GPULoadOp.Clear;
|
|
descriptor.depthStencilAttachment.depthClearValue = renderContext.clearDepthValue;
|
|
|
|
}
|
|
|
|
if ( stencil ) {
|
|
|
|
descriptor.depthStencilAttachment.stencilLoadOp = GPULoadOp.Clear;
|
|
descriptor.depthStencilAttachment.stencilClearValue = renderContext.clearStencilValue;
|
|
|
|
}
|
|
|
|
renderContextData.encoder = device.createCommandEncoder( {} );
|
|
renderContextData.currentPass = renderContextData.encoder.beginRenderPass( descriptor );
|
|
|
|
renderContextData.currentPass.end();
|
|
|
|
device.queue.submit( [ renderContextData.encoder.finish() ] );
|
|
|
|
}
|
|
|
|
// compute
|
|
|
|
beginCompute( computeGroup ) {
|
|
|
|
const groupGPU = this.get( computeGroup );
|
|
|
|
groupGPU.cmdEncoderGPU = this.device.createCommandEncoder( {} );
|
|
groupGPU.passEncoderGPU = groupGPU.cmdEncoderGPU.beginComputePass();
|
|
|
|
}
|
|
|
|
compute( computeGroup, computeNode, bindings, pipeline ) {
|
|
|
|
const { passEncoderGPU } = this.get( computeGroup );
|
|
|
|
// pipeline
|
|
|
|
const pipelineGPU = this.get( pipeline ).pipeline;
|
|
passEncoderGPU.setPipeline( pipelineGPU );
|
|
|
|
// bind group
|
|
|
|
const bindGroupGPU = this.get( bindings ).group;
|
|
passEncoderGPU.setBindGroup( 0, bindGroupGPU );
|
|
|
|
passEncoderGPU.dispatchWorkgroups( computeNode.dispatchCount );
|
|
|
|
}
|
|
|
|
finishCompute( computeGroup ) {
|
|
|
|
const groupData = this.get( computeGroup );
|
|
|
|
groupData.passEncoderGPU.end();
|
|
this.device.queue.submit( [ groupData.cmdEncoderGPU.finish() ] );
|
|
|
|
}
|
|
|
|
// render object
|
|
|
|
draw( renderObject, info ) {
|
|
|
|
const { object, geometry, context, pipeline } = renderObject;
|
|
|
|
const bindingsData = this.get( renderObject.getBindings() );
|
|
const contextData = this.get( context );
|
|
const pipelineGPU = this.get( pipeline ).pipeline;
|
|
const attributesSet = contextData.currentAttributesSet;
|
|
|
|
// pipeline
|
|
|
|
const passEncoderGPU = contextData.currentPass;
|
|
passEncoderGPU.setPipeline( pipelineGPU );
|
|
|
|
// bind group
|
|
|
|
const bindGroupGPU = bindingsData.group;
|
|
passEncoderGPU.setBindGroup( 0, bindGroupGPU );
|
|
|
|
// attributes
|
|
|
|
const index = renderObject.getIndex();
|
|
|
|
const hasIndex = ( index !== null );
|
|
|
|
// index
|
|
|
|
if ( hasIndex === true ) {
|
|
|
|
if ( attributesSet.index !== index ) {
|
|
|
|
const buffer = this.get( index ).buffer;
|
|
const indexFormat = ( index.array instanceof Uint16Array ) ? GPUIndexFormat.Uint16 : GPUIndexFormat.Uint32;
|
|
|
|
passEncoderGPU.setIndexBuffer( buffer, indexFormat );
|
|
|
|
attributesSet.index = index;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// vertex buffers
|
|
|
|
const vertexBuffers = renderObject.getVertexBuffers();
|
|
|
|
for ( let i = 0, l = vertexBuffers.length; i < l; i ++ ) {
|
|
|
|
const vertexBuffer = vertexBuffers[ i ];
|
|
|
|
if ( attributesSet[ i ] !== vertexBuffer ) {
|
|
|
|
const buffer = this.get( vertexBuffer ).buffer;
|
|
passEncoderGPU.setVertexBuffer( i, buffer );
|
|
|
|
attributesSet[ i ] = vertexBuffer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// draw
|
|
|
|
const drawRange = geometry.drawRange;
|
|
const firstVertex = drawRange.start;
|
|
|
|
const instanceCount = this.getInstanceCount( renderObject );
|
|
|
|
if ( hasIndex === true ) {
|
|
|
|
const indexCount = ( drawRange.count !== Infinity ) ? drawRange.count : index.count;
|
|
|
|
passEncoderGPU.drawIndexed( indexCount, instanceCount, firstVertex, 0, 0 );
|
|
|
|
info.update( object, indexCount, instanceCount );
|
|
|
|
} else {
|
|
|
|
const positionAttribute = geometry.attributes.position;
|
|
const vertexCount = ( drawRange.count !== Infinity ) ? drawRange.count : positionAttribute.count;
|
|
|
|
passEncoderGPU.draw( vertexCount, instanceCount, firstVertex, 0 );
|
|
|
|
info.update( object, vertexCount, instanceCount );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// cache key
|
|
|
|
needsUpdate( renderObject ) {
|
|
|
|
const renderObjectGPU = this.get( renderObject );
|
|
|
|
const { object, material } = renderObject;
|
|
|
|
const utils = this.utils;
|
|
|
|
const sampleCount = utils.getSampleCount( renderObject.context );
|
|
const colorSpace = utils.getCurrentColorSpace( renderObject.context );
|
|
const colorFormat = utils.getCurrentColorFormat( renderObject.context );
|
|
const depthStencilFormat = utils.getCurrentDepthStencilFormat( renderObject.context );
|
|
const primitiveTopology = utils.getPrimitiveTopology( object, material );
|
|
|
|
let needsUpdate = false;
|
|
|
|
if ( renderObjectGPU.sampleCount !== sampleCount || renderObjectGPU.colorSpace !== colorSpace ||
|
|
renderObjectGPU.colorFormat !== colorFormat || renderObjectGPU.depthStencilFormat !== depthStencilFormat ||
|
|
renderObjectGPU.primitiveTopology !== primitiveTopology ) {
|
|
|
|
renderObjectGPU.sampleCount = sampleCount;
|
|
renderObjectGPU.colorSpace = colorSpace;
|
|
renderObjectGPU.colorFormat = colorFormat;
|
|
renderObjectGPU.depthStencilFormat = depthStencilFormat;
|
|
renderObjectGPU.primitiveTopology = primitiveTopology;
|
|
|
|
needsUpdate = true;
|
|
|
|
}
|
|
|
|
return needsUpdate;
|
|
|
|
}
|
|
|
|
getCacheKey( renderObject ) {
|
|
|
|
const { object, material } = renderObject;
|
|
|
|
const utils = this.utils;
|
|
const renderContext = renderObject.context;
|
|
|
|
return [
|
|
utils.getSampleCount( renderContext ),
|
|
utils.getCurrentColorSpace( renderContext ), utils.getCurrentColorFormat( renderContext ), utils.getCurrentDepthStencilFormat( renderContext ),
|
|
utils.getPrimitiveTopology( object, material )
|
|
].join();
|
|
|
|
}
|
|
|
|
// textures
|
|
|
|
createSampler( texture ) {
|
|
|
|
this.textureUtils.createSampler( texture );
|
|
|
|
}
|
|
|
|
destroySampler( texture ) {
|
|
|
|
this.textureUtils.destroySampler( texture );
|
|
|
|
}
|
|
|
|
createDefaultTexture( texture ) {
|
|
|
|
this.textureUtils.createDefaultTexture( texture );
|
|
|
|
}
|
|
|
|
createTexture( texture, options ) {
|
|
|
|
this.textureUtils.createTexture( texture, options );
|
|
|
|
}
|
|
|
|
updateTexture( texture ) {
|
|
|
|
this.textureUtils.updateTexture( texture );
|
|
|
|
}
|
|
|
|
destroyTexture( texture ) {
|
|
|
|
this.textureUtils.destroyTexture( texture );
|
|
|
|
}
|
|
|
|
copyTextureToBuffer( texture, x, y, width, height ) {
|
|
|
|
return this.textureUtils.copyTextureToBuffer( texture, x, y, width, height );
|
|
|
|
}
|
|
|
|
// node builder
|
|
|
|
createNodeBuilder( object, renderer, scene = null ) {
|
|
|
|
return new WGSLNodeBuilder( object, renderer, scene );
|
|
|
|
}
|
|
|
|
// program
|
|
|
|
createProgram( program ) {
|
|
|
|
const programGPU = this.get( program );
|
|
|
|
programGPU.module = {
|
|
module: this.device.createShaderModule( { code: program.code, label: program.stage } ),
|
|
entryPoint: 'main'
|
|
};
|
|
|
|
}
|
|
|
|
destroyProgram( program ) {
|
|
|
|
this.delete( program );
|
|
|
|
}
|
|
|
|
// pipelines
|
|
|
|
createRenderPipeline( renderObject ) {
|
|
|
|
this.pipelineUtils.createRenderPipeline( renderObject );
|
|
|
|
}
|
|
|
|
createComputePipeline( computePipeline, bindings ) {
|
|
|
|
this.pipelineUtils.createComputePipeline( computePipeline, bindings );
|
|
|
|
}
|
|
|
|
// bindings
|
|
|
|
createBindings( bindings ) {
|
|
|
|
this.bindingUtils.createBindings( bindings );
|
|
|
|
}
|
|
|
|
updateBindings( bindings ) {
|
|
|
|
this.bindingUtils.createBindings( bindings );
|
|
|
|
}
|
|
|
|
updateBinding( binding ) {
|
|
|
|
this.bindingUtils.updateBinding( binding );
|
|
|
|
}
|
|
|
|
// attributes
|
|
|
|
createIndexAttribute( attribute ) {
|
|
|
|
this.attributeUtils.createAttribute( attribute, GPUBufferUsage.INDEX | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST );
|
|
|
|
}
|
|
|
|
createAttribute( attribute ) {
|
|
|
|
this.attributeUtils.createAttribute( attribute, GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST );
|
|
|
|
}
|
|
|
|
createStorageAttribute( attribute ) {
|
|
|
|
this.attributeUtils.createAttribute( attribute, GPUBufferUsage.STORAGE | GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_SRC | GPUBufferUsage.COPY_DST );
|
|
|
|
}
|
|
|
|
updateAttribute( attribute ) {
|
|
|
|
this.attributeUtils.updateAttribute( attribute );
|
|
|
|
}
|
|
|
|
destroyAttribute( attribute ) {
|
|
|
|
this.attributeUtils.destroyAttribute( attribute );
|
|
|
|
}
|
|
|
|
// canvas
|
|
|
|
updateSize() {
|
|
|
|
this._configureContext();
|
|
this._setupColorBuffer();
|
|
|
|
}
|
|
|
|
// utils public
|
|
|
|
hasFeature( name ) {
|
|
|
|
const adapter = this.adapter || _staticAdapter;
|
|
|
|
//
|
|
|
|
const features = Object.values( GPUFeatureName );
|
|
|
|
if ( features.includes( name ) === false ) {
|
|
|
|
throw new Error( 'THREE.WebGPURenderer: Unknown WebGPU GPU feature: ' + name );
|
|
|
|
}
|
|
|
|
//
|
|
|
|
return adapter.features.has( name );
|
|
|
|
}
|
|
|
|
copyFramebufferToTexture( texture, renderContext ) {
|
|
|
|
const renderContextData = this.get( renderContext );
|
|
|
|
const { encoder, descriptor } = renderContextData;
|
|
|
|
let sourceGPU = null;
|
|
|
|
if ( texture.isFramebufferTexture ) {
|
|
|
|
sourceGPU = this.context.getCurrentTexture();
|
|
|
|
} else if ( texture.isDepthTexture ) {
|
|
|
|
sourceGPU = this._getDepthBufferGPU( renderContext );
|
|
|
|
}
|
|
|
|
const destinationGPU = this.get( texture ).texture;
|
|
|
|
renderContextData.currentPass.end();
|
|
|
|
encoder.copyTextureToTexture(
|
|
{
|
|
texture: sourceGPU,
|
|
origin: { x: 0, y: 0, z: 0 }
|
|
},
|
|
{
|
|
texture: destinationGPU
|
|
},
|
|
[
|
|
texture.image.width,
|
|
texture.image.height
|
|
]
|
|
);
|
|
|
|
if ( texture.generateMipmaps ) this.textureUtils.generateMipmaps( texture );
|
|
|
|
descriptor.colorAttachments[ 0 ].loadOp = GPULoadOp.Load;
|
|
if ( renderContext.depth ) descriptor.depthStencilAttachment.depthLoadOp = GPULoadOp.Load;
|
|
if ( renderContext.stencil ) descriptor.depthStencilAttachment.stencilLoadOp = GPULoadOp.Load;
|
|
|
|
renderContextData.currentPass = encoder.beginRenderPass( descriptor );
|
|
renderContextData.currentAttributesSet = {};
|
|
|
|
}
|
|
|
|
// utils
|
|
|
|
_getDepthBufferGPU( renderContext ) {
|
|
|
|
const { width, height } = this.getDrawingBufferSize();
|
|
|
|
const depthTexture = this.defaultDepthTexture;
|
|
const depthTextureGPU = this.get( depthTexture ).texture;
|
|
|
|
let format, type;
|
|
|
|
if ( renderContext.stencil ) {
|
|
|
|
format = DepthStencilFormat;
|
|
type = UnsignedInt248Type;
|
|
|
|
} else if ( renderContext.depth ) {
|
|
|
|
format = DepthFormat;
|
|
type = UnsignedIntType;
|
|
|
|
}
|
|
|
|
if ( depthTextureGPU !== undefined ) {
|
|
|
|
if ( depthTexture.image.width === width && depthTexture.image.height === height && depthTexture.format === format && depthTexture.type === type ) {
|
|
|
|
return depthTextureGPU;
|
|
|
|
}
|
|
|
|
this.textureUtils.destroyTexture( depthTexture );
|
|
|
|
}
|
|
|
|
depthTexture.name = 'depthBuffer';
|
|
depthTexture.format = format;
|
|
depthTexture.type = type;
|
|
depthTexture.image.width = width;
|
|
depthTexture.image.height = height;
|
|
|
|
this.textureUtils.createTexture( depthTexture, { sampleCount: this.parameters.sampleCount } );
|
|
|
|
return this.get( depthTexture ).texture;
|
|
|
|
}
|
|
|
|
_configureContext() {
|
|
|
|
this.context.configure( {
|
|
device: this.device,
|
|
format: GPUTextureFormat.BGRA8Unorm,
|
|
usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC,
|
|
alphaMode: 'premultiplied'
|
|
} );
|
|
|
|
}
|
|
|
|
_setupColorBuffer() {
|
|
|
|
if ( this.colorBuffer ) this.colorBuffer.destroy();
|
|
|
|
const { width, height } = this.getDrawingBufferSize();
|
|
//const format = navigator.gpu.getPreferredCanvasFormat(); // @TODO: Move to WebGPUUtils
|
|
|
|
this.colorBuffer = this.device.createTexture( {
|
|
label: 'colorBuffer',
|
|
size: {
|
|
width: width,
|
|
height: height,
|
|
depthOrArrayLayers: 1
|
|
},
|
|
sampleCount: this.parameters.sampleCount,
|
|
format: GPUTextureFormat.BGRA8Unorm,
|
|
usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC
|
|
} );
|
|
|
|
}
|
|
|
|
}
|
|
|
|
export default WebGPUBackend;
|