Skip to content

[pull] dev from mrdoob:dev #1542

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pull merged 1 commit into from
Jul 31, 2026
Merged

[pull] dev from mrdoob:dev #1542

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 0 additions & 5 deletions src/renderers/common/Constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,3 @@ export const AttributeType = {
// size of a chunk in bytes (STD140 layout)

export const GPU_CHUNK_BYTES = 16;

// @TODO: Move to src/constants.js

export const BlendColorFactor = 211;
export const OneMinusBlendColorFactor = 212;
29 changes: 25 additions & 4 deletions src/renderers/webgl-fallback/utils/WebGLState.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,11 @@ import {
AdditiveBlending, SubtractiveBlending, MultiplyBlending, SubtractEquation, ReverseSubtractEquation, MinEquation, MaxEquation,
ZeroFactor, OneFactor, SrcColorFactor, SrcAlphaFactor, SrcAlphaSaturateFactor, DstColorFactor, DstAlphaFactor,
OneMinusSrcColorFactor, OneMinusSrcAlphaFactor, OneMinusDstColorFactor, OneMinusDstAlphaFactor,
ConstantColorFactor, OneMinusConstantColorFactor, ConstantAlphaFactor, OneMinusConstantAlphaFactor,
NeverDepth, AlwaysDepth, LessDepth, LessEqualDepth, EqualDepth, GreaterEqualDepth, GreaterDepth, NotEqualDepth,
MaterialBlending
} from '../../../constants.js';
import { Color } from '../../../math/Color.js';
import { Vector4 } from '../../../math/Vector4.js';
import { error, ReversedDepthFuncs, warnOnce } from '../../../utils.js';

Expand Down Expand Up @@ -62,6 +64,8 @@ class WebGLState {
this.currentBlendDst = null;
this.currentBlendSrcAlpha = null;
this.currentBlendDstAlpha = null;
this.currentBlendColor = new Color( 0, 0, 0 );
this.currentBlendAlpha = 0;
this.currentPremultipledAlpha = null;
this.currentPolygonOffsetFactor = null;
this.currentPolygonOffsetUnits = null;
Expand Down Expand Up @@ -124,7 +128,11 @@ class WebGLState {
[ OneMinusSrcColorFactor ]: gl.ONE_MINUS_SRC_COLOR,
[ OneMinusSrcAlphaFactor ]: gl.ONE_MINUS_SRC_ALPHA,
[ OneMinusDstColorFactor ]: gl.ONE_MINUS_DST_COLOR,
[ OneMinusDstAlphaFactor ]: gl.ONE_MINUS_DST_ALPHA
[ OneMinusDstAlphaFactor ]: gl.ONE_MINUS_DST_ALPHA,
[ ConstantColorFactor ]: gl.CONSTANT_COLOR,
[ OneMinusConstantColorFactor ]: gl.ONE_MINUS_CONSTANT_COLOR,
[ ConstantAlphaFactor ]: gl.CONSTANT_ALPHA,
[ OneMinusConstantAlphaFactor ]: gl.ONE_MINUS_CONSTANT_ALPHA
};

const scissorParam = gl.getParameter( gl.SCISSOR_BOX );
Expand Down Expand Up @@ -426,7 +434,7 @@ class WebGLState {
* Defines the blending.
*
* This method caches the state so `gl.blendEquation()`, `gl.blendEquationSeparate()`,
* `gl.blendFunc()` and `gl.blendFuncSeparate()` are only called when necessary.
* `gl.blendFunc()`, `gl.blendFuncSeparate()` and `gl.blendColor()` are only called when necessary.
*
* @param {number} blending - The blending type.
* @param {number} blendEquation - The blending equation.
Expand All @@ -435,9 +443,11 @@ class WebGLState {
* @param {number} blendEquationAlpha - Only relevant for custom blending. The blending equation for alpha.
* @param {number} blendSrcAlpha - Only relevant for custom blending. The alpha source blending factor.
* @param {number} blendDstAlpha - Only relevant for custom blending. The alpha destination blending factor.
* @param {Color} blendColor - Only relevant for custom blending. The RGB values of the constant blend color.
* @param {number} blendAlpha - Only relevant for custom blending. The alpha value of the constant blend color.
* @param {boolean} premultipliedAlpha - Whether premultiplied alpha is enabled or not.
*/
setBlending( blending, blendEquation, blendSrc, blendDst, blendEquationAlpha, blendSrcAlpha, blendDstAlpha, premultipliedAlpha ) {
setBlending( blending, blendEquation, blendSrc, blendDst, blendEquationAlpha, blendSrcAlpha, blendDstAlpha, blendColor, blendAlpha, premultipliedAlpha ) {

const { gl } = this;

Expand Down Expand Up @@ -568,6 +578,15 @@ class WebGLState {

}

if ( blendColor.equals( this.currentBlendColor ) === false || blendAlpha !== this.currentBlendAlpha ) {

gl.blendColor( blendColor.r, blendColor.g, blendColor.b, blendAlpha );

this.currentBlendColor.copy( blendColor );
this.currentBlendAlpha = blendAlpha;

}

this.currentBlending = blending;
this.currentPremultipledAlpha = false;

Expand Down Expand Up @@ -917,7 +936,7 @@ class WebGLState {

( material.blending === NormalBlending && material.transparent === false )
? this.setBlending( NoBlending )
: this.setBlending( material.blending, material.blendEquation, material.blendSrc, material.blendDst, material.blendEquationAlpha, material.blendSrcAlpha, material.blendDstAlpha, material.premultipliedAlpha );
: this.setBlending( material.blending, material.blendEquation, material.blendSrc, material.blendDst, material.blendEquationAlpha, material.blendSrcAlpha, material.blendDstAlpha, material.blendColor, material.blendAlpha, material.premultipliedAlpha );

this.setDepthFunc( material.depthFunc );
this.setDepthTest( material.depthTest );
Expand Down Expand Up @@ -1444,6 +1463,8 @@ class WebGLState {
this.currentBlendDst = null;
this.currentBlendSrcAlpha = null;
this.currentBlendDstAlpha = null;
this.currentBlendColor.set( 0, 0, 0 );
this.currentBlendAlpha = 0;
this.currentPremultipledAlpha = null;
this.currentPolygonOffsetFactor = null;
this.currentPolygonOffsetUnits = null;
Expand Down
54 changes: 51 additions & 3 deletions src/renderers/webgpu/WebGPUBackend.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@ import WebGPUCapabilities from './utils/WebGPUCapabilities.js';
import WebGPUPipelineUtils from './utils/WebGPUPipelineUtils.js';
import WebGPUTextureUtils from './utils/WebGPUTextureUtils.js';

import { WebGPUCoordinateSystem, TimestampQuery, REVISION, HalfFloatType, Compatibility } from '../../constants.js';
import { WebGPUCoordinateSystem, TimestampQuery, REVISION, HalfFloatType, Compatibility, CustomBlending } from '../../constants.js';
import { Color } from '../../math/Color.js';
import WebGPUTimestampQueryPool from './utils/WebGPUTimestampQueryPool.js';
import { error } from '../../utils.js';

Expand All @@ -32,6 +33,7 @@ import GPUTextureViewDescriptor from './descriptors/GPUTextureViewDescriptor.js'
import GPUExtent3D from './descriptors/GPUExtent3D.js';

const _clearValue = { r: 0, g: 0, b: 0, a: 1 };
const _blendConstant = { r: 0, g: 0, b: 0, a: 0 };
const _bufferDescriptor = new GPUBufferDescriptor();
const _commandEncoderDescriptor = new GPUCommandEncoderDescriptor();
const _computePassDescriptor = new GPUComputePassDescriptor();
Expand Down Expand Up @@ -1122,9 +1124,31 @@ class WebGPUBackend extends Backend {

renderContextData.descriptor = descriptor;
renderContextData.encoder = encoder;
renderContextData.currentSets = { attributes: {}, bindingGroups: [], pipeline: null, index: null };
renderContextData.renderBundles = [];

this._resetRenderContextData( renderContextData );

}

/**
* Resets the state cache of the given render context data.
*
* A new render pass encoder starts with a blend constant and a stencil reference
* of zero so the cached values must be reset as well.
*
* @private
* @param {Object} renderContextData - The render context data.
*/
_resetRenderContextData( renderContextData ) {

renderContextData.currentSets = { attributes: {}, bindingGroups: [], pipeline: null, index: null };

if ( renderContextData.currentBlendColor === undefined ) renderContextData.currentBlendColor = new Color();

renderContextData.currentBlendColor.setRGB( 0, 0, 0 );
renderContextData.currentBlendAlpha = 0;
renderContextData.currentStencilRef = 0;

}

/**
Expand Down Expand Up @@ -2062,6 +2086,29 @@ class WebGPUBackend extends Backend {

}

// blend constant

if ( material.blending === CustomBlending && passEncoderGPU.setBlendConstant !== undefined ) {

const blendColor = material.blendColor;
const blendAlpha = material.blendAlpha;

if ( blendColor.equals( renderContextData.currentBlendColor ) === false || blendAlpha !== renderContextData.currentBlendAlpha ) {

_blendConstant.r = blendColor.r;
_blendConstant.g = blendColor.g;
_blendConstant.b = blendColor.b;
_blendConstant.a = blendAlpha;

passEncoderGPU.setBlendConstant( _blendConstant );

renderContextData.currentBlendColor.copy( blendColor );
renderContextData.currentBlendAlpha = blendAlpha;

}

}

if ( object.isBatchedMesh === true ) {

const starts = object._multiDrawStarts;
Expand Down Expand Up @@ -3095,7 +3142,8 @@ class WebGPUBackend extends Backend {
if ( renderContext.stencil ) descriptor.depthStencilAttachment.stencilLoadOp = GPULoadOp.Load;

renderContextData.currentPass = encoder.beginRenderPass( descriptor );
renderContextData.currentSets = { attributes: {}, bindingGroups: [], pipeline: null, index: null };

this._resetRenderContextData( renderContextData );

if ( renderContext.viewport ) {

Expand Down
9 changes: 5 additions & 4 deletions src/renderers/webgpu/utils/WebGPUPipelineUtils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
import { BlendColorFactor, OneMinusBlendColorFactor, } from '../../common/Constants.js';

import {
GPUFrontFace, GPUCullMode, GPUColorWriteFlags, GPUCompareFunction, GPUBlendFactor, GPUBlendOperation, GPUIndexFormat, GPUStencilOperation, GPUPrimitiveTopology
} from './WebGPUConstants.js';
Expand All @@ -10,6 +8,7 @@ import {
NoBlending, NormalBlending, AdditiveBlending, SubtractiveBlending, MultiplyBlending, CustomBlending, MaterialBlending,
ZeroFactor, OneFactor, SrcColorFactor, OneMinusSrcColorFactor, SrcAlphaFactor, OneMinusSrcAlphaFactor, DstColorFactor,
OneMinusDstColorFactor, DstAlphaFactor, OneMinusDstAlphaFactor, SrcAlphaSaturateFactor,
ConstantColorFactor, OneMinusConstantColorFactor, ConstantAlphaFactor, OneMinusConstantAlphaFactor,
AddEquation, SubtractEquation, ReverseSubtractEquation, MinEquation, MaxEquation,
KeepStencilOp, ZeroStencilOp, ReplaceStencilOp, InvertStencilOp, IncrementStencilOp, DecrementStencilOp, IncrementWrapStencilOp, DecrementWrapStencilOp,
NeverStencilFunc, AlwaysStencilFunc, LessStencilFunc, LessEqualStencilFunc, EqualStencilFunc, GreaterEqualStencilFunc, GreaterStencilFunc, NotEqualStencilFunc
Expand Down Expand Up @@ -714,11 +713,13 @@ class WebGPUPipelineUtils {
blendFactor = GPUBlendFactor.SrcAlphaSaturated;
break;

case BlendColorFactor:
case ConstantColorFactor:
case ConstantAlphaFactor: // WebGPU has no dedicated constant alpha blend factors
blendFactor = GPUBlendFactor.Constant;
break;

case OneMinusBlendColorFactor:
case OneMinusConstantColorFactor:
case OneMinusConstantAlphaFactor: // WebGPU has no dedicated constant alpha blend factors
blendFactor = GPUBlendFactor.OneMinusConstant;
break;

Expand Down