polyfill

[trusktr]

Is there a polyfill for <model>? Keith Clark's <x-model> is similar.

I'm curious as to whether it would be more worth it for the browsers to have lower-level 3D elements, for example like a-frame, LUME (my fav :D), x3dom, then a GLTF viewing component would be a composition of the lower level elements, much like how a <input>'s ShadowRoot contains <div>s, etc.

<model>
  <#useragent-shadowroot>
    <mesh has="physical-material" ...>
      ...
    </mesh>
    ...
  </#useragent-shadowroot>
</model>

If browsers are going to have standard rendering abilities in order to draw <model> elements, we may as well get the benefit of all the pieces as declarative HTML, so that we can manipulate them with Vue/React/Solid/Svelte/etc, and use the power of CSS, f.e.

<mesh>...</mesh>
<mesh>...</mesh>
<mesh>...</mesh>

<style>
  /* give all three meshes the same style */
  mesh {
    geometry: sphere(20 30 40); /*or something*/
    material-type: phong;
    material-opacity: 0.5;
    material-color: red;
    diffuse-map: url(path/to/texture.jpg);
    bump-map: url(path/to/bumps.jpg);
    /* or similar, etc */
  }

  @keyframes {...} /*animate 3D styles!*/
</style>

Maybe <model> comes first, then eventually we make it have a shadow root once we have the primitives for it, much like how back in the day we could not see the shadow root of an <input> in devtools.