Should UI5 be rewritten based on react.js?

[#1]

As Title.

[Former Member]

I believe React is the future of the frontend technology, for the following reasons:

1) component-oriented. You create your reusable UI component, which can contain other components.

2) declarative. You describe how your UI would look like, and don't need to worry about how to update a previous screen, nor about UI rendering performance.

[Qualiture]

And how exactly is the component oriented and declarative approach from React any different to the component oriented and declarative approach of SAPUI5?

[Former Member]

You can try to write a todo-list in React and in UI5 to see the difference.

In React, the only place that you draw the UI is in a component's render() function. It draws the complete UI for that component, including its sub-components (by spitting out the sub-components within HTML contents, for which the run-time will call its render() function). There is no need to just update a piece of UI fragment where the data changes.

In other words, there is no need to manipulate the DOM tree - insert something here, hide something there, etc. You just tell the browser what you want to draw.

[Qualiture]

Again, how is that different from UI5's declarative XMLView / HTMLView approach and data binding capabilities?

I *never* find myself updating the DOM, just simple declarative code like

<List items="{/}" mode="SingleSelectMaster" select="handleSelect">

    <items>

        <DisplayListItem label="{name}" value="{userid}"/>

    </items>

</List>

If my data changes, or items are added/removed from the model, the data binding automatically updates my UI and my list reflects the changes immediately. No need to do anything

[Former Member]

You mentioned a key difference here. In React, data binding is only one-way, not two-way as in UI5.

[stephen_kringas]

UI5 supports one-way, two-way, one time binding.

[Former Member]

Well, let me put it another way. React only allows one-way data binding. UI5 allows one-way and two-way. There are pros and cons for two-way binding and Facebook found it does more harm than good (for complex applications).

[Qualiture]

Two-way databinding gives me waaaay more freedom -- if I update the model, I don't need to manually update the UI / if I update the UI, I don't need to manually update the model -- so two-way binding always wins in my book.

Especially with large, complex applications.

But since I don't know everything as well I would love to see some source why Facebook has abandoned it in favor of on-way binding.

[Former Member]

https://www.youtube.com/watch?v=i__969noyAM

There is a youtub video that talks about uni-directional data flow.

[Former Member]

Components in UI5 are much more complex than components in React. Complex in the sense that you need far more stuff to create a components in UI5. In React it can be all in one file that is just Js and JSX. Much more concise that the folder-based approach of UI5.

This stems from the fact that UI5 components serve a different purpose than React components. I personally find React-style components to be sufficient for everything. I prefer them because they are far simpler.

As for declarative, there is a large difference between using an extra XML or HTML file for your markup and using JSX directly in the JS code. JSX may seem messy but it is really not. And less context switching is easily worth it for me.

Reacts development style and code organization is generally just far simpler than that of UI5. Also the documentation is much better and more complete. And it's becoming and industry standard, everyone uses it. UI5 is only used in conjunction with SAP. Why not make use of achiements others have already made?