Using solid as the main DOM engine in Atom (replacing etch)

[aminya]

Plan

I plan to use solid for Atom projects. Atom has its own DOM library called etch, which is used in the core of Atom as well as many of its packages. etch has some limitations, it has an average performance, and forces a certain style of programming.
https://github.com/atom/etch

Implementation

To make the transition seamless, I want to make a drop-in replacement library that uses solid as its backend but has the same API as etch.

The documentation of etch gives an overview of the API
https://github.com/atom/etch
These are the source code of the API (initialize, update, destroy):
https://github.com/atom/etch/blob/master/lib/component-helpers.js
and here the dom function:
https://github.com/atom/etch/blob/9b90d6ad88b90b8a273992c540879b915d9967a2/lib/dom.js#L4

P.S: The other approach is to use meta-programming to transpile etch code to solid code. However, this can be complex, but I am open to that approach too. Something like this babel plugin or this transformer

Benchmarks

In the benchmarks, etch is behind solid so this can be beneficial in general (~25% improvement). This can enhance the responsiveness of the editor.
https://krausest.github.io/js-framework-benchmark/2020/table_chrome_84.0.4147.89.html

The last dramatic change for improving the performance happened back in 2017 by introducing etch. Now it is the time to replace that with a faster modern framework. Even if we do not use it for text rendering, other parts of the Atom can benefit from it.
https://blog.atom.io/2017/06/22/a-new-approach-to-text-rendering.html
https://blog.atom.io/2018/01/10/the-state-of-atoms-performance.html

P.S:

• I have made an issue in the solid framework: Help in making a etch-solid library solidjs/solid#206
• etch was removed last month from the benchmarked frameworks due to its inactivity

[aminya]

I have made a demo of this etch-solid library:
https://codesandbox.io/s/etch-solid-pwonz?file=/src/index.jsx

[DeeDeeG]

I want to register that I've seen this PR issue but feel unqualified to give proper technical feedback or input. If somebody more versed with JS could take a look, they'd have my appreciation.

As with any performance increasing change, if this is faster and not buggy, then I don't see why not.

@aminya if you can direct me to some specific things to test, I should be able to contribute testing if/when I get the time. (Probably not this week!)

[aminya]

The discussion is being followed here: solidjs/solid#206

[aminya]

I made a repository to make the ideas more solid :)
https://github.com/atom-ide-community/etch-solid

[jeff-hykin]

I'm very picky about my frontend frameworks, but no-vdom + jsx ❤️ I'm basically already sold on the switch.

[aminya]

etch solid is written and if you notice it is a tiny wrapper around solid. I have made etch-solid to be as backward compatible as possible.
https://github.com/atom-ide-community/etch-solid/blob/master/src/index.ts

The remaining are these:
https://github.com/atom-ide-community/etch-solid/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc

etch-solid also does not have manual scheduling like etch does.