3 ms·

What I don't understand is why we don't just skip the DOM. And by that I mean, currently people are using virtual DOMs like that provided by React.js however th

by lhnz 13y ago

What I don't understand is why we don't just skip the DOM. And by that I mean, currently people are using virtual DOMs like that provided by React.js however this still has to access the DOM when it wants to render, but couldn't we rewrite a DOM/CSS renderer with WebGL (or canvas)? Or perhaps just skip that step and come up with something nicer for specific use cases. Why aren't we leaving all of this float/clear stuff behind us?

bhouston 13y ago
> couldn't we rewrite a DOM/CSS renderer with WebGL (or canvas)? Of course we can. :) But writing full UIs are tons of work. Why are there no OpenGL UI libraries in wide use on desktops? The same argument should apply to a degree? Or is it just that HTML5 is way less efficient that GUI+, Swing, etc.
- potatolicious 13y ago
  There are "OpenGL UI libraries" :P It's called OSX. The main reason why we haven't seen more is because OpenGL up until now has been largely in the sphere of gaming, where standardized UIs aren't a priority. That being said, even in gaming there are a large number of libraries available that help you implement UIs.
  - bhouston 13y ago
    Ah, cool. I'm not an OSX developer. The OpenGL UI libraries I've seen on Windows are pretty horrible/limited. Those in games are usually based on Scaleform and are also relatively limited in terms of built-in functionality, although it has wide freedom of design: http://gameware.autodesk.com/scaleform http://gameware.autodesk.com/scaleform
- United857 13y ago
  There is an experimental "render DOM content to texture" extension supported by Mozilla called drawWindow that should solve a lot of this. https://blog.mozilla.org/tilt/ https://blog.mozilla.org/tilt/ https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D#drawWindow() https://developer.mozilla.org/en-US/docs/Web/API/CanvasRende... Unfortunately it is not yet available for web content (browser extensions only).
bgarbiak 13y ago
It's an open question if Apps are more like documents, or more like raster (canvas), vector (SVG) or 3D (WebGL) graphics? I could argue that in most cases the former is the right answer. Calculating DOM is (well, I'm just guessing here) no more resource intensive than calculating word wrapping and text justification in retina quality canvas.
jkrems 13y ago
I can only speak from early teen years looking at computer game UIs. It's way harder to make a UI work in "native" ways than it appears at first sight. Especially if you do very manual rendering instead of relying on float/clear stuff. There are reasons that many people are going more and more into the embed HTML-controls into native UIs direction. One example: Your own renderer will have to handle text selection, cursor movement, and mouse interaction in exactly the way the surrounding platform does. Including things like "I'd expect Ctrl+A to jump the the beginning of this textbox".

by lhnz 13y ago

bhouston 13y ago

> couldn't we rewrite a DOM/CSS renderer with WebGL (or canvas)? Of course we can. :) But writing full UIs are tons of work. Why are there no OpenGL UI libraries in wide use on desktops? The same argument should apply to a degree? Or is it just that HTML5 is way less efficient that GUI+, Swing, etc.

potatolicious 13y ago
There are "OpenGL UI libraries" :P It's called OSX. The main reason why we haven't seen more is because OpenGL up until now has been largely in the sphere of gaming, where standardized UIs aren't a priority. That being said, even in gaming there are a large number of libraries available that help you implement UIs.
- bhouston 13y ago
  Ah, cool. I'm not an OSX developer. The OpenGL UI libraries I've seen on Windows are pretty horrible/limited. Those in games are usually based on Scaleform and are also relatively limited in terms of built-in functionality, although it has wide freedom of design: http://gameware.autodesk.com/scaleform http://gameware.autodesk.com/scaleform
United857 13y ago
There is an experimental "render DOM content to texture" extension supported by Mozilla called drawWindow that should solve a lot of this. https://blog.mozilla.org/tilt/ https://blog.mozilla.org/tilt/ https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D#drawWindow() https://developer.mozilla.org/en-US/docs/Web/API/CanvasRende... Unfortunately it is not yet available for web content (browser extensions only).

bgarbiak 13y ago

It's an open question if Apps are more like documents, or more like raster (canvas), vector (SVG) or 3D (WebGL) graphics? I could argue that in most cases the former is the right answer. Calculating DOM is (well, I'm just guessing here) no more resource intensive than calculating word wrapping and text justification in retina quality canvas.

jkrems 13y ago

I can only speak from early teen years looking at computer game UIs. It's way harder to make a UI work in "native" ways than it appears at first sight. Especially if you do very manual rendering instead of relying on float/clear stuff. There are reasons that many people are going more and more into the embed HTML-controls into native UIs direction. One example: Your own renderer will have to handle text selection, cursor movement, and mouse interaction in exactly the way the surrounding platform does. Including things like "I'd expect Ctrl+A to jump the the beginning of this textbox".