A question from someone who is not a front-end developer: Would it be possible (and faster) to avoid the DOM and use Canvas to make a text editor (assuming we are happy with one font and basic syntax highlighting)?
The text font rendering in Canvas2D is slow. For example the Canvas based charting library Flot use HTML Divs overlays instead of Canvas font rendering: http://www.flotcharts.org/flot/examples/ (last link)
I think developers are still a little shy about using the Canvas for much. In my own toying with a text editor, I found the Canvas to be pretty nice. The advantage is that one needs to render just the visible lines.
With the way developers use the DOM for things like text editors, it's no wonder that they may reach the limit of the browser performance. If we add too much stuff to the DOM, the browser does not have the flexibility of just "rendering the visible lines" like we could with the Canvas. The browser has to calculate everything again.
I was recently surprised when I added 100k table rows with 2 columns in a sample, and when I clicked on a button to toggle the visibility of some list items next to the table, the browser would take a few seconds to finish processing it. Since it was a sample test using React, I thought I would try it without React to see whether the slowdown was because of React somehow. But I found out that even without React it was about the same difference.
If you notice, Atom has a hard limit on 2MBs buffers. I just created a test loading almost 2 MBs in an Atom text tab, and it indeed became unresponsive. It took forever to load and then had problem handling text editing at the end of the buffer.
I think Atom would be better with Canvas. But many JavaScript editors use the DOM and for 1,000 lines they tend to work very well. Which is generally enough for running samples and such. Another advantage of the DOM is that they could more easily embed images and have varied size text, I guess. So those WYSIWYG HTML Editors may be better served by some DOM Editor.
I guess in the future Atom could also add a Canvas editor and keep both.
That's actually the approach Mozilla's Bespin/Skywriter project took. It was shuttered when Cloud9/Ace (which render to DOM) supplanted most of its goals. I would be surprised if the performance delta of switching to canvas would actually be that large, given that using the DOM allows you to harness GPU acceleration for things like translation.
Doesn't canvas have its own GPU accelerated batched draw operations? All tast needs to be accelerated, really, is font rendering, and I would be very surprised if it wasn't.
I think this is a very good question, and the short answer in my opinion is yes, canvas rendering would make it much faster (as the guys at Flipboard have shown [1]). The downside is you would have to implement your own rendering engine from scratch which is quite challenging.
It certainly would be possible, take a look at what is done with canvas out there! But it would be a LOT of work to get the rendering right, most guys who implement "fast" text editors these days are not super intelligent hyper programmers but simply people who prefer to embed native OS text rendering views instead of inventing 10x odd gui junk on top of them.
