angular 2 vs react. what to chose in 2017?

17
Angular 2 React VS

Upload: techmagic

Post on 19-Mar-2017

153 views

Category:

Engineering


0 download

TRANSCRIPT

Angular 2 ReactVS

What do Google Trends tell us?

Angular 2 and React js trends

Angular 2 ReactVS

Version

Year of creation

Company

Size prod.

Size dev.

Language

15.4.0

2013

Facebook

117 KiB

559 KiB

JSX

2.0

2016 (1 version - 2010)

Google

144 KB

1 MB

TypeScript

Angular 2 ReactVS

Github Stars

Github Contributors

Churn

Tooling

Code Design

JavaScript “Fatigue”

DOM

60k

944

High

High

JavaScript Centric

More

Virtual DOM

55k

1569

Reduced

High

JS into HTML

Less

Regular DOM

Angular 2 ReactVSLearning Curve

Packaging

Abstraction

Debugging General

Debug Line NO

Unclosed Tag Mentioned?

Fails When?

Low

Strong

Strong

Good JS / Bad HTML

Yes

Yes

Compile-Time

Medium

Medium

Strong

Good JS/Good HTML

No

No

Runtime

Angular 2 ReactVS

Binding

Templating

Component Model

MVC

Rendering

Uni-Directional

In JSX Files

Medium

View Layer Only

Server Side

2 way

In TypeScript Files

Strong

Yes

Server Side

Angular 2 Pros

• Support for web components. Rather than having a closed system for modularising AngularJS applications, Angular 2’s foundations lie on the emerging Web Components standard. What this means is that AngularJS will be able to use directly, without any wrapper coding, any component written as a Web Component.

• Usage of Typescript. The biggest selling point of TypeScript is tooling. It provides advanced autocompletion, navigation, and refactoring. Having such tools is almost a requirement for large projects.

Angular 2 Pros

• Great performance. Angular2 - doesn't do deep object comparison. If items are added/removed to/from an array, change detection won't detect it. The same for object properties as long as they are not directly bound from the view.

• Angular2 CLI. The Angular2 CLI makes it easy to create an application that already works, right out of the box. It already follows our best practices!

Angular 2 Cons

• Difficulty in learning. If you haven't used typescript before, you'll need to learn it and spend time for it.

• Regular DOM. Angular manipulates actual DOM directly, which makes it quite slower and un-efficient in comparison with React.

• Difficulties in the server templating. Angular 2 still maintains physical separation between the JavaScript driving your application, and the HTML being rendered.

React Pros

• Total separation of data and presentation. React provides little more than a presentation layer. Although React components do have a concept of 'state', this is best used for ephemeral storage.

• Easy to start writing. Writing in React is almost similar to writing in HTML, therefore you can easily start coding, skipping all the syntaxis.

React Pros• DOM binding isn't our concern. If you've written any front-end

component, with or without a framework, in the past five years then you know the pain of binding DOM elements to functionality. Although React would handle this in much the same way, it would be split across multiple areas of the code with single responsibilities.

• React isn't a framework. React is a library which provides a declarative method of defining UI components. ReactDOM is an associated library which provides rendering and DOM diffing. Redux is a library which provides a data store, and React-Redux provides the glue between React and Redux.

React Cons• React isn't a framework.Again. Philosophy is great, but when you need to get

something done quickly, the React Way can be frustrating. If you have clients and projects and pressing deadlines and the first page of your React handbook no longer works (I've actually seen this), you can get frustrated.

• Build tools are necessary. Using build tools isn't too much of a pain, we generally use them when we work in other languages anyway. The only real issue with using them in JavaScript is there aren't standard, reusable solutions for all of your projects. This can unfortunately seriously increase the amount of time it takes to get the idea in your head into code.

• Community conventions are still developing. There are so many problems to solve and React community isn't big enough to provide all solutions.

Companies that use Angular.JS

• PayPal

• Upwork

• The Guardian

• Nike

• Google

• HBO

• Sony

• General Motors

• The entire list of companies you can find here - https://www.madewithangular.com

Companies that use React

• Alipay

• Airbnb

• Dropbox

• Facebook

• Netflix

• Reddit

• The entire list of companies you can find here -

• https://github.com/facebook/react/wiki/sites-using-react

Conclusion• React and Angular both are great technologies that give miscellaneous

opportunities in development.

• Angular 2 is on the market from 2014 comparing React in 2013, but it obvious that the first one has a bigger community. Angular launched first Angular in 2010 and in 2017 announced plans of 4th version, so we can expect future improvement of the product.

• Angular is really good at declarative solutions, but it lacks the freedom and simplicity of React.

• Finally, there is no "silver bullet", you need to choose the right solution that will suit your challenges, goals, and long-term strategy.

Have a Mobile or MEAN stack project?Contact us and we will build your own dedicated ninjas

team

Contact Us