Skip to content
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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

WebGPURenderer: Add Offscreen Support #27520

Merged
merged 11 commits into from
Jan 8, 2024
+71 −32
Merged

WebGPURenderer: Add Offscreen Support #27520

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
5d9dee0
add offscreen support
RenaudRohlinger Jan 7, 2024
96de43d
refactor statics webgpu
RenaudRohlinger Jan 7, 2024
397c330
navigator.gpu should be enough for initial check
RenaudRohlinger Jan 7, 2024
04df8ee
fix webgl context ktx2loader
RenaudRohlinger Jan 7, 2024
59e6bcb
use isAvailable in webgpurenderer
RenaudRohlinger Jan 7, 2024
66374c4
cleanup and should fix pupeeter
RenaudRohlinger Jan 7, 2024
075b0cf
return promise
RenaudRohlinger Jan 7, 2024
011f03f
feedbacks
RenaudRohlinger Jan 8, 2024
a677aa3
remove unecessary async
RenaudRohlinger Jan 8, 2024
bc61252
removed oversight
RenaudRohlinger Jan 8, 2024
2d90e0c
cleanup
sunag Jan 8, 2024
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
22 changes: 13 additions & 9 deletions examples/jsm/capabilities/WebGPU.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,17 @@
if ( window.GPUShaderStage === undefined ) {
if ( self.GPUShaderStage === undefined ) {

window.GPUShaderStage = { VERTEX: 1, FRAGMENT: 2, COMPUTE: 4 };
self.GPUShaderStage = { VERTEX: 1, FRAGMENT: 2, COMPUTE: 4 };

}

let isAvailable = false;
// statics

if ( navigator.gpu !== undefined ) {
let isAvailable = navigator.gpu !== undefined;

const adapter = await navigator.gpu.requestAdapter();

if ( adapter !== null ) {
if ( typeof window !== 'undefined' && isAvailable ) {

isAvailable = true;

}
isAvailable = await navigator.gpu.requestAdapter();

}

Expand All @@ -26,6 +23,12 @@ class WebGPU {

}
RenaudRohlinger marked this conversation as resolved.
Show resolved Hide resolved

static async getStaticAdapter() {

return await isAvailable;

}

RenaudRohlinger marked this conversation as resolved.
Show resolved Hide resolved
static getErrorMessage() {

const message = 'Your browser does not support <a href="https://gpuweb.github.io/gpuweb/" style="color:blue">WebGPU</a> yet';
Expand All @@ -50,4 +53,5 @@ class WebGPU {

}


export default WebGPU;
24 changes: 16 additions & 8 deletions examples/jsm/loaders/KTX2Loader.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,18 +120,26 @@ class KTX2Loader extends Loader {

}

async detectSupportAsync( renderer ) {

this.workerConfig = {
astcSupported: await renderer.hasFeature( 'texture-compression-astc' ),
etc1Supported: await renderer.hasFeature( 'texture-compression-etc1' ),
etc2Supported: await renderer.hasFeature( 'texture-compression-etc2' ),
dxtSupported: await renderer.hasFeature( 'texture-compression-bc' ),
bptcSupported: await renderer.hasFeature( 'texture-compression-bptc' ),
pvrtcSupported: await renderer.hasFeature( 'texture-compression-pvrtc' )
};

return this;

}

detectSupport( renderer ) {

if ( renderer.isWebGPURenderer === true ) {

this.workerConfig = {
astcSupported: renderer.hasFeature( 'texture-compression-astc' ),
etc1Supported: renderer.hasFeature( 'texture-compression-etc1' ),
etc2Supported: renderer.hasFeature( 'texture-compression-etc2' ),
dxtSupported: renderer.hasFeature( 'texture-compression-bc' ),
bptcSupported: renderer.hasFeature( 'texture-compression-bptc' ),
pvrtcSupported: renderer.hasFeature( 'texture-compression-pvrtc' )
};
return this.detectSupportAsync( renderer );

} else {

Expand Down
15 changes: 3 additions & 12 deletions examples/jsm/renderers/webgpu/WebGPUBackend.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,16 +14,7 @@ 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();

}
import WebGPU from '../../capabilities/WebGPU.js';

//

Expand Down Expand Up @@ -1071,9 +1062,9 @@ class WebGPUBackend extends Backend {

}

hasFeature( name ) {
async hasFeature( name ) {
RenaudRohlinger marked this conversation as resolved.
Show resolved Hide resolved

const adapter = this.adapter || _staticAdapter;
const adapter = this.adapter || await WebGPU.getStaticAdapter();

//

Expand Down
3 changes: 2 additions & 1 deletion examples/jsm/renderers/webgpu/WebGPURenderer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import WebGPU from '../../capabilities/WebGPU.js';
Fixed Show fixed Hide fixed

import Renderer from '../common/Renderer.js';
import WebGLBackend from '../webgl/WebGLBackend.js';
import WebGPUBackend from './WebGPUBackend.js';
import WebGPU from '../../capabilities/WebGPU.js';
/*
const debugHandler = {

Expand Down
2 changes: 1 addition & 1 deletion examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { getFormat } from '../utils/WebGPUTextureUtils.js';
import WGSLNodeParser from './WGSLNodeParser.js';

// GPUShaderStage is not defined in browsers not supporting WebGPU
const GPUShaderStage = window.GPUShaderStage;
const GPUShaderStage = self.GPUShaderStage;

const gpuShaderStageLib = {
'vertex': GPUShaderStage ? GPUShaderStage.VERTEX : 1,
Expand Down
4 changes: 2 additions & 2 deletions examples/webgpu_instance_mesh.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@

init();

function init() {
async function init() {

if ( WebGPU.isAvailable() === false && WebGL.isWebGL2Available() === false ) {

Expand Down Expand Up @@ -87,7 +87,7 @@

//

renderer = new WebGPURenderer( { antialias: true } );
renderer = await new WebGPURenderer( { antialias: true } );
RenaudRohlinger marked this conversation as resolved.
Show resolved Hide resolved
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.setAnimationLoop( animate );
Expand Down
2 changes: 1 addition & 1 deletion examples/webgpu_loader_gltf_compressed.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@
controls.maxDistance = 6;
controls.update();

const ktx2Loader = new KTX2Loader()
const ktx2Loader = await new KTX2Loader()
.setTranscoderPath( 'jsm/libs/basis/' )
.detectSupport( renderer );

Expand Down
4 changes: 2 additions & 2 deletions examples/webgpu_morphtargets_face.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@

init();

function init() {
async function init() {

if ( WebGPU.isAvailable() === false && WebGL.isWebGL2Available() === false ) {

Expand Down Expand Up @@ -79,7 +79,7 @@

container.appendChild( renderer.domElement );

const ktx2Loader = new KTX2Loader()
const ktx2Loader = await new KTX2Loader()
.setTranscoderPath( 'jsm/libs/basis/' )
.detectSupport( renderer );

Expand Down
2 changes: 1 addition & 1 deletion examples/webgpu_sandbox.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@
textureDisplace.wrapS = THREE.RepeatWrapping;
textureDisplace.wrapT = THREE.RepeatWrapping;

const ktxLoader = new KTX2Loader()
const ktxLoader = await new KTX2Loader()
.setTranscoderPath( 'jsm/libs/basis/' )
.detectSupport( renderer );

Expand Down