It's 2021, is it still necessary to learn Flutter?

Since the operation of mobile APP is restricted by different operating systems, most of the current mobile APP application development still needs to be developed separately for different system environments. However, in order to reduce development costs, improve code reuse rate, and reduce the workload of developers to adapt to multiple platforms, it has always been the goal pursued by the cross-platform development framework.

But at present, many developers are not sure which technology to choose to develop applications quickly and at low cost. However, if you are familiar with the history of cross-platform development, there are only two main options for cross-platform solutions in 2021. One: Flutter or React Native.

Before making a formal comparison, we need to make it clear that the two frameworks, Flutter and React Native, are both high-quality frameworks for building cross-platform mobile applications, but sometimes making the right decision depends on the perspective of business use. Therefore, we selected nine important parameters for comparison between the two:

• Who provides technical support?
• The market share of the framework.
• Dart Vs JavaScript
• Technology Architecture
• performance
• Is it developer-friendly, convenient and community support
• UI components and customization
• Maintainability of code
• Developer's work cost

Technical Support: Google VS Facebook

Behind the two frameworks of Flutter and React Native are technology giants, namely Google and Facebook, so from this perspective, the two will become more perfect in the competition in the future. After all, they have their own chain of interests behind them.

First, let’s take a look at Flutter. Flutter was officially launched by Google in 2017. It is an advanced application software development kit (SDK), including all widgets and tools, which in theory can make the developer’s development process easier And simpler. A wide selection of gadgets enables developers to build and deploy visually attractive, natively compiled applications in a simple way for multiple platforms, including mobile, web, and desktop, all using a single code base . Therefore, Flutter application development companies have a better chance to ensure that you have faster, faster, and more reliable application development solutions.

In fact, Flutter appeared as "Sky" at the Dart Developer Summit in 2015. Flutter has several major buying points: firstly, it is free and open source; secondly, the architecture is based on popular reactive programming, Because it follows the same style as Reactive; in the end, thanks to the widget experience, the Flutter app has a pleasant UI, and overall it translates into an app that looks and feels good.

Let's take a look at React Native. React Native is also a cross-platform native mobile application development framework launched by Facebook in 2015. React Native mainly uses the JavaScript development language, which is very convenient for developing applications for iOS and Android using the same code base. In addition, its code sharing function can speed up development and reduce development time. Like other cross-platform technologies, Flutter allows developers to use the same code base to build independent applications, so it is easier to maintain than native applications.

Of course, both Flutter and React Native support hot reloading, allowing developers to directly add or correct code in the running application without saving the application, thus speeding up the development process. In addition, React Native is based on a very popular language-JavaScript, which makes it easier for developers to use; React components wrap existing native code and interact with native APIs through React’s declarative UI paradigm and JavaScript. These features of React Native greatly speed up the work of developers.

Market share: the 50-50 pattern is changing

On the whole, the market shares of the two are very similar, but Flutter has recently emerged from behind. When the best cross-platform mobile application development framework used by global software development companies in 2019 and 2020, the result is that 42% of developers are more willing to stay in React Native, while 39% of developers choose Flutter. According to StackOverFlow data, 68.8% of developers like to use Flutter for further development projects, while 57.9% of developers show further interest in using React Native technology for application development.

Different market reports have different statistics. Whether Flutter and React Native are strong or weak may only be glimpsed from some market trends:

• Market trend 1: Google Trends statistics show that in the past 12 months of analysis, Flutter's search index has surpassed React Native.
• Market trend 2: The younger Flutter has a community of 168,000 members and 118,000 stars on Github, while the more mature React Native has only 207,000 members and 94,600 stars on Github.

• Trend 3: According to data from Statista, React Native is overwhelming Flutter with a 42% market share, but the gap between Flutter and React Native is getting smaller and smaller, and its market share has jumped from 30% to 39% within a year.

Language comparison: Dart Vs JavaScript

The Dart development language used by Flutter was unveiled by Google at the GOTO conference held in Aarhus, Denmark in 2011. Dart is an object-oriented, class-defined, single-inheritance language. Its syntax is similar to that of C language. Translated into JavaScript, supports interfaces, mixins, abstract classes, reified generics, optional typing and sound type system, and has AOT and JIT compilers , Dart’s biggest advantage lies in its speed. It runs twice as fast as JavaScript. However, as a newer language, developers also need to be familiar with Java or C++ application development to make it easier to use.

