Full UI widget toolkit rendering in WebGL

Question

Is there currently any full widget toolkit providing components rendering in WebGL only? Similar to the ZebraUI project, which renders a full UI component set in HTML5 canvas?

The idea is to write pure JavaScript, and still be able to shaders to render the components.

Solution

There is a new open source project which supports complete rendering of all widgets using WebGL: The DreemGL toolkit. Here is a screenshot of a DreemGL application. All UI elements are rendered using WebGL (including fonts). It's still alpha or beta quality.

Comments

[gman]

Why? you've got the entire browser to make your UI. It supports all of unicode, all IMEs for other languages, right to left languages, and it readable by various disability extensions. It's also fully styleable by designers. What possible reason would you want WebGL UI that's going to do none of that?

[raju-bitter]

Where it makes sense to fully build the UI in WebGL: Rendering highly interactive UIs at 4k with 60fps on embedded platforms (e.g. ARM based boards running in TVs, etc.); with the option to go fully 3D at some point in the future. CSS Custom Filters (aka CSS shaders) have been removed from the Webkit code base.

[alexandernst]

Also, I suspect a custom-made list widget holding 10k items and rendering only what is needed will behave a lot better than a div with overflow: auto; height: 200px; and 10k elements inside it

[trusktr]

@gman Because DOM is SLOOOOW.

[raju-bitter]

The software architect of DreemGL is working on a creative coding platform called Makepad now. Source code is on Github, here is the link to the Makepad demo. Like DreemGL, the full UI (including text elements) is fully rendered in WebGL. It's still Alpha quality software, but at some point could be used to create prototypes rendering at 60fps on smartphones like iPhone 6 or later models, as well as Galaxy S6 & Note 5 or later models.

[gman]

And has pointed out above it completely fails at supporting any non-roman languages. No Japanese, no Chinese, no Korean, no other IME support whatsoever. It's also SLOOOOW. I tried scrolling down in the text editor and it's scrolling at about 15-20fps where as this page here on Stackoverflow scrolls at 60fps