Component - Add support for componentization in the renderer

[ylfq]

Description

Add support for componentized code to nodes, use lifecycle and event-driven for better code management.

Solution

Use components to manage your code, like this.

Alternatives

It's very inconvenient to wrap all the componentization logic into methods and then call them manually, so I tried modifying the code of Object3D and Renderer to support componentization

Additional context

No response

[mrdoob]

Why does this need to be built-in?

[mrdoob]

Can you create a jsfiddle that showcases your proposal better than these two screenshots?

[ylfq]

Can you create a jsfiddle that showcases your proposal better than these two screenshots?

Okay, I'll get back to you after uploading the example

[ylfq]

Can you create a jsfiddle that showcases your proposal better than these two screenshots?

Currently, only WebGLRenderer is supported, and WebGPURenderer is not yet fully adapted
jsfiddle: https://jsfiddle.net/ylfq__/jcdpk0na/8/

[mrdoob]

	onLoad() {

		console.log( `${this.obj.name} loaded` );

	}
	onUpdate() {

		// console.log(`${this.obj.name} update`);

	}
	onEnable() {

		console.log( `${this.obj.name} enable` );

	}
	onDisable() {

		console.log( `${this.obj.name} disable` );

	}
	onDestroy() {

		console.log( `${this.obj.name} destroy` );

	}

Are these all the needed callbacks for this?
Would people need more like onAdded, onRemoved, onHover, onClick, onDrag, ...

[mrdoob]

More questions...

• When is onLoad called?
• When is onEnable called?
• When is onDisable called?
• When is onUpdate called?
• When is onDestroy` called?