Hacker News new | ask | show | jobs
by fuzionmonkey 3810 days ago
Cycle.js has the most elegant and powerful component composition mechanism of any JS framework I've ever used. With React you have to be extremely careful in how you design components to make them re-useable and flexible.

The inversion of control that happens with Cycle.js makes it really easy to compose components together. At first it feels weird to not manually specify event handlers (e.g. onClick) in DOM-generation code, but as a result there's much less embedded opinion on how the component be should be used. Instead each component simply returns a collection of queryable observables, which is extremely flexible and adaptable.

It's also cool how components have the exact same function signature as a full Cycle.js app, so you can think of your app as being composed of several mini-apps. It's very clear Cycle.js was designed with composability in mind from the start.

2 comments

I really would like to see an article about this, can you point me in the right direction. Natural component composition(nesting) where "component" includes markup, state and events, and how cyclejs makes this better. This is the article Andre should have written btw, i think vanilla react doesn't handle this all that well and redux makes the composition story worse (composition is a non-goal of redux though) - but it is very much still a research problem
Take a look at domvm [1], disclaimer: mine. It was written expressly to allow for imperative AND declarative sub-view composition using a concise, js syntax. I used Mithril for a while before needing granular redraw and concluding that MVC wasn't the way to go.

~8k min. No build tools, no dependencies. Extremely fast [2], composable, isomporphic. JSONML [3] superset template syntax. it's plain js all the way down.

[1] https://github.com/leeoniya/domvm

[2] http://leeoniya.github.io/domvm/test/bench/dbmonster/

[3] http://www.jsonml.org/

I dont think this is the type of composition I am talking about. This composes pure views, like react, but it doesn't compose their state, same as react.
It's easy to use Redux in a composable way once you start removing imperative code in components and just make them describe what happened.

Redux-saga can glue this all together. See http://stackoverflow.com/a/34584313/82609

Thanks. I have redux-saga starred on Github but haven't looked into it at all.
I've had no trouble making components re-usable and flexible; if all externally visible parameters are passed in as props, there are no problems.

This is but one of many reasons why having all externally visible parameters be props is a good idea in React, so you should probably do it whether or not you want your components to be reusable.