Brief roadmap

#1

I have exciting things planned for LUME! Here are some of them:

Brief architecture roadmap:

  • Finish lume/glas WebGLRenderer (50% complete) (port of Three.js to AssemblyScript, a TypeScript to WebAssembly compiler)
  • Port features of Three.js that LUME currently uses to lume/glas
  • Add function closures, tuple types, and array destructuring to AssemblyScript
  • Compile Solid.js to WebAssembly (needs closure support or else the port will need to be converted to an entirely class-based approach without functions, only methods)
  • Port lume/element to AssemblyScript on top of lume/asdom (DOM bindings for AssemblyScript, including Custom Elements APIs) and Solid.js
  • Port LUME 3D elements to AssemblyScript on top of lume/element, compile it to both JavaScript or WebAssembly
  • Convert lume/glas Matrix4 (i.e. Three.js Matrix4) to use the web-standard DOMMatrix spec so we can get rid of conversion between CSS/DOM’s coordinate system (left-handed Y is down) and Three.js’s coordinate system (right-handed Y up).
  • ability to compile WebAssembly output to native with OpenGL bindings

Brief feature roadmap:

  • DONE <lume-shape> elements for rendering SVG paths as geometry shapes with extrusion.
  • DONE <lume-texture-projector> elements for projecting textures onto other mesh elements.
  • WIP CustomEvents for WebGL objects for interaction events like click, pointermove, etc
  • Expand lume-autolayout to 3D dimensions (think Apple’s AutoLayout VFL language but in 3D space)
  • gltf2html converter: it will take a GLTF file and convert it into HTML (using LUME elements), or at runtime it will return a DOM tree of LUME elements instead of HTML code. Prior art: https://github.com/pmndrs/gltfjsx
  • More geometry primitives (f.e. <lume-rounded-cube>, a box with rounded corners)
  • constructive solid geometry (f.e. HTML elements to describe how to add or substract 3D shapes from each other, etc)
  • declarative physics engine
  • declarative animation system
  • Ability to apply shaders more easily within markup (prior art: Qt QML ShaderEffect is a declarative (QML language as opposed to HTML) way of applying shaders).
  • New camera control elements like <lume-first-person-controls>, etc.
  • Declarative post processing effects
  • Declarative light baking
  • CSS support for applying common styles (such as materials, textures, transforms, alignment, etc) to multiple elements at once, f.e. lume-box { --material: phong; --bump-map: url(some-image.jpg)}
  • enhanced hover visualizations in dev tools (not just rectangles for blue shapes when hovering on elements in element inspector)

Future ideas:

  • How to use OffscreenCanvas in a worker for rendering?
  • How to transition 2D UIs into 3D UIs for XR mode?
  • UI component library with amazing graphics (f.e. buttons, dropdowns, etc, with iOS-like glass material, but also with lighting, shadow, reflection, and refraction).
#2

This is ambitious. Looks awesome!

1 Like