Popular cross-platform conception could not be ignored by industry monster Google. So, React Native got his maybe main competitor for now.

Flutter is attracting a lot of attention from all the developers and customers. Many technological meetups, conferences and talk shows are referring to this particular cross-platform. The number of Flutter mobile apps in AppStore and Google Play have been increasing more and more.

Open-source developing framework for mobile applications also known as Flutter is utilized as a developing platform of mobile applications for Android and iOS. Flutter uses Dart as the programming language. You can start to meet Flutter from its home page or FAQ.

History

The first version of Flutter was known as “Sky” and ran on the Android operating system. It was revealed at the 2015 Dart developer summit, with the intent of being able to render consistently at 120 frames per second. During the keynote of Google Developer Days in Shanghai, Google announced Flutter Release preview 2 which is the last big release before Flutter 1.0. On December 4, 2018, Flutter 1.0 was released at the Flutter Live event, denoting the first stable version of the Framework. On December 11, 2019, Flutter 1.12 was released at the Flutter Interactive event, it was announced that Flutter was the first UI platform designed for ambient computing.

So, Flutter is considered as comparatively new platform, despite this, there are many famous companies who have already used this platform for their solutions, among them: Alibaba Group, Tencent, Abby Road Studios, BMW, Groupon, CapitalOne, Square, Ebay, EMAAR and, of course – Google. Thus even being new Flutter has influenced the market and has grabbed the space in the app development industry.

The developing platforms of Flutter are: Windows, MacOS, Linux.

Flutter is used to develop applications for Android, iOS, Windows, Mac, Linux, Google Fuchsia and the web.

It is interesting to know that Flutter UI elements follow specific guidelines. Flutter is freebie and open source product. Architecture based on reactive programming. Flutter is highly customizable and have fast widgets. Dart, which is used in developing, is objective-oriented programming language. The C++ rendering engine is used in it.

Advantages of using Flutter

Main but not unique advantages, which are true for almost every cross-platform frameworks:

• Faster Development
• Simultaneous App Updates on Android and iOS
• Easier to Maintain and Develop New Features

All of the advantages above arise due to the main feature – same code. Developers can use the same code base for both Android and iOS apps.
The flutter development process requires less coding, and thus, one can launch faster. If developer need to add/modify feature during the maintenance, he/she just has to make it in one place for both the platforms together.

1. High Performance. Performance of an app is very important always. Main factors impact the performance: response time, CPU usage, frame number, request number, etc. Flutter offers stable 60fps, that is the rate at which synchronously screens display a clear and smooth picture. Compared to React Native and Xamarin, Flutter framework is ahead.

2. Hot reload feature. Flutter’s architecture has hot reload function, Just-in-Time (JIT) compilation, which allows developers to observe any change made to the code in real-time. So, no one need to re-start the app to carry on after every code modification. Updated source code can be inscribed to the app in functioning condition.

   The widget tree is automatically created by Flutter to provide the real-time. The hot reload feature makes the process speeding and improved. Developers can test new features, catch the bugs before they appear, get UI refreshed during the process without any hassle. Immediate updates is very convenient feature for devs, of course. Consequently, improved productivity assists with fast iterations.

3. Easy to learn. Dart is simple to learn. Developers with little coding knowledge can start to develop prototypes and apps with Flutter framework. Sometimes you don’t need any mobile development experience to use it. But, in any cases, it would be problematically to create and distribute mobile application, even if not native, without deep knowledge of all the aspects of mobile apps development process.

   Moreover, Google is popular for developing well-structured and detailed documentation, which is something that React Native has an issue doing. You can go through these documents as well as video lessons and Codelabs’ practical lessons. Courses are available on Udacity and Udemy, and you can even join many Facebook communities.

4. Perfect for MVP. The app developed using Flutter looks native on both the platform Android and iOS. If one business wants to present its products in a short time, then Flutter can be right solution. This feature provides an idea to the investors about the final look of the app.

   It would cost much more, if you have to develop two separate applications for Android and iOS from the beginning.

