Unidirectional user interface architectures

I've taken a quick look at Cycle.js and here's what I've noticed.

It seems fun to write very small things in, but seems extremely slow. It's essentially one function per component that calls itself over and over again, rebuilding everything.

e.g. function toggleButton(responses) { let action$ = Cycle.Rx.Observable.merge( DOM.get('.btn', 'click'), DOM.get('label', 'click') );

    let requests = {
        DOM:  action$.just(false)
                        .map(toggled =>
                            h('div', [
                                h('input.btn',{type:'button'},"Click me"),
                                h('label', toggled ? "Selected" : "Not Selected")
                            ])
                        )
    };

    return requests;
}

The requests returned statement gets modified by Cycle.js & calls the toggleButton again, passing in the requests you just returned. So toggleButton gets called many many times.

It creates these objects over and over again. Also the convention is to write functionally like I did which uses many very slow operations. You'd be encouraged to use a .forEach loop over a normal for loop. You'd be encouraged to use the => arrow functions rather than creating a variable function so it doesn't have to be re-created every time, etc.

Also if you noticed, it uses jQuery style DOM lookups. One of the main reasons I like Angular a lot is because it encourages you NOT to do this. The more you have to find objects on the page given a particular Id, class, etc, assigning multiple event handlers to them, the less reusable your components become. Angular's directive is a nice abstraction of the view code while still letting you heavily modify it using Js.

One last issue I have is that it doesn't care about separation of concerns at all. It makes a point to say that they should not be separated. (The view is built using JavaScript in the methods that handle everything else). ReactJs is the same way and it has different ways you can write in actual HTML to accomplish the same thing which is a lot nicer IMO.

/r/javascript Thread Link - staltz.com