emberjs / emberjs/ember.js

[Feature] Swappable renderer

Open
#20,648 8 comments 16 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
22.6k
Forks
4.2k
Avg merge
3d 12h
Merged PRs (30d)
15

Description

Based on how much struggle I've been having with the VM latetly:
- https://github.com/glimmerjs/glimmer-vm/pull/1563
- https://github.com/glimmerjs/glimmer-vm/pull/1547
- https://github.com/emberjs/ember.js/issues/20644
- https://github.com/emberjs/ember.js/issues/20643
- https://github.com/emberjs/ember.js/issues/20642
- https://github.com/emberjs/ember.js/issues/20631
- https://github.com/emberjs/ember.js/issues/20610
- https://github.com/emberjs/ember.js/issues/20535
- https://github.com/emberjs/ember.js/issues/20628

**_And_** with the lack of ability for folks to iterate on implementing language improvements: https://github.com/emberjs/rfcs/issues/816 (not due to lack of trying, but due to how the VM is hard to work with / maybe has a lot of baggage)

**_And_** with the amount of progressing happening on an alternate renderer:

- compat todos are done: https://github.com/lifeart/glimmer-next/issues/10 (we'll see tho if it works with ember-modifier, ember-resources, and bigger projects)
- faster reactivity technique: https://github.com/lifeart/glimmer-next/issues/41 (Update-only VM)
- looks like this is a list of remaining stuff: https://github.com/lifeart/glimmer-next/issues/3

glimmer-next compared with svelte and ember

https://krausest.github.io/js-framework-benchmark/2024/table_chrome_121.0.6167.85.html#eyJmcmFtZXdvcmtzIjpbImtleWVkL2VtYmVyIiwia2V5ZWQvZ2xpbW1lci0yIiwia2V5ZWQvZ3h0Iiwia2V5ZWQvc3ZlbHRlIl0sImJlbmNobWFya3MiOlsiMDFfcnVuMWsiLCIwMl9yZXBsYWNlMWsiLCIwM191cGRhdGUxMHRoMWtfeDE2IiwiMDRfc2VsZWN0MWsiLCIwNV9zd2FwMWsiLCIwNl9yZW1vdmUtb25lLTFrIiwiMDdfY3JlYXRlMTBrIiwiMDhfY3JlYXRlMWstYWZ0ZXIxa194MiIsIjA5X2NsZWFyMWtfeDgiLCIyMV9yZWFkeS1tZW1vcnkiLCIyMl9ydW4tbWVtb3J5IiwiMjNfdXBkYXRlNS1tZW1vcnkiLCIyNV9ydW4tY2xlYXItbWVtb3J5IiwiMjZfcnVuLTEway1tZW1vcnkiLCIzMV9zdGFydHVwLWNpIiwiMzJfc3RhcnR1cC1idCIsIjMzX3N0YXJ0dXAtbWFpbnRocmVhZGNvc3QiLCIzNF9zdGFydHVwLWludGVyYWN0aXZlIiwiNDFfc2l6ZS11bmNvbXByZXNzZWQiLCI0Ml9zaXplLWNvbXByZXNzZWQiLCI0M19maXJzdC1wYWludCJdLCJkaXNwbGF5TW9kZSI6MX0=

![image](https://github.com/emberjs/ember.js/assets/199018/6fd9df96-b368-42e1-84fc-940bcc48ca94)



![image](https://github.com/emberjs/ember.js/assets/199018/80d099f5-0eca-4309-9348-592dbf56b73d)



**_And_** with the desire to use Starbeam in the future, tho no one is really working on that as I write this

**_And_** with how we don't score whell in https://github.com/krausest/js-framework-benchmark (like it or not, this is how we are judged, so we must play the game)

**_And_** since we kinda need to migrate away from a pure-JSON representation of the complied templates so that we can explore more expressive syntax (something glimmer-next is already prepared to enable)

**_And_** with the ovelwhelming effort it feels like it would take to merge the 3 repos:
- this one: https://github.com/emberjs/ember.js
- glimmer-vm: https://github.com/glimmerjs/glimmer-vm
- glimmer.js: https://github.com/glimmerjs/glimmer.js
(which honestly needs to happen anyway)

I've been wondering if we can work out a minimal public/intimate API for completely swapping out glimmer-vm / runtime such that folks can better experiment with improvements to ember.

As a quickly, barely thought out psuedo API, it could look like this, to support what we have today
```js
import { registerRenderer } from '@ember/renderer';
// idk if these are real, but not the point
import { render } from '@glimmer/vm';
import { runtime } from '@glimmer/runtime';

registerRenderer({ render, runtime });
```

which could allow for someone to easily choose to use `glimmer-next` without forking ember-source.
```js
import { registerRenderer } from '@ember/renderer';
// idk if these are real, but not the point
import { render, runtime } from 'glimmer-next';

registerRenderer({ render, runtime });
```

Or could allow someone to work on developing a _native_ renderer for iOS and Android.

```js
import { registerRenderer } from '@ember/renderer';
// idk if these are real, but not the point
import { render, runtime } from 'glimmer-android';

registerRenderer({ render, runtime });
```

------------

One may consider that we have a lot to do, and we don't have enough steam to work on anything like this (like a native renderer).

I think we have people who currently aren't contributing as much, but _would_ if they were able to, so we could enhance our parallel efforts -- widen the pipe, so to speak

------------

Note as well, this issue could also be a call-for-help to have someone dedicate a bunch of time to improve the existing glimmer-vm.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.