Often the risk you take is down to choosing whether to use Angular or React for your new software application. In this webinar, we will share some key insights and risks that you may run into while making your choice. Our panel will place Angular and React head-to-head and make it easy for you to make your choice.

1. © 2018 Synerzip, LLC. | Confidential
Webinar
Angular vs. React
Don’t roll the dice
Presented by…
Yogesh Patel, Director of Engineering
Pankaj Parkar, Technical Architect
and Mike Watson, VP of Engineering

2. © 2018 Synerzip, LLC. | Confidential2
• It's a library to build cross platform UI, open sourced by Facebook
• Based on Components, State and Props
• Unidirectional data flow
• Super fast Virtual DOM diffing algorithm
• JSX to compose Components
• CSS in JS for UI and State Management tools like redux, mobx, etc
React

3. © 2018 Synerzip, LLC. | Confidential3
• It's a Framework to build a web application, open sourced by Google
• Follow MVC architecture by design
• Unidirectional data flow
• Two way data binding
• Dependency Injection
• Build tool chain already in place - Angular CLI
• Compiler, Forms, Router API, etc.
Angular

4. © 2018 Synerzip, LLC. | Confidential4
Traditional UI Architecture
Model View
Controller
State
Javascript
CSS
HTML
UI Library /
Framework

5. © 2018 Synerzip, LLC. | Confidential5
• Easy To Learn
• Could take week or two
• JSX and Components - state and props
• Steep learning curve
• Could take month
• Component architecture and Angular
Fundamentals
Learning Curve
React Angular

6. © 2018 Synerzip, LLC. | Confidential6
• Based on Virtual DOM
• Minimal DOM manipulation
• Useful lifecycle hooks for optimization
• Lazy and Suspense for Code Splitting
• Angular is 5x faster than AngularJS(1.x
version)Super fast in view update
• Lifecycle hooks and change detection
variation for optimization
• Lazy loading for modules based on
routes
Performance
React Angular

7. © 2018 Synerzip, LLC. | Confidential7
• Stable JS library, more than 4 years now
• Strong community support for web and
mobile
• State management with one way data
flow
• Newer version is more than 2 years old
• Strong community support for web and
mobile
• Angular 2+ versions are smooth and
backward compatible
Stability
React Angular

8. © 2018 Synerzip, LLC. | Confidential8
• It’s View library, Component maintain its
own state and UI
• One way data flow to make JS code
maintainable and bug free
• It’s MVC framework, better separation
of concerns
• Angular CLI ensures the folder structure
and guideline are taken care.
Maintainability
React Angular

9. © 2018 Synerzip, LLC. | Confidential9
• Component based architecture
• One way data flow
• JSX to compose components
• 0 DOM interaction
• Component based architecture
• Application can be divided into multiple
modules and sub modules
• Directive helps adding behavior on top
of DOM
Scalability
React Angular

10. © 2018 Synerzip, LLC. | Confidential10
• Stable open source community
(awesome-react)
• Few example: react-router, redux, mobx,
react-bootstrap, material-ui,
react-native-base, react-navigation
• Offers everything out of the box routing,
i18, compiler, forms, material, etc.
• All the API’s are actively maintain by
Angular Core Team.
• Third party UI library exists like
devexpress, kendo, etc.
Ecosystem
React Angular

11. © 2018 Synerzip, LLC. | Confidential11
• Any choice for unit testing e.g. Jest,
Jasmine, Karma, etc
• Selenium for end to end testing
• Can use Jasmine, Karma, Jest, etc for
Unit Testing
• Protractor for end to end testing.
Testability
React Angular

12. © 2018 Synerzip, LLC. | Confidential12
Summary
Facebook
1 way
Virtual DOM
Redux/Mobx/Flux
MVC
JS + Jsx
Google
2 way
Regular DOM
Service / ngRx
Just View
Html + TS
Backed By
Binding
DOM
Application Logic / State
Architecture
Templating

13. © 2018 Synerzip, LLC. | Confidential13
Conclusion
• It's completely dependent on nature of project and team confidence
• Team Collaboration
• Small Teams
• Large Team
• Angular and React are awesome concept and great experience to build UI

14. © 2018 Synerzip, LLC. | Confidential14
Questions?
Please type your questions
into the chat box.

15. © 2018 Synerzip, LLC. | Confidential15
Mike Watson
VP of Engineering
mike.watson@synerzip.com
Phone 917-573-2878

16. © 2018 Synerzip, LLC. | Confidential16
Synerzip
Your trusted partner for
Agile software product development.
• Accelerate the delivery of your product roadmap
• Address technology skill gaps
• Save at least 50% with offshore software development
• Augment your team with optional on-site professionals

17. © 2018 Synerzip, LLC. | Confidential17
Who is Synerzip
Synerzip is your Agile software product development partner
500+
strong team
Dual-Shore
matured delivery model
110+
product success stories
Inc. 5000
awarded Inc 5000 6
years in a row
14+
years in business
50%
savings from
optimized delivery
DNA
a truly agile product
development partner
2X
accelerate product
roadmap

18. © 2018 Synerzip, LLC. | Confidential18
Proud moment…
…100 more

19. © 2018 Synerzip, LLC. | Confidential19
Next Webinar
Creating Chaos...Engineering
Wednesday, November 28
@ 1pm ET | Noon CT | 10am PT
Shahzad Zafar
Vice President of Engineering at Rx
Savings Solutions

20. © 2018 Synerzip, LLC. | Confidential© 2018 Synerzip, LLC. | Confidential
Texas
4100 Spring Valley Road
Suite 308
Dallas, TX 75244
Tel: +1.469.374.0500 | Fax: +1.469.322.0490
Silicon Valley New York
India
3rd Floor, Revolution Mall,
Above Big Bazaar, Kothrud,
Pune, India 411 038
Tel: +91.20.67283222 | Fax: +91.20.67283222
sales@synerzip.com