public

Choosing your frontend framework

These are exiting times front-end engineers. The three biggest frameworks are all either approaching or have had major new releases. Ember 2.0 has been released a while ago, Angular

9 years ago

Latest Post Deferring decisions in Evolutionary Architecture by Tim Sommer public

These are exiting times front-end engineers. The three biggest frameworks are all either approaching or have had major new releases. Ember 2.0 has been released a while ago, Angular 2.0 is in beta mode and React released version 0.14, which is a major step on its march to 1.0.

There are, of course, many other frameworks. Some have been around for quite some time but are losing their popularity, like backbone or knockout. Others are new and exiting, like Aurelia. But if you are creating a web application today, Angular, Ember or React are the three safest bets you can make in terms of community, support and maturity.

Comparison

Emberjs

Ember is a framework that positions itself as the framework for 'ambitious' projects. What their so-called 'ambitious' projects are is not really specified though ;). but Ember has been used to create Discourse(a new take on forums by Jeff Atwood) and Ghost (a modern blogging engine). You can't get any more ambitious than those I guess :). It is worth noting that Ember has been particularly well received by the Ruby and open source community.

Building an application with the Ember framework is a lot like a building a house with Lego. You have predefined blocks that are specifically designed to build 'ambitious' web applications. You simply put them together to build your front-end, as you would do so while building your Lego house.

Ember is the best solution for those who like an all-tools-included framework approach. You will not waste time discovering, researching, and gluing together libraries that mesh well. Ember makes those decisions for you.

This means that, as a developers, when you switch between Ember projects, you immediately feel at home. Everything is the same, dramatically lowering the entry level for new developers.
The biggest downside is that you’re limited to the blocks that Ember provides. If you start trying to create your own blocks, you’re going to have a bad time.

Angularjs

Here's where Angular comes into play. It is currently the most popular framework of the three and for good reason. It has been around for the longest and represented a large improvement over the previous generation of client-side MVC frameworks. It was (or is, depending on who you ask) immensely poplar, had an enormous user base and for a brief moment, could call itself king of the front-ends.
But all of this was jeopardized with the announcement of Angular 2.0, which was a bit of a disaster. This new version would reinvent the framework itself, meaning big and dramatic changes to almost every piece of code. Reusing code from version 1.x would be almost impossible and the upgrade path would be almost impassable. Some said Angular had committed suicide.

The Angular team responded in two much needed ways. One, the upgrade path was simplified with the announcement of Angular 1.5. Two, the Angular team devised a way to run both Angular 1.x and 2.0 code at the same time. This is pretty awesome when you think of it. These two responses, in my opinion, saved Angular from a certain downfall.

Rather than a set of predefined blocks to use in Ember, Angular is more like a factory you can use to create your own Lego blocks. This makes for an incredibly powerful framework, allowing you to build what you want, when you want it and how you want it.
The downside is clearly complexity. With an almost infinite number of possibilities and components, no two projects will ever look the same. This makes the entry level for new developers much, much higher.

Reactjs

React is the lightest of the three being compared here. In fact, you can’t even consider it as a framework at all. Above all things it does one thing really, really well: render UI components. Lots of people pair React with Angular or Ember, but a more common scenario is to use it with a Flux architecture.

Flux is a different take on Model-View-Controller. Like the rest of the React ecosystem, however, it is still just a library to handle one thing. Flux complements React's composable view components by utilizing a unidirectional data flow. It's more of a pattern rather than a formal framework.

React is even further down the road in our metaphor. It is a bit like a block of clay that you can use to invent completely new blocks to build your Lego house. It's a flexible library that can be used to do simple things really quickly. But things can get messy and complex very, very quickly too.

So, which is right for me?

Firstly, it is very important to realize and recognize that your favorite tool is not always the best tool for the job. You should always take the up- and downsides into consideration when making your choice.

Also take the team that will be using the tooling into consideration. When you have a large and diverse team of contributors from all over the world – with different backgrounds, motivations and skillsets – high levels of flexibility will always end up creating immense confusion. The opinionated and 'inflexlible' Ember might be the best choice at that point.

If your building applications that require high levels of flexibility and diversity, Angular or React might be the better choice.

But let's just get one thing straight. These frameworks, whilst being used to create the same type of applications, are vastly different. Comparing them is like comparing apples to oranges. They all have a lot of strengths and are really matured as frameworks. There is no clear winner and there is no clear loser. Some frameworks will simply fit some situations better than the others.
Because of this, I suggest you learn and work with all three of them. Even if nothing else, learning all three will help you write better code, by taking what you’ve learned from each framework with you to the next one.

Tim Sommer

Published 9 years ago

Comments?

Leave us your opinion.