React is a JavaScript library widely adopted for its ease of use and productivity boost while developing frontends. With a huge list of features and millions of developers using it to create industrial level websites even for the Fortune 500, React definitely is one of the big fishes out there. With that being said, like any other JavaScript framework, react also comes with a lot of issues. Today we are going to take a look at some of the advantages and disadvantages of React.
Advantages of React
React is a framework that is being used by millions of applications all over the internet. It is one of the most used JavaScript libraries ever created. So, it definitely has a lot of advantages to be given the privilege.
1. Easy to learn
React is comparatively easy to learn. Compared to other frontend frameworks such as Angular, React is one of those libraries which you can master within a matter of months. Even within weeks, you will be able to create a basic React application that is completely functional. Unless you want to get into the depth of the most advanced features, you will be able to create pretty big React applications even with the basic knowledge. Frameworks such as Next.js that are built on top of React makes the process even easier and productive.
2. Reusable components
Like most of the modern frontend frameworks, React let you use the components as many times as you would like without having to create a duplicate. You can organize your code in small reusable components which can be included in any template. To manage the dynamic parts, React lets you use states and props that you can pass to these components. The target component will be rendered based on the props you provide, making sure that you can implement the same component anywhere you would like with dynamic parts.
3. Automatic re-renders
React makes use of states. As soon as one of the states which is being used by a certain component changes, it will be re-rendered to update the DOM. The developer doesn’t have to do anything apart from the logic to change the state to make the changes visible in the DOM. There are even more advanced features such as memoization, hydration, and contexts, making React one of the most powerful frontend libraries even for the biggest and complex applications.
4. A huge community and libraries
Because React is pretty matured, there are millions of developers and thousands of libraries available, which will be extremely beneficial in the long run. No matter what type of function you want to implement on your website, there will be most probably a library made by the community for the same purpose. This saves a ton of time, which you would have spend on developing everything from scratch. The huge community around React will answer any of your questions regarding the library. It will be very hard to come across a problem that none of the React developers didn’t already.
5. React is pretty fast
Even after being in the industry for years and many faster frameworks coming into existence, React is still one of the fastest libraries out there. With the help of supporting libraries, you can make React extremely fast with the features such as server side rendering and caching. React itself will add some considerable amount of JavaScript to your codebase. But it is negligible, especially considering the ease it provides in developing and maintaining applications. Because the modern systems are well-capable for handling that extra load, it doesn’t matter much.
Disadvantages of React
Even though React is popular, there are a lot of things that make people choose other JavaScript frontend libraries or frameworks over it. Here are some of the React disadvantages.
1. Big bundle size
Unless you optimize your code before deploying it to the production, React applications can be pretty big. Even if your project just has a couple of pages, React still has to inject its base code in order for the application to work. This won’t be a problem for smaller projects with smaller user base. But for big companies with millions of simultaneous users utilizing the application, speed could be a big factor, which is directly dependent on the amount of code. There are a lot of newer, modern frameworks that focus on smaller bundles and provides almost all the features as React.
2. Doesn’t use the native HTML
React depends on the JSX format, which is slightly different from the native HTML. So if you are to build your entire application in React, and sometimes in future you decide to migrate to the native HTML, things are going to take a little while to migrate. Even though there are compilers which will automatically do this for you, things might break during the transition. Frameworks such as Vue, and Svelte has a much closer structure to the web standards. Apart from that, the learning curve to understand JSX could also be a disadvantage.
3. Breaking changes
Even though React is a pretty mature JavaScript library, there are still some breaking changes that are being implemented frequently. If you just want to stay in the current React version that you are using, you are probably safe. However, if you want to migrate to the next major release, things may not turn out well for you. For some, the rapid development could be considered as an advantage, but for larger projects that heavily depend on most of the advanced features that React offers, updating the React versions to the latest could be troublesome.
4. SEO
Unless you choose an additional Framework that is built on top of React which is SEO friendly, React in itself is not going to be very search engine friendly. Because everything is done after the page has been loaded, the search engine bots will not be able to understand the content of a React web page. Frameworks such as the Next.js tackles this issue by implementing server side rendering. So if you are planning to use React to create a website that focuses on search engine traffic, you should probably go with such a framework. If you are just building a web app where SEO doesn’t matter much, you are good.
5. It is a library, not a framework
While the competitors such as Angular providers a specific set of structure and instructions to develop an application, React provides too much freedom and unlimited choice. This is both a good thing and a bad thing. The bad thing is that the freedom could lead to much more bugs and difficulty for the developers to work together. The lack of a standard way to do a specific task could create chaos. So, you should have an extremely integrated workflow where all of your developers understand each other while working on a big project. Also be sure to check the advantages and disadvantages of JavaScript as it will also apply here because React is built on top of that.