5. Widgets. Flutter offers ready-designed Widgets for the look and user interface. Regardless of the size of the screen Widgets look natural, easily customizable, fast and extensible. Widgets are an absolute declaration of the user interface, unified object model that can be used for the app itself and for the entire screens. While other frameworks have separate layouts, views, view controllers. widgets as a unified object model.

   Flutter’s unified object model gives the opportunity to have every object (fonts, buttons, paddings, etc.) as widget. Developer can combine widgets to form layouts, and you can decide to utilize widgets on any customization level.

   But this tool has disadvantage as well, to be described further.

6. Future-proof: Instant Fuchsia Support. Do you know about new and promising operating system Fuchsia from Google?

   There is contradictory info today what this OS can be and what is for, but there is probably that Fuchsia OS will replace Android in future. It is interesting that Flutter is a native framework for Fuchsia applications. If you decide to develop an application in Flutter, you will be ready to release it on Fuchsia from once it becomes actual. This can give your product an early adopter boost.

Disadvantages of using Flutter

1. Still Only for Mobiles. Flutter can only be used for mobile applications development. Flutter is not supported by web browsers now.

   But looking at the roadmap of Flutter, we shouldn’t wait long for support for desktop and web applications.

2. IOS problems. Flutter for mobile development has been created by Google. Google is the main competitor of Apple. Google has a direct interest in the quick fixing of bugs and making updates for Android. IOS developers worry about iOS support by Google Flutter not without reason.

   For example, IPhone settings were created on the framework to allow for possibilities of Cupertino widgets. But these and other design features were updated later and were based on iOS 10 features even though iOS 11 had already been released for a while.

   It is fair to assume that Apple, for its part, is entitled to update often both the policy and implementation of its mobile platform. Thus, Flutter realization is always in state of the catching up with changes.

3. No third-Party Libraries. Third-party libraries play a significant role in automating software development for developers and relieving the requirement to program everything from the start. Though Flutter offers several important libraries but still lacks some functionalities which are required for the development process. Even if you have required libraries declared by Flutter, it is the high risk available that these libraries were well-tested. Sometimes, there is no other option for developer than start to invent the wheel again.

   Flutter official resource of free packages is still improving, and its tool list is still experiencing growth.

4. Massive Size of the App. The framework Flutter could disappoint developers after the “Hello world” app got to 5Mb. For example, in comparison with Kotlin that is 550Kb and native Java that is 539Kb. But Google is working hard in optimizing the size.

5. Stability Problem. Flutter is new, and its instability is natural. Many developers complain about the failure to work out changes in the user interface of Android and iOS. Many frustrating small unexpected issues occur from time to time.

6. Widgets. Widgets in Flutter arranged in trees, which helps in rendering, but can lead to excessive complexity of the structure. Not trivial applications can need many layers of code to form a basic object. Therefore, adequate planning of the structure is essential in advance.

Some words about Dart

Dart is used for Flutter’s development and has both advantages and disadvantages. It is object-oriented programming language. Though, without fear or favor it is not as great as programming languages like Java orC#. It is not natural to start developers’ career with Dart, so it can be not easy to find new Flutter developers for your team. Experienced developers who tried to learn Dart usually have mixed impression…

Conclusion

Should be noticed as usually for any known cross-platform frameworks: you will get your app faster, you will save your money, you will be able to validate your business idea quicker. These are true very much in case of MVP development. But if you plan to implement many platform-specific features or different UIs for both platforms you will lose all the advantages of that framework.

There are some specific advantages of using Flutter. Hot reload, widgets, Google’s strategical plans would be very attractive for developers and designers.

Disadvantages must be taken into consideration too. Both parties Business Owners and Developers will not like instability, iOS problems, the unsupporting web. If these can be acceptable – well, if not – try to believe in Google and just wait for future upgrades or use other cross-platform frameworks or at last use Native approach.

For us in Rockwolf there is no doubt that Flutter is currently one of the most exciting tools in the market to develop mobile applications.

We advice to use it especially to e-commerce and tech-related companies and startups who want to enter the market faster and cheaper with a product that fits the definition of MVP.

