WebGPURenderer: Add timestamp queries support in WebGPU

[RenaudRohlinger]

This PR add support for timestamp queries to monitor WebGPU performances. (Requires Chrome 121)

In my opinion this feature should be included OOTB in the Renderer, it will be really useful to compare WebGPU vs WebGL performances and is optional (disabled by default). I will add WebGL fallback via EXT_disjoint_timer_query_webgl2 in a second time.

The monitoring of performances can be enable with:
new WebGPURenderer( { trackTimestamp: true } );

Also improved the info system and honored all render calls to be async as they should (render() is async).
honor async render and move to renderer await functions

Live demo:
https://raw.githack.com/renaudrohlinger/three.js/timestamp-queries/examples/webgpu_compute_particles.html

This contribution is funded by Utsubo

[sunag]

I think we could standardize async functions like compileAsync and do the same in renderAsync() and computeAsync(), they last are just asynchronous because they need to wait for the device to initialize.

I think we can get users used to using the suffix at first even if renderAsync() returns the render() function for now, this would make it easier for us when we change.

/cc @Mugen87

[RenaudRohlinger]

Make sense.
Added the new Async syntax.

Everything is now computeAsync and renderAsync and there is now some getters that simply call the async methods. For example:

get render() {

return this.renderAsync;

}

/cc @sunag

[LeviPesin]

Shouldn't it be Timestamp instead of TimeStamp for consistency? /ping @RenaudRohlinger

[mrdoob]

Yep! 👍