I already compared React Native to native development in my last piece, so now let’s have a look at its next competitor — Ionic React. Today we’ll focus once again on the pros and cons of both solutions and try to outline when you should choose React Native or Ionic React.
Please bear in mind that this comparison will be made primarily for the teams that use React on their frontend or have yet to determine which technology they shall go for. A general comparison between Ionic Framework and React Native I’ll leave for the next article.
What is Ionic React?
Ionic React is an official open source React version of a popular Ionic Framework that provides cross-platform UI components and native functionalities that enables developers to create Android, iOS, Electron and PWA (Progressive Web Application) apps using regular web technology in combination with React.
What is React Native?
React Native is a Facebook-backed open source technology that allows development of native-like experiences for iOS and Android using JavaScript and React. It can be utilized to either embed into an already existing native application, like in the case of Facebook and Instagram themselves, or to build cross-platform applications from scratch with no need to get involved in native development.
React Native vs Ionic React
Now, as all the required introductions are over and done with, let’s jump into the meaty part.
Ionic React Pros
As mentioned earlier, today we’re talking specifically about Ionic React considering it being positioned by Ionic as their main React-based solution and thus the pros and cons will be focused on this solution without mentioning its Vue.js and Angular versions.
Usage of ReactDOM
If you’re familiar with React development then you should also be familiar with React’s most popular rendering library — ReactDOM. Because Ionic React is based on web technology, they chose ReactDOM as their default solution in order to ensure the broadest possible compatibility with React’s ecosystem and to make sure that the majority of React libraries will work as is.
Progressive Web App (PWA) support
React Native doesn’t officially support Progress Web App development as RN’s main goal is to provide native-like experience. Ionic React, on the other hand, delivers extensive support for building PWA applications and so is the obvious choice for those companies that don’t care too much about creating that native look and feel but rather want to focus on building web applications that can also serve as mobile ones.
Ionic React Cons
But of course there are some weaknesses with Ionic React compared to React Native.
Web-first
Ionic React’s web-first approach might be seen as a positive by some but in the context of mobile development going web-first limits your ability to develop mobile applications with close-to-native performance, as well as platform-specific UIs as the UIs served by Ionic React are essentially the same.
Worse mobile performance
Due to the differences in the approaches to the development, Ionic React is not capable of providing performance that would be up to par with React Native, while React Native in turn is slightly slower than pure native development.
As a result, Ionic React is more suited for rather simple applications and Proof of Concepts.
Freemium business model
Because Ionic is a commercial technology (unlike Facebook’s React Native), and is developed for profit, some features are hidden behind a paywall with only the basic functionalities available in their freemium model. This might be an issue for some so make sure that you check their pricing section before selecting Ionic as your core technology.
React Native Cons
And just like Ionic React or any other technology out there, React Native has its cons.
Steeper learning curve
When it comes to ease of development, when using React Native it’s worth keeping in mind that unlike Ionic React which is based on the same principles as React’s web development, React Native requires a bit more understanding of native mobile development principles from a developer.
Not designed to develop PWAs
Because React Native was designed specifically for providing native-like experiences to the end users, it’s no surprise that it doesn’t officially support Progress Web Application, which as the name suggests, are web applications rather than mobile.
Slightly higher costs
Due to the differences between React and React Native, it is often necessary to have a separate React Native developer in your team. And while it’s nowhere near as costly as using the native development it still makes it a bit more expensive than Ionic React development.
React Native Pros
Fortunately the cons are easily outweighed by the pros.
Better mobile performance
Thanks to the fact that React Native uses mostly standard Android and iOS controls as well as interfacing easily with existing native UI components it is able to provide better performance than the web-first Ionic React. As we know from my comparison of React Native and native technologies, in some cases it reaches native level of performance while still being a cross-platform solution.
Shared business logic and platform-specific UI
React Native is able not only to share its codebase between the platforms but is also fit to share the business logic while providing platform-specific UIs in order to deliver native-like experience to the end users.
If your aim is to provide first-class UX and avoid maintaining separate native mobile teams — React Native is the way to go.
Far bigger open source community
React Native’s community is probably the largest of any cross-platform or hybrid mobile app development technologies. As you can see on the graph below that compares weekly GitHub downloads, React Native surpasses Ionic ekhm just slightly.
To clarify: the reason that the graph includes Ionic and Ionic Angular but doesn’t mention Ionic React is simply because every Ionic Framework solution is hosted on a single GitHub — [Ionic Framework](https://github.com/ionic-team/ionic-framework, which was renamed from Ionic Angular (Ionic’s initial popularity came from its Ionic Angular solution) and the tool I used (https://www.npmtrends.com) doesn’t seem to care about updating the name!
As for Ionic, it was their first GitHub and I thought it would be fair to show that it was previously much more popular than React Native due to being released 2 years before React Native.
When it comes solely to Ionic React, it’s being downloaded more than 18.5k times a week, according to npm’s website as of Jun 1st, 2021.
Conclusion
To sum up, both Ionic React and React Native have their pros and cons depending on your needs. If you’re looking to build a PWA application then Ionic React would be a much better choice but if you want to develop a high performance cross-platform mobile application with a native-like experience — React Native is the way to go.
Should you need some help evaluating your specific needs then feel free to drop me a line at ross@rst.software. That’s it from me today — I’ll see you next time!
.png)
