White Paper Flutter vs React Native
0 likes157 views
This document provides a summary comparison of the Flutter and React Native frameworks for cross-platform mobile app development. It compares the two frameworks across several categories, finding that Flutter generally has stronger performance, documentation, built-in components, and build/release automation, while React Native has a larger community and more stability due to its earlier start date. The conclusion is that while both are good options, Flutter may be better suited for projects requiring consistent UI across platforms.
![Flutter vs react native head to toe comparison [2021 edition]](https://cdn.slidesharecdn.com/ss_thumbnails/fluttervsreactnativeheadtotoecomparison2021edition-210216110025-thumbnail.jpg?width=560&fit=bounds)
Ad
More Related Content
What's hot (20)
Similar to White Paper Flutter vs React Native (20)
Ad
More from OptiSol Business Solutions (6)
Ad
Recently uploaded (20)
White Paper Flutter vs React Native
- 1. Flutter VS React Native A comparison study on Hybrid technologies for secure mobility solution White Paper | 2020 www.optisolbusiness.com
- 2. © 2020 OptiSol Business Solutions Private Limited. All rights reserved. No part of this document may be reproduced or transmitted in any form or by any means, electronic or mechanical, for any purpose without the written permission of OptiSol Business Solutions. Any hard copies of this document are to be regarded as temporary reference copies only. 2 Flutter vs. React Native
- 3. TABLE OF CONTENTS About the Author 4 Glimpse of Cross Platform 5 Overview of Flutter and React Native 6 Flutter Vs. React Native 7 Programming Languages 7 Stability 8 Community Support 9 Performance 10 Documentation 11 UI Components 12 Build & Release Automation 13 Conclusion 14 Flutter vs. React Native3
- 4. ABOUT THE AUTHOR Broad experience over 10+ years of software development and leadership with mobility solution as passion. He has been working with OptiSol for around 9+ years as Technology Manager – Mobility practice. He can quickly design and implement solutions to bring value to any Enterprise and startup organization. Area of Excellence Mobile: Objective-C, Swift (native iPhone/iPad/ iwatch), Hybrid applications (React Native / Cordava) Cocoa Touch, cocos2d, Social Media Connect APIs, Payment Integration SDKs, iAds Analytics and performance monitoring: Google Analytics, Flury, Crashlytics, Instabugs, New Relic, Appsflyer and Mixpanel. Cloud Services: Amazon (S3 storage / Lambda scripts / Ec2 deployments), Wowza Live streaming (GoCoder / Wowza Cloud / Stream Engine). GCP (Push Notification / Storage / Database) Continues Integration: Jenkins applied with (iTunes / Fabric / Hockey) distributions. Web: Core Java, J2EE, Spring, Struts, JSF, Hibernate, Play, Microservice architecture. Flutter vs. React Native 4 Sathish Kumar | Technology Manager linkedin.com/in/sathish-chennai
- 5. GLIMPSE OF CROSS PLATFORM Flutter vs. React Native What is Cross Platform Mobile Development? Cross-platform mobile development refers to the development of mobile apps that can be used on multiple mobile platforms. It can involve a company, developing original app in a singular environment for development that will then allow the app to be sent to many different native platforms. Why Cross Platform Mobile App Development? Cross platform mobile development has multiple advantages for a developer. First of all, it allows you to reuse a significant account of code, meaning there’s less time and effort to put in. This makes the production both cheaper and faster. For a business, less time spent in development also equals to an earlier release and, in turn, quicker profits. In addition to that, releasing one cross platform app instead of multiple native apps lets them save on marketing. 5
- 6. OVERVIEW OF FLUTTER & REACT NATIVE Flutter vs. React Native 6 Flutter and React Native are both cross-platform mobile development frameworks. React Native was developed by Facebook and was initially released in May 2015. It was later discovered by a larger community and ever since, it has become mainly community-driven. Flutter, on the other hand, is considered as a newer framework; its first stable version was released in December 2018. Apps using React Native are written in JavaScript, while apps using Flutters are written in Dart. Flutter became a stable framework compared with React Native and most of the recent apps chose Flutter framework competing with performance. Title Flutter React Native First Release 2017 2015 Created By Google Facebook Technology Dart Java Script Time to Market Fast Slower than Flutter Documentation Smaller but clear and precise Extensive but bit clumsy Hot Reload Supporting Supporting IDE Support VS Code, Android Studio, IntelliJ IDEA Almost every IDE possible Native Performance Great Good Used By Google, Google Ads, Alibaba, Tencent, Hamilton Musical, JD Finance Facebook, Instagram, Uber Let’s take a look at the two competitors in this detailed overview to decide which one is a potentially better tool to develop a cross-platform application.
- 7. FLUTTER VS. REACT NATIVE: PROGRAMMING LANGUAGES Flutter vs. React Native 7 Flutter Uses Dart-Dart is fairly new. It is a language not a script, although learning curve for this language is moderate especially for experienced developers familiar with C# and Java can adopt easily. I understand that when compared with JavaScript, it requires developer to know compiler and structural language. But that’s not without acknowledging fact that it’s very easy to get started with Flutter’s demo app. React Native It works on JavaScript. It is a widely adopted language by the developers, with a lot of support from the online community and there are many apps that are able to identify in market in terms of mobile and web applications.
- 8. FLUTTER VS. REACT NATIVE: STABILITY Flutter The Beta 2 version arrived with so much of improvements and rich features. With the developer community also growing strong, Flutter will only evolve to become more stable for deployment soon. People are starting to migrate to develop the app with this framework since it has authorized community center to render the tools required to develop the expected app modules. React Native Backed by an already popular and established framework, React Native is reliable. Despite the dependency on 3rd party tools, React Native still is the more stable of the two. Flutter vs. React Native 8
- 9. FLUTTER VS. REACT NATIVE: COMMUNITY SUPPORT Flutter vs. React Native 9 The developer community is one of the crucial factors to consider here, as developers can easily adopt and share knowledge to perform expected results. Learning framework improves as more community support established. Flutter The Flutter community has been growing dynamically. There are frequent meetups, conferences, and events discussions happening in their connected community. React Native It has an edge when it comes to community support. It is older than Flutter (established in 2015) and there are tons of events and meetups happening across the world. GitHub has a React Native developer community and offline events are also organized by the community. React Native has good community support compared with flutter since it has been a long in battle, Flutter community rapidly growing with high end of organized support to the developer.
- 10. FLUTTER VS. REACT NATIVE: PERFORMANCE Flutter vs. React Native 10 Flutter It uses the Dart framework which has most of the components in- built, hence it’s bigger in size and often does not require the bridge to communicate with the native modules. In short, Flutter has everything needed for app development in the Flutter engine itself. React Native Its architecture heavily relies on JS runtime environment architecture, also known as JavaScript bridge. The JavaScript code is compiled into native code at runtime. In short, React Native uses the JavaScript bridge to communicate with the native modules. Flutter engine has most of the native components in the framework itself and it doesn’t always need a bridge to communicate with the native components. React Native, however, uses the JavaScript bridge to communicate with native modules, which results in poor performance.
- 11. FLUTTER VS. REACT NATIVE: DOCUMENTATION Flutter vs. React Native 11 The process of setting up the developer machine to use the new framework takes time. It requires lot of configuration of software installations. The technology should have proper documentation to get users up and running. Flutter The getting started guide for Flutter has detailed information on IDE setup and platform setup for both iOS and Android. You can read all the required setup details on Flutter installation for macOS here. On top of this, Flutter has a CLI tool called flutter doctor which can guide developers through the setup. There is a separate page on how to configure the editors to get going with Flutter. Once all the setup is done, we can create and run new Flutter app from CLI. React Native The documentation directly jumps to the step of creating a new project. A new React Native project can be created and run on iOS simulator using commands. There is no setup guide for Android projects in the React Native document. $ flutter create MyProject $ cd MyProject $ flutter run $ react-native init MyProject $ cd MyProject $ react-native run-ios Flutter offers better documentation and CLI support for setup and configuration.
- 12. FLUTTER VS. REACT NATIVE Flutter vs. React Native 12 UI COMPONENTS Flutter - Rich in Components Flutter framework is bundled with UI rendering components, device API access, navigation, testing, stateful management and loads of libraries. This rich set of components removes the need to use third-party libraries. React Native - Less Components Core React Native framework provide UI rendering and device access APIs alone. In order to access most of the native modules, it has to rely on 3rd party libraries. React Native is too much dependent on 3rd party libraries. Flutter rich in development APIs and UI components while React Native is too much dependent on 3rd party libraries.
- 13. FLUTTER VS. REACT NATIVE: BUILD & RELEASE AUTOMATION Flutter vs. React Native Flutter Flutter documentation for building and releasing Android and iOS apps. On top of this, Flutter has officially documented the deployment process with fastlane here. React Native The React Native official documentation doesn’t have any automated steps to deploy the iOS apps to App Store. However, it provides a manual process for deploying the app from Xcode. The process of using fastlane to ship React Native apps is described in this article. This means that React Native has to rely on third-party libraries for build and release automation. 13 Flutter has a great build automation tooling and can be used to deploy apps from the command line. React Native apps lack support for the CLI tools that are officially supported for build automation.
- 14. CONCLUSION Flutter vs. React Native 14 Having worked with both Flutter and React Native, we can say that even though Flutter is a younger framework, it does not lag behind on React Native. Both frameworks have their advantages: Weighing the result, Flutter would gain the upper hand but React Native is also an alternative. If having a consistent UI for iOS and Android is important, Flutter could be the better choice. Flutter came out as the winner in this match. Most of the industry experts have predicted that Flutter is the future of mobile app development. Considering the comparison above, it’s clear that Flutter has entered the cross-platform mobile development race very strongly.
- 15. APPLICATION MODULES: FEATURES & FUNCTIONALITIES 14 My Information My Information feature the employees to view the basic information such as Image, Employee ID, First Name, Last Name, Job Location, Designation, Email ID, Joining Date, Contact Number etc. along with quick links to the other features. Leave Management The Management staffs i.e., Manager and Human Resource team can manage applicable leave categories and number of leaves under each category here. The application shall allow the pre- defined leave categories such as Accident Leave, Annual Leave, Business Trip Leave, Compassionate Leave, Compensatory Leave, Compensatory Leave for Aura, leave without pay, Maternity leave, Paternity leave, Prepaid annual leave, Public Holiday leave and Sick Leave The employees can view their leave counts. The leave count for each employee shall vary based on their experience level. Employees can apply for leave under any selected category with reason. These leave requests can be view by approvers for the specified employee. The leave approval hierarchy shall move from immediate approver to relations officer. The Employees can view their leave history along with approval status or declination reason. The staffs with reporting levels can view the list of leave request from their team and respond to it with approval or decline. In case of decline, they need to provide a valid reason for the specified leave declination. Both the users (applying employee and reporting officer) shall get alerts on the leave respond. And the Reporting officer shall get alert on new leave requests. Also, the employees can view the list of public holidays defined by the Manager/HR team. OptiSol - an IT services firm offering DIGITAL solutions for Startups and Enterprises through custom web and mobile application design & development, Artificial Intelligence and product implementations. With presence over a decade along with 200+ smart workforce in India and global offices at US, Ireland, Sweden, Dubai and UK. Our development methodology is driven by design thinking with tools for collaboration and our key differentiator is our People. OptiSol Business Solutions Private Limited Baid Hi Tech Park, 5th Floor, Block # 38, East Coast Road, Thiruvanmiyur, Chennai – 41 +91-44-24512206 (India) | +1415-233-4737, +1908-838-0191 (USA) www.optisolbusiness.com | [email protected]