Angular vs React vs Vue [2020] | Which One Should You Choose? | JavaScript Frameworks | Simplilearn

hey everyone welcome to this video by simply learn in this session we'll be comparing the three cutting-edge ui development technologies that is react.js angular and vue we learn about the key differences that make them so distinct all of these technology stacks have been replacing pure server-side technologies and we've slowly progressed from server-side applications to more distributed applications where a part of the job is done on the client side and a part on the server side and now we've transitioned to something known as single page applications or sba and all of these technologies that you see on your screen right now are based purely on javascript as a result they're lightweight and aren't dependent on any third-party runtime tools so let's compare the three technologies and learn about the factors that make them stand out so let's see what's in it for you we learn about their features use cases and where they're applied their performance how they handle data the languages they use and the testing mechanisms we learn about the dedicated user community that backs these technologies and finally we'll see the growth curve first we'll look into the saline features now react is a front-end javascript library while angular and view are javascript frameworks now although the terms library and frameworks are used interchangeably they're significantly different now library is a set of classes or functions and the user is in complete control to call them frameworks on the other hand are like models they have limited choices and come with a blueprint of their own and as a result the user doesn't have much control so javascript being an interpreted language where code is executed line by line makes all these tools very efficient mainly because converting the code into an intermediate code would require a runtime environment and would definitely encounter a delay now these are avoided and as a result these tools are fast moving on react is used to develop mobile and web applications and angular is used for single page applications and you can also develop hybrid applications using the stack mainly because it's purely based on css html javascript and jquery single page applications as the name suggests are built using single page now the entire page is broken down into several components wherein each component performs a specific task say for example one component handles the login the other one would display icons and images and so on all these bits or components are then put together to form a single page application and moving on react was developed and maintained by facebook while angular was built by google and view was developed by evan unx google employee now react represents the view part of the mvc framework and angular is a full-fledged mvc framework in itself and view on the other hand is focused on view and the model layer of the mvc framework now what exactly is the mvc framework now mvc framework is an object-oriented design principle that mandates the separation of control meaning one thing can only do one thing so the model deals with the entity classes the data and the business logic while view deals with the representation and the ui logic of the application and the controller drives the functionality of the two any changes can be easily factored and isolated and as a result testing becomes a whole lot easier moving on now let's look at the use cases from the business perspective in terms of react we have top websites like facebook instagram netflix that use react on the other hand we have angular that is used by nike forbes sony and vue is commonly used by alibaba.com grammarly 9gag and adobe moving on we have performance now performance is a very crucial feature now the moment you build an html view and render it into the browser this view to the user is basically just html tags however if you look at the internal working the code is actually converted into a balanced tree structure this b3 algorithm is extremely fast so when the user makes any changes to the ui the changes are reflected immediately this is facilitated by the b3 algorithm so as a result the performance is improved so how does react make use of this tool it uses a virtual dom dom is an api developed by w3c it stands for document object model and defines how the document is accessed and manipulated this dom parser converts the html code into an inverse balance tree structure so react uses the virtual dom while angular uses the real dom and vue uses the virtual dom again now the virtual dom looks at the differences between the current and the previous html pages and only changes the parts that need to be updated angular on the other hand updates the entire tree structure regardless of any changes made or not and view again only updates the ones that have changed since there is no time spent on making unnecessary changes to the entire tree react is extremely fast on the other hand real dom updation is time consuming risky and error pro vue also ensures faster and bug free performance now let's talk about data binding the core reason why we would use single page applications now consider a scenario where you log into an e-commerce website as the user one then you should be able to see the items in your shopping cart while user 2 would be seeing different items in their shopping carts and so on so identifying the user and retrieving data corresponding to that specific user is facilitated using the help of data binding data binding is a process that allows an internet user to manipulate web page elements using a web browser now it is used in interactive components such as calculators tutorials games etc now react supports one-way data binding meaning you can take the data from the view and push it to the model or vice versa angular on the other hand uses a two-way data binding while vue also uses a similar two-way data binding in react every time the model state updates the view changes accordingly however the reverse is not true in case of angular any changes made to the view are immediately reflected in the model part of the architecture view follows the same principle now this hugely influences the performance due to one-way data binding react is modular and fast improving the performance angular's two-way data binding adversely affects the performance and view on the other hand performs according to the input type moving on to scripting languages react combines ui templates and javascript logic resulting in a new language called jsx so react only requires a knowledge of javascript angular uses templates again in html you can also inject javascript code into html using a clever implementation in angular called directives so you can create a class and then inject it into html angular also does something better you can also write code for an angular application using a newer language developed by microsoft called typescript it is a compiled language and is very similar to java and c-sharp in terms of syntax now vue again uses html based template it uses html5 throughout for the ui and the combination of javascript for business logic all view templates are valid html and can be passed by html parsers let's move on to testing now just is a framework or an api that is developed by facebook and is used to run tests on react applications to ensure that they are bug free now it is embedded typically in every react library and requires zero configuration now angular on the other hand uses the jasmine framework now this framework allows various functionalities to write different kinds of test cases this also ensures that the application is error free the view cli or the command line interpreter has built-in options for unit testing with the help of jest or mocha now view typically has single file components and hence these components can be tested in isolation this makes it modular and extremely fast now let's talk about community support since all these tools are open source they have a large developer community there are a few popular github repositories for react such as react.js 101 react.js.org and so on you can raise queries solve a few and connect with the larger community that's working on react here are a few repositories for angular view also has a few popular repositories you can commit download third party plugins and also explore these stacks even deeper all of them surely have a very happening community at the time of writing there were about 1 million repositories 5 million comments and 1 million issues with respect to react here are the figures for angular and here are the figures for vue according to npm stat over the past two years there have been approximately 360 million react.js downloads there have been around 38 million downloads for angular and around 63 million downloads for view now let's look at the future scope learning a new technology always comes with questions like what's in it for me what's its growth potential how far will it take me in my career and so on so let's go ahead and see the growth rate of react angular and vue according to google trends over the past 12 months react has been on a way faster upward trajectory than angular and vue which have considerably lost their momentum now this indicates that react is growing faster than the other two with respect to popularity industry adoption and community support so with that we conclude this session we've thrown in keywords like single page applications javascript component based design model view controller and a whole lot of other things so i hope this video really helped you gain clarity about these technologies thank you so much for being here keep learning and stay tuned to simply learn hi there if you like this video subscribe to the simply learn youtube channel and click here to watch similar videos turn it up and get certified click here

Channel: Simplilearn

Views: 18,716

Keywords: angular vs react vs vue, angular vs react vs vue 2020, angular vs react vs vue performance, angular vs react vs vue speed, javascript frameworks comparison, angular vs react, angular vs vue, react vs vue, react vs angular vs vue edureka, angular 4, react.js, vue.js, react, vue, javascript frameworks, best javascript framework, comparison between angular react and vue, best javascript framework to learn, angular, simplilearn react, simplilearn angular, simplilearn vue, simplilearn

Id: 9YDEfFBFipI

Length: 9min 21sec (561 seconds)

Published: Thu Sep 17 2020