Why Angular? Why Not React?


A very common question. Let's search its answer.

Instead of following market trends, always choose the best technology stack based on your project requirements and business needs.

Lets discuss, why Angular and why not react.

Why Angular?

  • If you are already familiar with OOPs or you have C# / Java background and know dependency injection then the learning curve is comparatively low.
  • If your application has not a dynamic UI i.e. forms are predefined and could not change at runtime.
  • Angular is a full-fledge framework to create enterprise business applications.
  • 70% same code for Mobile App i.e. Only Html & CSS files would be separated for Web and Mobile apps and some specific modules (Using NativeScript)
  • Good separation between logic, markup, styles.
  • NgModule, Modularize approach which organize the architecture of app in a better way.
  • HttpClient Angular Module. Supports custom headers, request type, automatically parses JSON, can be streamed, piped, debounced, retry, response can be typed, returns an Observable, can be intercept (request and response), chain-able, and transformed, has caching strategies and events. Powerful and fits any type of needs.
  • The Angular Ahead-of-Time (AOT) compiler converts your Angular HTML and TypeScript code into efficient JavaScript code during the build phase before the browser downloads and runs that code. Compiling your application during the build process provides a faster rendering in the browser.
  • Why compile with AOT?
    • Faster rendering With AOT, the browser downloads a pre-compiled version of the application. The browser loads executable code so it can render the application immediately, without waiting to compile the app first.
    • Fewer asynchronous requests The compiler inlines external HTML templates and CSS style sheets within the application JavaScript, eliminating separate ajax requests for those source files.
    • Smaller Angular framework download size There's no need to download the Angular compiler if the app is already compiled. The compiler is roughly half of Angular itself, so omitting it dramatically reduces the application payload.
    • Detect template errors earlier The AOT compiler detects and reports template binding errors during the build step before users can see them.
    • Better security AOT compiles HTML templates and components into JavaScript files long before they are served to the client. With no templates to read and no risky client-side HTML or JavaScript evaluation, there are fewer opportunities for injection attacks.

Why NOT React?

  • All in one, styles, logic, html
  • At scale complex and fussy structure, no separation of concerns, prop Types, connectors, import of CSS in JS.
  • Does not have the concept of modules.
  • A lot of community libraries to learn for HTTP Calls, Routing, etc. which increase the learning curve.
  • If views/layouts have limited user interaction or simply serve static content, then implementing and using React may be more effort than it's worth.
  • React is unopinionated — meaning that developers sometimes have too much choice. There is no ideal React application setup. Every ideal React setup is subjective to its needs of the developers and project. 
  • React doesn’t have any predefined structure. This means that structuring the app is fully the responsibility of the developer, and depends a lot on his knowledge and experience.
  • As a simple library, React leaves more space for custom cases and solutions at the cost of having developers to find and implement the best solutions. It doesn’t provide state out of the box. You have to pick one Redux, MobX, etc and add it to your application. It does not provide navigation mechanism, you have to pick one from react-router, react-navigation etc.

Remember, both Angular and React are not comparable as they both have almost same Pros and Cons. Which is better for you is all depends on your project requirements and business needs. So, instead of searching Pros and Cons of Angular and React, its more beneficial for you to analyse your projects requirements in more detail so that you can choose a better technology for your project.

Note: I collect these points based on our own project requirements and business needs.

Comments

Post a Comment

Popular posts from this blog

Data Bound Controls in ASP.Net - Part 4 (FormView and DetailsView controls)

FormView The FormView control is used to display a single record from a data source. It is similar to the DetailsView control, except it displays user-defined templates instead of row fields. Creating your own templates gives you greater flexibility in controlling how the data is displayed. The FormView control supports the following features: ·          Binding to data source controls, such as SqlDataSource and ObjectDataSource. ·          Built-in inserting, updating and deleting capabilities. ·          Built-in paging capabilities. ·          Programmatic access to the FormView object model to dynamically set properties, handle events, and so on. ·          Customizable appearance through user-defined templates, themes, and styles. Templates For the FormView control to display content, you need to create templates for the different parts of the control. Most templates are optional; however, you must create a template for the mode in which the control is configur
Read more

ASP.net: HttpHandlers

Image
HTTPHandlers: ASP.NET handles all the HTTP requests coming from the user and generates the appropriate response for it. ASP.NET framework knows how to process different kind of requests based on extension. For example, it can handle request for .aspx , .ascx and .txt files, etc. When it receives any request, it checks the extension to see if it can handle that request and performs some predefined steps to serve that request. ASP.NET provides a low-level request/response API that enables developers to use .NET Framework classes to service incoming HTTP requests.So as a developer, One might want to handle some new kind of requests such as requests for .jpg or .gif. ASP.NET provides HTTPHandler to handle requests for .jpg or .gif. An ASP.NET HTTP handler is the process or endpoint that runs in response to a request made to an ASP.NET Web application. The most common handler is an ASP.NET page handler that processes .aspx files. When users request an .aspx file, the requ
Read more

The Clickjacking attack and X-Frame-Options

Clickjacking  Clickjacking is a type of “web framing” or “UI redressing” attack. What that simply means in practice is that: 1. A user (victim) is shown an innocuous, but enticing web page (think watch online video) 2. Another web page (that generally does something important – think add friends on social network) is layered on top of the first page and set to be transparent 3. When the user thinks they are clicking on the web page they see (video), they are actually clicking on the higher layered (framed) page that is transparent There are two main ways to prevent clickjacking: 1.     Sending the proper X-Frame-Options HTTP response headers that instruct the browser to not allow framing from other domains 2.     Employing defensive code in the UI to ensure that the current frame is the most top level window Using X-Frame-Options X-Frame-Options  originally invented by Microsoft for IE8, but supported by a number of browsers, this idea might have more
Read more