React Native (RN) is a JavaScript open-source cross-platform mobile framework, designed for building truly native apps for mobile platforms (Android and iOS). It’s based on a JS library made by well-known Facebook site called React. Thus RN uses the same design as React, letting you compose a rich mobile UI from declarative components.

Main conception

React Native provides the benefits from both Native and Hybrid Mobile Apps.

RN lets you build apps using only JavaScript. However, unlike other hybrid mobile technologies you are not building Web App wrapped in a native container. JavaScript code-base is compiled to a mobile app identical to Android app using Java or iOS app using Obj-C.

Sounds a bit unreal. However, React Native allows to accelerate the building mobile applications across different platforms, thanks to the possibility of reusing most of the code between them.

In addition, at the back-end framework level, javascript (particularly Node.js) has begun to adopt event-driven architecture and models for application design. Because that kind of architecture is a programming approach rather than a language, event-driven apps can be written in any programming language. The architecture allows for minimal coupling, making it an excellent choice for modern, distributed application architectures. Aside from that, there are numerous other platforms in the market, such as vantiq, that might be able to provide visual editors, scripting editors, a rules system based on SQL and JavaScript, testing tools for debugging, tracing, and logging, and a visual tool for distributed deployment. These platforms are driven based on the events, making them effective in real-time data. If you’re wondering what is event driven architecture, you can read the blog posts that discuss about it to learn more.

History

There were many other attempts to do something similar before, for example:

• PhoneGap – implementation of native components on web technologies launched in WebView

• NativeScript – similar ideas as in React Native based on XML, JS, CSS

• Xamarin – from Mono developers for Linux, applications are written in C #, this is Microsoft’s project.

Mark Zuckerberg mentioned about idea to bet more on native instead of HTML in 2012 He promised to deliver a better Facebook mobile experience. Jordan Walke found a way to generate UI elements for iOS from a background JS thread. Then they organised an Facebook team Hackathon to work at prototype and find the solution for the ability to build native mobile applications with this technology.

React Native was developed in 2015 by Facebook team and since that time the interest in this framework was rapidly growing. Now thousands of apps are using React Native. Among them: Facebook, Tesla, UberEats, Walmart, Bloomberg.

Let’s try to review strong and weak sides of React Native.

Pluses

1. Faster development process. Let’s bring your app from specification to release in a shorter time frame. React Native uses some tricks like Hot and Live Reloading feature enables developers to refresh your emulator instantly without recompilation. We can iterate quickly. That’s important.

2. Shared code-base between both iOS and Android. Major code-base can be shared across platforms. This reduces the complexity of developing two separate native apps and keeping them synced. Developer doesn’t need to switch between Xcode and Android Studio any more.

3. More than hybrid apps. Other hybrid frameworks like Cordova or Ionic limit you to the features developed by their technologies. Some even render your entire app in a WebView. This solution does not allow to use native user interface as well as some of a mobile device functionalities available via API. But RN provides the possibility to write native code at any point.

4. Modern development tools and JavaScript features. RN development uses JavaScript development environment with all new JavaScript features. Examples of dev tools: remote debugging plugin; Inspector like in web browsers which allows to inspect elements on simulators; performance panel to help you achieve 60 FPS animations.
   Separately, I can highlight the Node Package Manager (NPM). RN developer can use this the best dependency management and ecosystem. Developer doesn’t need to download all resources on every single launch, reduces the painful workspace regeneration and sharing issues with Cocoa Pods, as well as manages dependencies with nested resolution to avoid incorrect versioning.

5. Open Source, Facebook supported. RN is built by Facebook and it is open source software. This helps the developers to suggest changes to make the app more efficient. RN is free to use. Moreover, it allows developers (look here for an example of one) to fix bugs and even add their own features while they are designing the app.

6. Strong Community. React Native has one of the most active open source communities. Professional Android, iOS, Web developers bring new development concepts, suggest solutions of the most typical problems, reconsidered traditional architecture. Useful information, tricks and tips, issues solutions are available in a wide variety.