React Native uses the Javascript language that has been widely used in the IT industry for many years, similar to HTML JSX, and CSS to develop mobile applications. Therefore, technical personnel familiar with Web front-end development can enter mobile applications with little learning. In the development field, the JavaScript thread takes time to initialize, so React Native takes a lot of time to initialize and run before the initial rendering. However, React Native has released an upgrade line and will open the updated version in the recent open source. I believe that with React Native The release of the new version will match Flutter in performance.

Technology Architecture

Technically speaking, Flutter is definitely an advanced cross-platform technical solution. It provides a layered architecture to ensure a high degree of customization. React Native relies on other software to build reactive components and uses JavaScriptBridge to Bridge the connection of native local modules. Bridging affects performance, even with minor changes, and Flutter can manage everything without bridging.

The layered architecture provided by Flutter paves the way for simple and fast UI customization. It is believed to allow you to fully control every pixel on the screen and allow mobile application development companies to integrate overlay and animated graphics, text, video and controls without any restrictions.

The architecture of the Flutter mobile platform is slightly different from other web platforms. The common part of different platforms is the Dart part, which is the Dart Framework. The public part of Flutter mainly implements two logics: first, developers can write UI through the Flutter Ui system, and second, use the Dart virtual machine and Dart language to write logic that has nothing to do with platform resources. At the same time, this is also the core of Flutter's cross-platform, and Java programs can run on Linux, Window, MacOs at the same time, and Web programs can run on any platform similarly. Through the Dart virtual machine, the UI and the logic of the system can be written in Dart language and run in the Dart virtual machine, which is cross-platform.

React Native relies on other software to build reactive components. Its architecture is divided into three parts: Native, JavaScript, and Bridge. Native manages UI updates and interactions. JavaScript calls Native capabilities to implement business functions. Bridge is between the two. Deliver the message. There are mainly 3 threads in React Native. The main thread UI Thread in the application, the thread that performs layout calculations and constructs the UI interface, Shadow Thread, React and other JavaScript codes are all executed in this thread JS Thread.

Because it relies on other software to build reactive components, it suffers from the following at startup. The React Native runtime environment (ie Bridge) must be initialized. After Bridge is ready, it starts to run JS, and finally starts Native rendering. From an architectural point of view, Flutter does have higher performance and is more in line with the needs of current cross-platform development.

Learning costs and community support

When it comes to building enterprise applications, community support is a factor that must be checked. Both React Native and Flutter have been developed in the industry for many years, and with the support of Google and Facebook, the two giants have the latest technical updates and extensive community support. With each incremental version and technology update, the community's interest and demand for the framework gradually increase. Let us understand the situation of these two frameworks in terms of community participation.

React Native was launched in 2015, and its community has been in a growing stage, as evidenced by the number of contributors to the framework on Github. However, even though Flutter is still very young and relatively new, it is beginning to show a trend of catching up from behind.

Maintainability of code

No matter how good the application you develop, in order to make it run smoothly, continuous upgrades and debugging are necessary. Compared with Flutter, maintaining code with React Native is really difficult.

In React Native, when you develop applications that adapt to different systems, you need to write adaptation code separately, which will interfere with the logic of the framework and slow down the development process. In addition, in React Native applications, most local components have a dependency on a third-party library, so maintaining these outdated libraries is indeed a challenging task.

For Flutter, because the code logic is relatively simple and does not need to adapt to different operating systems, it is much easier to maintain the code, allowing mobile application developers to easily find problems and provide data support for external tools and supporting third-party libraries.

In addition, compared to using React Native's hot reloading feature, the time it takes to release quality updates and make instant changes to the application in Flutter is also better than React Native.

Development costs

Whether it is a start-up company or an advanced Internet company, the development cost is always something that everyone cares about. Therefore, when you choose to hire a React Native development company or Flutter application engineer, you may need to evaluate their rates. Different places have different development costs.

Therefore, before officially launching the project, whether it is Flutter or React Native, you need to consider the quality of the developers, such as experience, professional knowledge, project handling and other development cost issues to evaluate the actual hourly expenses of the developers. The following are Flutter and React A development cost issue of Native.

In addition, when choosing between Flutter or React Native, we also need to consider their custom development capabilities.
Both Flutter and React Native have their own set of UI components and gadgets. Moreover, Flutter is famous for its beautiful UI native widgets, which are rendered and managed by the graphics engine of the framework.

React Native only provides basic tools to adapt to the platform, such as buttons, sliders, loading indicators and other basic components. If you need to develop complex functions, you need to use third-party components.