Spliting in more components

[Maze-fr]

Hello,

As I explained in this comment, I believe it would be nicer to have more detailed / fragmented components.
Here is why I think that way...

The massive Canvas component gives a feeling of obligation to fill soooo many parameters.
This gives a feeling that this component does everything. Then, it forces the developer to create a lot of code to inject as props to the Canvas.
Impossible to know what is mandatory or not, it's very confusing for somebody who is not familiar with WebGL and / or Babylon.

Also, having a hierarchy of components is more visual to know where parameters belong to.
You know that a Canvas builds an Engine that builds a Scene. You know that this polygon has an animation bound to it, etc.
I think the best expression of that is when creating Lights and choosing to bind it to the scene globally, or to the Camera, or how you cast shadows, etc.

Aside of that, Svelte allows typing of components as HTMLCanvasElement properties (for <canvas />), so it allows to pass the usual properties to the Canvas, which will be in the instance bound to the tag.
The same can go with any component, typing it as its Babylon type to use props or subcomponents.
That way, it gives the choice to use the type properties or subcomponents.
It also allows to set some properties as mandatory for building the object behind the component.

Finally, I also think that it is a better way to build the scene, because using components with properties gives the hints of what you have to put and where to put it.
The code stay separated in the place where it's needed, and so it's also easier to debug when the code is spread is smaller units of code dedicated to one purpose / task.
If a scene fails, the components can be put in comment one by one to see what went wrong and where it went wrong.

Thank you for reading ;-)

[Myrmod]

I find it quite difficult to implement something I am satisfied with. In general it is easy to split the Canvas component, however the property handling of the default Canvas component would have to change to something like:

<Canvas
  {engineProps}
  {sceneProps}
>
<!-- Stuff -->
</Canvas>

which I personally find counter intuitiv. Since you would have to know the difference between Engine and Scene.

However, since this is nothing but an opinion of mine, and I don't really like basing decisions on opinions. I am open to implementing this in the future. If you want you surely can create a pull request. However it is required

• that the properties of the Canvas component are easy to set, without any knowledge of Engine or Scene
• that the Scene and Engine components are used in the Canvas component
• that the HTMLCanvasElement is part of the Canvas component, but can optionally be overwritten with it's current wrapper

[Maze-fr]

The point of having sub components (here Scene and Engine) is that they can have attributes, so you know more easily what conf you are doing on them.
And you see what belongs to what, because you have the component tree visual.
But for people who already did all the job in pure Babylon, the ability to pass as parameters to the Canvas make it easier to use and / or migrate.
Also... I'm thinking about it just right now... maybe setting a default Scene and Engine for basic cases could be nice.

I am not aware about the global complexity that Babylon gives us the possibility to do, so my vision may be very simple and narrowed by my limited knowledge about WebGL.