Created
December 2, 2021 03:39
-
-
Save wenqiglantz/3f1cb211e4824f935af2149b48569416 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
React | Angular | ||
---|---|---|---|
Performance | Virtual DOM allows us to update the changes without rewriting the entire HTML doc virtually. This renders updates much faster and ensures fast performance – no matter of the apps' size. | Real DOM, instead of changing just the piece of data required, updates the entire tree structure of HTML tables until it reaches the needed data. | |
Data Binding | One-way binding makes the code more stable, and also makes debugging an app build with React versus Angular app much easier. | Angular uses both one- and two-way data binding: changing data impacts view and changing view triggers changes in data. It is simpler to work with and makes the framework more flexible. | |
Component Architecture | With React, you build components that manage their own state and structure them together into more complex UIs. React is easier to grasp, but it requires multiple integrations like Redux to use it's potential fully. | Angular is a pure full-fledged framework which comes with many out-of-the-box features like RxJS, Angular CLI, Angular Universal. | |
Bundle Size | React uses webpack (splits your code into smaller parts), tree shaking, and dynamic imports that reduce the bundle size. Tree shaking (or dead-code elimination) means that unused modules won't be included in the bundle during the build process. With dynamic imports, the app loads the code needed initially--and load the rest on demand. | As part of the build process, Angular gets rid of development utilities and unused modules, then minification and compression take place to allowing the framework to perform extra optimizations. | |
Backward Compatibility | React is a library, and it has full backward compatibility. You can add different releases of the libraries to the application and update the old ones. | It’s impossible to jump from Angular 2.0 to 7.0. You need to install updates between the versions, one by one. If you plan to step-by-step enhance the project by adding new features, React is the best choice since it has absolute backward compatibility. | |
Scalability | React relies heavily on third-party tools. Yet a maintainable architecture with server-side rendering can still be easily developed with React. Facebook, WhatsApp, and Instagram all make use of React, and each of them is a large app at a global scale. | Angular comes packed with all the core features developers may need for scaling an existing app by adding new functionality. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment