React Native vs. Flutter

Hot update support

Hot update has always been one of the selling points of RN framework, whether it is CodePush service provided by Microsoft or hot update platforms built by major companies, such as Jingdong and Ctrip in China, which have very mature RN update platforms. Google has no plans to support Flutter at all. According to the current information, JDFlutter has implemented thermal update on the Android platform, but the actual effect and flexibility of FLUTTER are still far behind RN

This is probably the main reason most companies choose to use RN. Frequent app updates can be annoying to users, and Apple’s approval process can be troublesome. RN is now used by many large apps. After all, it is a nightmare to pass app approval every time there are many business iterations.

JS VS Dart

  • RN is developed in JS
  • Flutter is developed using Dart

Development and debugging environment

  • From a toolchain perspective, both are very mature and easy to debug
  • RN is much easier than Flutter in terms of setting up a development environment, especially integrating into existing APP projects

Native mixed development support

Since RN components are originally rendered through the native UI system, it is very easy to embed RN RootView in the native page or embed native UI components in the RN page, which is very friendly to support mixed development on existing apps. Flutter has many memory and performance issues, whether it is embedding FlutterView in native pages or native UI components in a Flutter page. Currently, the Idle Fish team has more domestic practices, and has also opened the FlutterBoost project to try to solve this problem, but there is still no perfect official solution. So Flutter is better suited to use on a new APP.

Frame stability

From the team’s actual use of RN and the Flutter framework, the current stability and compatibility of RN has been greatly improved after 4 years of development and continuous iteration. There are only more than 500 open issues on Github, and many large domestic companies such as JINGdong and Ctrip are also using them on a large scale. Overall, the stability has reached the requirements of the production environment. However, due to the limitation of THE overall architectural design of RN, it still relies on native components. Therefore, with the system iteration of Android and iOS, stability and compatibility need to be continuously improved in the future. Therefore, we also recommend that large companies have a dedicated native team to maintain and optimize RN engines when using the RN framework, which can bring the greatest benefits. The version number of Flutter has been rapidly iterated to 1.7, but there are still many problems with Flutter in practice. There are still a long way to go in terms of performance and stability. What’s more worrying is that there are over 7000 Open issues on Github. In addition, there is a lot of C code in the Flutter engine, which is relatively obscure and difficult for ordinary teams to optimize for stability reinforcement.

Developer ecosystem support

RN’s Github Star has reached 80K, and there are plenty of third-party plug-ins available thanks to the React ecosystem. Companies like Microsoft, Airbnb and others contribute a lot of high-quality plug-ins, and the developer ecosystem is very robust and active. By contrast, the Flutter ecosystem is in its early stages, and while Github Star is already 72K, the overall number of third-party libraries available is not as good as RN’s. Of course, we can also see the rapid development of Flutter ecology recently. The number of public libraries available at Dart Pubs is also increasing, which can basically meet the requirements of general business development.

Full platform support

Both RN and Flutter have big ambitions to dominate all platforms. In addition to Android and iOS platforms, RN has been able to support Windows UMP, Web, Desktop, and macOS through third-party tools, and even the recent Jingdong open source Alita project has realized the connection between RN and wechat small programs. Flutter is not yet fully developed. Although it officially supports Android, iOS, Desktop, and The Web, it is not mature enough in practical tests. Hummingbird is still in its early stages, and the performance of the Web is not up to the requirements of production environments.

Native support: The connection between a native and an RN is required. That’s a native container that can support Rn to run in. You need native support to make a perfect match

Is Flutter really inferior to RN?

RN and Flutter are not technically superior to each other. They are both excellent cross-end frameworks. Although there are many problems with Flutter listed above, these are not insoluble problems, but rather problems that can be encountered by any framework in its early stages. On the contrary, IN terms of overall architectural design and overall planning, I think Flutter is better than RN and belongs to the next generation of cross-end frameworks. We expect Flutter to come into its own in a few years, when Google’s Fuchsia system is released.

RN use cases:

1. Jingdong and Ctrip are frequently used

For example, the ranking list on the homepage of JINGdong APP is made by RN, and the maintenance cost is relatively high.

2. The main reason why Airbnb gave up using React Native

React Native doesn’t provide full cross-platform abstraction, and sometimes you still need to write code individually for a particular platform. This indirectly requires their engineers to be familiar with three platforms before they can really use React Native. However, most developers are only familiar with one or two platforms, which leads to a series of problems over time.

From: mp.weixin.qq.com/s/DlzY6qxFC…

Conclusion:

  1. Both Rn and flutter require a lot of native investment, and the total investment may be much higher.
  2. When we choose the technology, we will focus on a few aspects, we will review
  • Hot update support
  • Development language JS VS Dart (Team technology stack, recruitment)
  • Development and debugging environment (Development experience)
  • Native support
  • Frame stability
  • ecological
  • Full platform support (cross-platform)