Month: March 2017

The Virtual DOM concept has been often emphasized for its speedy performance.

The Virtual DOM concept has been often emphasized for its speedy performance. But there is also an equally important — if not more important — property. The concept makes it possible to represent the UI as a function of its state.

https://medium.com/@yelouafi/react-less-virtual-dom-with-snabbdom-functions-everywhere-53b672cb2fe3

A very good introduction to reactive programming with Cycle.

A very good introduction to reactive programming with Cycle.js by its creator André Staltz. This is an alternative way to write apps from using libraries sch as Redux but there is also a lot of overlap. Cycle.js is an app development framework built that top of a reactive streaming library such as RxJS.

Cycle.js is a framework where your app is described as a simple function taking an event stream as input and outputting an event stream.

Cycle.js builds on RxJS and is a reactive and functional JavaScript framework. What does that mean? In the course, André Staltz, the creator of Cycle.js, will explain it to us.

https://egghead.io/courses/cycle-js-fundamentals

Thread from my email this evening:

Thread from my email this evening:

Hey – what about Angular 2 (or is that 4)? Madness. Dreadful state of affairs. The new APIs are just terrible. It’s as if they haven’t learned anything from anybody else. Nuts. I hope you’re getting to use React, Vue, etc … any of them are better.

🙂

My response:

Hehe glad I’m lot alone in that opinion!! 😁

Actually I would say that the current popularity of React is directly proportional to the number of collective hands being thrown up around the world due to frustrations with Angular2. The developer experience is terrible and we know what that means. Developers will vote with their feet and go to where the experience is more fun. No one is admitting it yet but I think Angular2 is going to face trouble.

Vuejs is without a doubt the nicest Angular 1.0 replacement and it’s also actually one of the fastest too. It’s faster that Angular 1.0 AND (naive implementation) React. I think that Vuejs is going to sneak up on the others. It’s definitely growing fast in the West but it already has a huge adoption in China (Angular is virtually unknown there). It’s an obvious destination for Angular 1.0 refugees.

I really think the Angular2 team have lost their way. So many of their decisions have only added to a learning curve which is already far too steep: TypeScript, RxJS and Routing etc. Just a great big conga line of Why? Error reporting is also astonishingly bad and completely confusing. Sometimes the error is on the build tool cli, sometimes it’s in the browser console. Whatever it is it’s going to be a long arcane stack trace and sometimes the only way to get the system to work again even after a code fix is to kill the build process and to restart it. Let’s not even go into AOT which is even harder and weirder.

I think the only win Angular2 has is raw performance. You’d expect it to be fast but my god the programming process is so damned slow. I personally feel so unproductive using it. One thing I did discover though is that TypeScript is optional. You can achieve everything in ES6. The only wrinkle is dependency injection of services which uses types in the constructor to work at what to inject. Turns out there’s a way to inject without this. I have a repo called angularducks2 (github.com/jhlagado/angularducks2) which does this. It uses yeoman rather than ngcli. I don’t hate TypeScript btw I just found it another unwelcome complexity in a system of unwelcome complexities.

My key realisation is that Redux solves everything. Use it. Unit test the reducers. Get it working. Only then should you think of writing your app in whatever framework you want. It doesn’t matter much what it is if the business logic is already tested and working. Then you just wire up you views in React, Vuejs, Angular1 or Angular2 or whatever else is the new hotness. The key thing is to not put much state into the components. If you are using the controller scope, or the component state or the data for anything other than say caching, you’re probably doing something wrong. Put it in the Redux store and subscribe to it, or use a connector like react-redux. I have demonstrated that this works pretty well by implementing the famous todolist example in Angular 1.0 (github.com/jhlagado/angryducks), React (github.com/jhlagado/reactducks) and Angular2 (github.com/jhlagado/angularducks2). Angular2 has its own Redux clone called RxJS/store but screw that. Just use Redux. Same with Vue’s Vuex. Redux is where the community is.

Of course the truly brave would be using Elm which can do it all with almost no boilerplate.