Minuses

1. Performance still have to be considered. Using the aforesaid third-party libraries and bridges reduces a mobile app performance. In addition, smartphone memory and processor use native components, which also affects performance.

2. Longer debugging. React Native increases speed of development, but as well increases the duration of the debugging process.

3. Not really open-sourced. Yes, React Native is open-source software, but it is owned by Facebook, controlled by them. It is possible to become risky in case of some factors. Facebook can easily stop the development of React Native, can stop the support, and problems will begin. What is more dangerous – Facebook can refuse developers using their framework on their projects for some reasons. Here I can recall how it was painful when Facebook bought Instagram and closed access to it’s API for newer developers.

4. Native code still required. To use some functions like accelerometer or camera you have to use native components, so there will be a separate code for Android and IOS. Developer can use third-party libraries, but they don’t cover every native function yet. Also, bridges have to be developed to link JavaScript and native components. This can increase development time, but only in case of platform depended specific functionality.

5. Concurrency. When we want to do some heavy computation like encryption or data transformation, all user interactions will be stuck because all JavaScript code is run under a single-threaded JavaScript engine. That is not good for an app concerned with user experience. Here the developer can do some tricks with the help of JavaScript message queue, the heavy computation still awaits there and gets ready for blocking the main thread. If you’d like to learn more about thread priority in java, you can head online and watch some related tutorials or read up on the topic.

   On Cocoa, we have the wonderful Grand Central Dispatch, which abstracts thread management for us to do concurrent jobs. If we want to manage real threads on our own in RN, we can use leaking abstractions. We need to write a native module creating another JSVirtualMachine and exposes API to React Native. This can be the solution. But you should always consider performance issue in comparison between JavaScript and native solutions.

So, when it is worth

Consider these if you decide to develop in React Native

If you plan to build an app with RN and maintain it over a longer period of time, you need to prepare for more frequent updates than in native technologies (you need to update your app both when the platform has been updated and when new components have been added to React Native). This is not a disadvantage, as React Native is regularly updated and new useful components are created (monthly). But you have to remember about making more regular updates to your app. In the past developers struggled with the update process, but since version 0.59 you can make updates without any concern. Also share your plans with you mobile development partner to minimize potential risks – a mismatch between the technology and the development plans.

When is native mobile development better?

Note, that all of the recommendations below may become as less relevant as more new versions of RN are released…

1. Apps with complex user interfaces. JS allows to build fast and smooth apps. If your application’s user interface requires too much interactions, then React Native maybe not the best choice.

2. Apps that are designed for a single OS. The app will exclusively available on Android devices or exclusively available on iOS devices.

3. Media players, Utilities, complex features. Apps like antivirus software, battery monitors, media players almost always use native features and APIs provided by the underlying platform. So, such apps can be coded much more easily using native languages.

   Complex features, for example:

   • QR codes scanning
   • OCR (Optical Character Recognition)
   • AR (augmented reality) / VR (virtual reality)
   • Voice assistants

When is React Native development better?

1. Short-term game. For example, for promotional campaigns. There is no complex features and the application will not live for long, so there is no need to worry about future scale and support.

2. Convert a website into an app. RN works on JS and websites use the same technology. That’s why, if you need to create a simple application that will show the data from your website, you can easily use React Native.

3. When planning simple standard features.

Conclusion

There are very clear advantages and disadvantages to going with React Native. Performance really does matter, as do developer costs and speed of development. The decision you make will depend on the exact details of your situation. The app your building, the amount of funding you have, and the skillset of your team and future team members.

A startup is often about iterating on ideas, and you don’t know what’s going to work and what isn’t. Developing mobile apps for startups for 3 platforms is important. But one should not later realize no one wants to use them which would be a real shame.
RN is a good choice not only for small companies, but also for large ones. Remember Tesla, Walmart, and Uber Eats?
Yes, they use RN only for part of their products, but this is maybe because they are almost sure that they will have huge revenue even if they spend much for separate teams of Android and iOS developers and so make their main products slightly better for millions of users.