Addons: Support overview in WebGLRenderer and WebGPURenderer.

[Mugen87]

Description

This issue is intended for tracking which addons are already supported in WebGPURenderer.

Not all open tasks must be implemented. Certain addons might not be ported to WebGPURenderer because they are outdated (like the old BloomPass) or replaced with different APIs (like MaskPass). Such addons are marked with a ✖️ sign.

If someone wants to migrate a component, it's best to leave a comment so we can add the name to the "Assignee" column. In this way, we avoid the situation where more than one developer works at the same task.

Addon	WebGLRenderer	WebGPURenderer	Assignee
animation/AnimationClipCreator.js	✅	✅	-
animation/CCDIKSolver.js	✅	✅	-
animation/MMDAnimationHelper.js	✅	✅	-
animation/MMDPhysics.js	✅	✅	-
cameras/CinematicCamera.js	✅	❌ (dependency to GLSL)	-
capabilities/WebGL.js	✅	✅	-
capabilities/WebGPU.js	✅	✅	-
controls/ArcballControls.js	✅	✅	-
controls/DragControls.js	✅	✅	-
controls/FirstPersonControls.js	✅	✅	-
controls/FlyControls.js	✅	✅	-
controls/MapControls.js	✅	✅	-
controls/OrbitControls.js	✅	✅	-
controls/PointerLockControls.js	✅	✅	-
controls/TrackballControls.js	✅	✅	-
controls/TransformControls.js	✅	✅	-
csm/CSM.js	✅	❌ (dependency to GLSL)	-
csm/CSMFrustum.js	✅	✅	-
csm/CSMHelper.js	✅	✅	-
csm/CSMShader.js	✅	❌(dependency to GLSL)	-
curves/CurveExtras.js	✅	✅	-
curves/NURBSCurve.js	✅	✅	-
curves/NURBSSurface.js	✅	✅	-
curves/NURBSUtils.js	✅	✅	-
curves/NURBSVolume.js	✅	✅	-
effects/AnaglyphEffect.js	✅	✅ (as AnaglyphPassNode )	-
effects/AsciiEffect.js	✅	✅	-
effects/OutlineEffect.js	✅	❌ (dependency to GLSL)	@Mugen87
effects/ParallaxBarrierEffect.js	✅	✅ (as ParallaxBarrierPassNode )	-
effects/PeppersGhostEffect.js	✅	✅	-
effects/StereoEffect.js	✅	✅ (as StereoPassNode)	-
environments/DebugEnvironment.js	✅	✅	-
environments/RoomEnvironment.js	✅	✅	-
exporters/DRACOExporter.js	✅	✅	-
exporters/EXRExporter.js	✅	✅	-
exporters/GLTFExporter.js	✅	❌ (dependency to TextureUtils.decompress())	-
exporters/KTX2Exporter.js	✅	✅	-
exporters/MMDExporter.js	✅	✅	-
exporters/OBJExporter.js	✅	✅	-
exporters/PLYExporter.js	✅	✅	-
exporters/STLExporter.js	✅	✅	-
exporters/USDZExporter.js	✅	❌ (dependency to TextureUtils.decompress())	-
geometries/BoxLineGeometry.js	✅	✅	-
geometries/ConvexGeometry.js	✅	✅	-
geometries/DecalGeometry.js	✅	✅	-
geometries/InstancedPointsGeometry.js	✅	✅	-
geometries/ParametricGeometries.js	✅	✅	-
geometries/ParametricGeometry.js	✅	✅	-
geometries/RoundedBoxGeometry.js	✅	✅	-
geometries/TeapotGeometry.js	✅	✅	-
geometries/TextGeometry.js	✅	✅	-
helpers/LightProbeHelper.js	✅	✅ (as LightProbeHelperGPU)	-
helpers/OctreeHelper.js	✅	✅	-
helpers/PositionalAudioHelper.js	✅	✅	-
helpers/RectAreaLightHelper.js	✅	✅	-
helpers/TextureHelper.js	✅	❌ (dependency to GLSL)	-
helpers/VertexNormalsHelper.js	✅	✅	-
helpers/VertexTangentsHelper.js	✅	✅	-
helpers/ViewHelper.js	✅	✅	-
interactive/HTMLMesh.js	✅	✅	-
interactive/InteractiveGroup.js	✅	✅	-
interactive/SelectionBox.js	✅	✅	-
interactive/SelectionHelper.js	✅	✅	-
lights/LightProbeGenerator.js	✅	✅	-
lights/RectAreaLightTexturesLib.js	✅	✅	-
lights/RectAreaLightUniformsLib.js	✅	✅	-
lines/Lines.js	✅	✅ (as webgpu/Lines2.js)	-
lines/LineGeometry.js	✅	✅	-
lines/LineMaterial.js	✅	✅ (as Line2NodeMaterial)	-
lines/LineSegments2.js	✅	✅ (as webgpu/LineSegments2.js)	-
lines/LineSegmentsGeometry.js	✅	✅	-
lines/Wireframe.js	✅	❌ (dependency to LineMaterial)	-
lines/WireframeGeometry2.js	✅	✅	-
loaders/3DMLoader.js	✅	✅	-
loaders/3MFLoader.js	✅	✅	-
loaders/AMFLoader.js	✅	✅	-
loaders/BVHLoader.js	✅	✅	-
loaders/ColladaLoader.js	✅	✅	-
loaders/DDSLoader.js	✅	✅	-
loaders/DRACOLoader.js	✅	✅	-
loaders/EXRLoader.js	✅	✅	-
loaders/FBXLoader.js	✅	✅	-
loaders/FontLoader.js	✅	✅	-
loaders/GCodeLoader.js	✅	✅	-
loaders/GLTFLoader.js	✅	✅	-
loaders/HDRCubeTextureLoader.js	✅	✅	-
loaders/IESLoader.js	✅	✅	-
loaders/KMZLoader.js	✅	✅	-
loaders/KTX2Loader.js	✅	✅	-
loaders/KTXLoader.js	✅	✅	-
loaders/LDrawLoader.js	✅	❌ (dependency to GLSL)	-
loaders/LottieLoader.js	✅	✅	-
loaders/LUT3dlLoader.js	✅	✅	-
loaders/LUTCubeLoader.js	✅	✅	-
loaders/LUTImageLoader.js	✅	✅	-
loaders/LWOLoader.js	✅	✅	-
loaders/MaterialXLoader.js	✅	✅	-
loaders/MD2Loader.js	✅	✅	-
loaders/MDDLoader.js	✅	✅	-
loaders/MMDLoader.js	✅	❌ (dependency to GLSL)	-
loaders/MTLLoader.js	✅	✅	-
loaders/NRRDLoader.js	✅	✅	-
loaders/OBJLoader.js	✅	✅	-
loaders/PCDLoader.js	✅	✅	-
loaders/PDBLoader.js	✅	✅	-
loaders/PLYLoader.js	✅	✅	-
loaders/PVRLoader.js	✅	✅	-
loaders/RGBELoader.js	✅	✅	-
loaders/RGBMLoader.js	✅	✅	-
loaders/STLLoader.js	✅	✅	-
loaders/SVGLoader.js	✅	✅	-
loaders/TDSLoader.js	✅	✅	-
loaders/TGALoader.js	✅	✅	-
loaders/TIFFLoader.js	✅	✅	-
loaders/TiltLoader.js	✅	❌ (dependency to GLSL)	-
loaders/TTFLoader.js	✅	✅	-
loaders/UltraHDRLoader.js	✅	✅	-
loaders/USDZLoader.js	✅	✅	-
loaders/VOXLoader.js	✅	✅	-
loaders/VRMLLoader.js	✅	✅	-
loaders/VTKLoader.js	✅	✅	-
loaders/XYZLoader.js	✅	✅	-
materials/MeshGouraudMaterial.js	✅	❌ (dependency to GLSL)	-
materials/MeshPostProcessingMaterial.js	✅	✖️ (won't be ported)	-
math/Capsule.js	✅	✅	-
math/ColorConverter.js	✅	✅	-
math/ConvexHull.js	✅	✅	-
math/ImprovedNoise.js	✅	✅	-
math/Lut.js	✅	✅	-
math/MeshSurfaceSampler.js	✅	✅	-
math/OBB.js	✅	✅	-
math/Octree.js	✅	✅	-
math/SimplexNoise.js	✅	✅	-
misc/ConvexObjectBreaker.js	✅	✅	-
misc/GPUComputationRenderer.js	✅	✖️ (replaced with compute shaders)	-
misc/Gyroscope.js	✅	✅	-
misc/MD2Character.js	✅	✅	-
misc/MD2CharacterComplex.js	✅	✅	-
misc/MorphAnimMesh.js	✅	✅	-
misc/MorphBlendMesh.js	✅	✅	-
misc/ProgressiveLightMap.js	✅	❌ (dependency to GLSL)	-
misc/RollerCoaster.js	✅	✅	-
misc/Timer.js	✅	✅	-
misc/TubePainter.js	✅	✅	-
misc/Volume.js	✅	✅	-
misc/VolumeSlice.js	✅	✅	-
modifiers/CurveModifier.js	✅	❌ (dependency to GLSL)	@aardgoose
modifiers/EdgeSplitModifier.js	✅	✅	-
modifiers/SimplifyModifier.js	✅	✅	-
modifiers/TessellateModifier.js	✅	✅	-
objects/GroundedSkybox.js	✅	✅	-
objects/InstancedPoints.js	❌	✅	-
objects/Lensflare.js	✅	❌ (dependency to GLSL)	@aardgoose
objects/MarchingCubes.js	✅	✅	-
objects/Reflector.js	✅	✅ (as ReflectorNode)	-
objects/ReflectorForSSRPass.js	✅	❌ (dependency to GLSL)	-
objects/Refractor.js	✅	✅ (as viewportSharedTexture())	-
objects/ShadowMesh.js	✅	✅	-
objects/Sky.js	✅	✅ (as objects/SkyMesh)	-
objects/Water.js	✅	✅ (as objects/WaterMesh)	-
objects/Water2.js	✅	✅ (as objects/Water2Mesh)	-
physics/AmmoPhysics.js	✅	✅	-
physics/JoltPhysics.js	✅	✅	-
physics/RapierPhysics.js	✅	✅	-
postprocessing/AfterimagePass.js	✅	✅ (as AfterImageNode)	-
postprocessing/BloomPass.js	✅	✖️ (won't be ported)	-
postprocessing/BokehPass.js	✅	✅ (as DepthOfFieldNode)	-
postprocessing/ClearPass.js	✅	✖️ (won't be ported)	-
postprocessing/CubeTexturePass.js	✅	✖️ (won't be ported)	-
postprocessing/DotScreenPass.js	✅	✅ (as DotScreenNode)	-
postprocessing/EffectComposer.js	✅	✅ (as PostProcessing)	-
postprocessing/FilmPass.js	✅	✅ (as FilmNode)	-
postprocessing/GlitchPass.js	✅	✖️ (won't be ported)	-
postprocessing/GTAOPass.js	✅	✅ (as GTAONode)	-
postprocessing/HalftonePass.js	✅	✖️ (won't be ported)	-
postprocessing/LUTPass.js	✅	✅ (as Lut3DNode)	-
postprocessing/MaskPass.js	✅	✖️ (won't be ported)	-
postprocessing/OutlinePass.js	✅	❌ (dependency to GLSL)	@cmhhelgeson
postprocessing/OutputPass.js	✅	✅ (as RenderOutputNode)	-
postprocessing/Pass.js	✅	✅ (as TempNode or TextureNode)	-
postprocessing/RenderPass.js	✅	✅ (as PassNode)	-
postprocessing/RenderPixelatedPass.js	✅	✅ (as PixelationNode)	-
postprocessing/SAOPass.js	✅	✖️ (won't be ported)	-
postprocessing/SavePass.js	✅	✖️ (won't be ported)	-
postprocessing/ShaderPass.js	✅	✖️ (won't be ported)	-
postprocessing/SMAAPass.js	✅	❌ (dependency to GLSL)	-
postprocessing/SSAARenderPass.js	✅	✅ (as SSAAPassNode)	-
postprocessing/SSAOPass.js	✅	✖️ (won't be ported)	-
postprocessing/SSRPass.js	✅	❌ (dependency to GLSL)	-
postprocessing/TAARenderPass.js	✅	❌ (dependency to GLSL)	-
postprocessing/TexturePass.js	✅	✅ (as TextureNode)	-
postprocessing/UnrealBloomPass.js	✅	✅ (as BloomNode)	-
renderers/CSS2DRenderer.js	✅	✅	-
renderers/CSS3DRenderer.js	✅	✅	-
renderers/Projector.js	✅	✅	-
renderers/SVGRenderer.js	✅	✅	-
shaders/*	✅	❌ (dependency to GLSL)	-
textures/FlakesTexture.js	✅	✅	-
utils/BufferGeometryUtils.js	✅	✅	-
utils/GeometryCompressionUtils.js	✅	✅	-
utils/GeometryUtils.js	✅	✅	-
utils/LDrawUtils.js	✅	✅	-
utils/SceneUtils.js	✅	✅	-
utils/ShadowMapViewer.js	✅	✅ (as ShadowMapViewerGPU)	-
utils/SkeletonUtils.js	✅	✅	-
utils/SortUtils.js	✅	✅	-
utils/TextureUtils.js	✅	✅ (as TextureUtilsGPU)	-
utils/UVsDebug.js	✅	✅	-
utils/WorkerPool.js	✅	✅	-
webxr/ARButton.js	✅	❌ (dependency to WebGLRenderer)	-
webxr/OculusHandModel.js	✅	✅	-
webxr/OculusHandPointerModel.js	✅	✅	-
webxr/Text2D.js	✅	✅	-
webxr/VRButton.js	✅	❌ (dependency to WebGLRenderer)	-
webxr/XRButton.js	✅	❌ (dependency to WebGLRenderer)	-
webxr/XRControllerModelFactory.js	✅	✅	-
webxr/XREstimatedLight.js	✅	❌ (dependency to WebGLRenderer)	-
webxr/XRHandMeshModel.js	✅	✅	-
webxr/XRHandModelFactory.js	✅	✅	-
webxr/XRHandPrimitiveModel.js	✅	✅	-
webxr/XRPlanes.js	✅	❌ (dependency to WebGLRenderer)	-

[aardgoose]

@Mugen87 I am looking at LensFlare()

[Mugen87]

@cmhhelgeson Are you still interested in working at OutlinePass? If so, I would put your name into the table so the task is reserved.

[cmhhelgeson]

@cmhhelgeson Are you still interested in working at OutlinePass? If so, I would put your name into the table so the task is reserved.

How would I add my name to the table?

[Mugen87]

I can do that for you 👍 .

[aardgoose]

Also looking at CurveModifier (actually working roughly - as always another bug/feature elsewhere found).

Lensflare working apart from some color space etc issues - requires #29400 and #29384 upstream.

[cmhhelgeson]

Hi @Mugen87, I'd actually like to unreserve the OutlineEffect task for the time being.