so @wbehncke and myself spent the time between christmas and new years eve working on a prototype for a complete rewrite of the Neos UI, as a separate package, written in React. Basically which was decided months ago in a hangout.
We know that on the last codesprint in Frankfurt it was decided that the update of the ember codebase is the way to go, and we respect that decision. Still, we see a lot of exhaustion and frustration of the people actively participating in the update process (myself and @dimaip f.e.). This, as well as the arguments which where written out in the refactoring RFC(RFC: JS Refactoring Process of Backend), where reasons enough for us to start writing a prototype from scratch.
We set ourselves a limit of about three days, and wanted to see how far we will come with the stack based on React/Redux. Long story short, the progress is huge, we haven’t thought that we will get that far in such a short time.
- We’ve completely written all UI components from scratch in a abstracted way
- The data-flow is based on redux(data-down-actions-up)
- The data itself is immutable, to reduce side effects and simplify the data transformations
- We’ve splitted the whole code base into three parts (Guest, Host and Shared(API))
- As you may already noticed from the wording above(Guest/Host), the target website(Guest) is loaded in an iframe, a lot of problems are solved already with this feature.
- We’ve updated Font-Awesome to the latest version, with an on-the-fly migration.
- We’ve removed all of the bloated libraries of the current Stack(Aloha, VIE and Create.js) and replaced it with a simple inline-editing expierience based on Medium-Editor - Note: This is not the final decision
- The CSS of Neos isn’t global anymore, so no side effects at all.
- We’ve replicated about 30-40% of the UI logic.
- Better performance in the UI, not only load times but also performance on low-budget PCs
- Working Page-Tree.
- Working inline editing.
- Publishing is also working fine.
A short video demonstrating the current state is located on youtube, go ahead and take a look at it!
Both of us spent about 10 workdays in total working on the prototype. Please note, this is a prototype, some things may not work, or miss some features of the current UI, we just wanted to demonstrate how far you can come with such a short amount of time with the right tools.
So why am I posting it here, you may ask.
Today Wilhelm and myself had a meeting with @robert and @christopher where we’ve presented the prototype to both of them. This was a test to see if the work would be accepted by core-members/elders, who were with Neos from the beginning.
Both were pretty stunned about the process, and we all agreed that this approach would totally be in line with the Product Vision which is currently being discussed at Product Vision Flow / Neos.
We know the fears that come with a complete rewrite, and we can understand them of course. But we need to remind ourselves that starting from scratch is not always a bad decision. Currently the ember update is in process of being worked on. I myself made the starting point for this whole thing on the second last code sprint in Nuremberg, this was in August I think(Correct me if I’m wrong).
So 5 months forward, the update is still in progress, and it seems that this won’t change anytime soon(Again, correct me if I’m wrong). Please note that we don’t want to be rude to anyone who is currently involved in the update, these are just observations we made from the distance, we know the struggle which is involved in the update, and respect the work that the people have made, but we don’t think that the update will succeed anytime soon. And even if that’s the case, we still have the problems of the iframe integration, no API surface, a bunch of libraries which bloat the current code base and so on.
- Create a separate Neos.UI package based on our work.
- Stop the current update process of Ember, and spend the energy in maintaining the current ember code base (bugfixes etc.)
- Anyone who would like to join working on the new UI package can do so, we would like to transfer the repository as soon as possible to the official Neos GitHub account
- For people who don’t know react, but would like to learn the paradigms of it etc, there will be a support channel in the official Neos slack. We also plan on giving a free React training on the next code sprint.
- Based on our estimation, the current Neos UI will be replicated before the 2.3 release of Neos.
- Until then, we will launch a public alpha/beta, and anyone who would like to test the new interface package can do so simply by installing it.
- We will make sure that no migration is needed by using the UI package, so if someone dislikes it, he can immediately switch back to the default UI of Neos.
- With publishing the next major version, the old ember code base will be deprecated and replaced by the new UI package.
- A clean code base, written from scratch without code that isn’t needed anymore
- A flexible and lean code base, with a Content-API which will be integrated soon
- A modern stack of technologies, which will attract new (Frontend-)developers
- The possibility to create an individual iPad/Android-App with React-native later on
- No ties to a big framework for extensions of the UI - Let it be inspector editors, or whole new sections in the UI. The developer should chose what type of JS framework he/she would like to use to extend the Neos UI.
- A fully customizable/themable UI, which can be extended on the fly - This is a major feature of the product vision stated above!
- A fully test covered UI package/API
- A learning curve for those developers who are not familiar with react/redux (We will help anyone who wants to learn that stuff, see the proposal above)
- Possible missing features (This should be covered as well by the public beta/transitioning process)
In the next hours/days, we will attach a voting to this topic, and hopefully in the next few weeks have a decision regarding this prototype. Again, we don’t want to back-stab anyone here, we only want the best for this project, that’s why we created the prototype.
Could anyone add a voting to this topic? It seems that I can’t create one here on discuss somehow…
[ ] Agree to the proposal
[ ] Abstention
[ ] Against the proposal