Simplify layer plumbing for WebGPU

modules/aggregation-layers/src/heatmap-layer/heatmap-layer.ts

@@ -408,6 +408,7 @@ export default class HeatmapLayer<
     weightsTransform?.destroy();
     weightsTransform = new TextureTransform(this.context.device, {
       id: `${this.id}-weights-transform`,
+      ...shaders,
       bufferLayout: attributeManager.getBufferLayouts(),
       vertexCount: 1,
       targetTexture: weightsTexture!,
@@ -420,7 +421,6 @@ export default class HeatmapLayer<
         blendAlphaDstFactor: 'one'
       },
       topology: 'point-list',
-      ...shaders,
       modules: [...shaders.modules, weightUniforms]
     } as TextureTransformProps);
 

modules/core/src/lib/layer.ts

@@ -452,9 +452,19 @@ export default abstract class Layer<PropsT extends {} = {}> extends Component<
   abstract initializeState(context: LayerContext): void;
 
   getShaders(shaders: any): any {
+    // TODO(ibgreen): WebGPU complication: Matching attachment state of the renderpass requires including a depth buffer
+    const parameters =
+      this.context.device.type === 'webgpu'
+        ? ({
+            depthWriteEnabled: true,
+            depthCompare: 'less-equal'
+          } satisfies LumaParameters)
+        : undefined;
+
     shaders = mergeShaders(shaders, {
       disableWarnings: true,
-      modules: this.context.defaultShaderModules
+      modules: this.context.defaultShaderModules,
+      parameters
     });
     for (const extension of this.props.extensions) {
       shaders = mergeShaders(shaders, extension.getShaders.call(this, extension));

modules/layers/src/line-layer/line-layer.ts

@@ -17,7 +17,6 @@ import {
   UpdateParameters,
   DefaultProps
 } from '@deck.gl/core';
-import {Parameters} from '@luma.gl/core';
 import {Model, Geometry} from '@luma.gl/engine';
 
 import {lineUniforms, LineProps} from './line-layer-uniforms';
@@ -190,15 +189,6 @@ export default class LineLayer<DataT = any, ExtraProps extends {} = {}> extends
   }
 
   protected _getModel(): Model {
-    // TODO(ibgreen): WebGPU complication: Matching attachment state of the renderpass requires including a depth buffer
-    const parameters =
-      this.context.device.type === 'webgpu'
-        ? ({
-            depthWriteEnabled: true,
-            depthCompare: 'less-equal'
-          } satisfies Parameters)
-        : undefined;
-
     /*
      *  (0, -1)-------------_(1, -1)
      *       |          _,-"  |
@@ -218,7 +208,6 @@ export default class LineLayer<DataT = any, ExtraProps extends {} = {}> extends
           positions: {size: 3, value: new Float32Array(positions)}
         }
       }),
-      parameters,
       isInstanced: true
     });
   }

modules/layers/src/point-cloud-layer/point-cloud-layer.ts

@@ -19,7 +19,6 @@ import {
   Material,
   DefaultProps
 } from '@deck.gl/core';
-import {Parameters} from '@luma.gl/core';
 import {Model, Geometry} from '@luma.gl/engine';
 import {gouraudMaterial} from '@luma.gl/shadertools';
 
@@ -182,23 +181,10 @@ export default class PointCloudLayer<DataT = any, ExtraPropsT extends {} = {}> e
       radiusPixels: pointSize
     };
     model.shaderInputs.setProps({pointCloud: pointCloudProps});
-    if (this.context.device.type === 'webgpu') {
-      // @ts-expect-error TODO - this line was needed during WebGPU port
-      model.instanceCount = this.props.data.length;
-    }
     model.draw(this.context.renderPass);
   }
 
   protected _getModel(): Model {
-    // TODO(ibgreen): WebGPU complication: Matching attachment state of the renderpass requires including a depth buffer
-    const parameters =
-      this.context.device.type === 'webgpu'
-        ? ({
-            depthWriteEnabled: true,
-            depthCompare: 'less-equal'
-          } satisfies Parameters)
-        : undefined;
-
     // a triangle that minimally cover the unit circle
     const positions: number[] = [];
     for (let i = 0; i < 3; i++) {
@@ -216,7 +202,6 @@ export default class PointCloudLayer<DataT = any, ExtraPropsT extends {} = {}> e
           positions: new Float32Array(positions)
         }
       }),
-      parameters,
       isInstanced: true
     });
   }

modules/layers/src/scatterplot-layer/scatterplot-layer.ts

@@ -20,7 +20,6 @@ import type {
   Color,
   DefaultProps
 } from '@deck.gl/core';
-import {Parameters} from '@luma.gl/core';
 
 const DEFAULT_COLOR: [number, number, number, number] = [0, 0, 0, 255];
 
@@ -258,23 +257,10 @@ export default class ScatterplotLayer<DataT = any, ExtraPropsT extends {} = {}>
     };
     const model = this.state.model!;
     model.shaderInputs.setProps({scatterplot: scatterplotProps});
-    if (this.context.device.type === 'webgpu') {
-      // @ts-expect-error TODO - this line was needed during WebGPU port
-      model.instanceCount = this.props.data.length;
-    }
     model.draw(this.context.renderPass);
   }
 
   protected _getModel() {
-    // TODO(ibgreen): WebGPU complication: Matching attachment state of the renderpass requires including a depth buffer
-    const parameters =
-      this.context.device.type === 'webgpu'
-        ? ({
-            depthWriteEnabled: true,
-            depthCompare: 'less-equal'
-          } satisfies Parameters)
-        : undefined;
-
     // a square that minimally cover the unit circle
     const positions = [-1, -1, 0, 1, -1, 0, -1, 1, 0, 1, 1, 0];
     return new Model(this.context.device, {
@@ -287,8 +273,7 @@ export default class ScatterplotLayer<DataT = any, ExtraPropsT extends {} = {}>
           positions: {size: 3, value: new Float32Array(positions)}
         }
       }),
-      isInstanced: true,
-      parameters
+      isInstanced: true
     });
   }
 }