Day155 — ReactNative vs Flutter, Amplify vs Firebase

I researched on which cross-platform solution I wanted to use in my next project which is a offline-first mobile app. Website is only for later stage.

Pros to use Flutter

• officially support Material 3
• want to try new language (most important)

Cons

• skia engine is not that good in iOS. e.g. ui jank issue
• skia is in other world which I, as a frontend developer, won’t touch. If there is a bug, it solely rely on Flutter team to fix.
• OTA was considered, but is froze at the moment. https://github.com/flutter/flutter/issues/14330#issuecomment-485565194

Pros to use React Native

• can have nice ui kit, https://github.com/wix/react-native-ui-lib
• I know typescript
• have experience on a RN project
• Expo provides a lot of features
• can share business logic with website (not applicable to my case, I go for mobile-first)
• support OTA app update (can be most important thing for some people. it can introduce security concern. If a fix is that important, a force update mechanism (an api check upon app launch) can also solve the problem)

Cons

• compile can be challenging
• heavily rely on community library for features, such as Expo
• cannot opt out from Expo easily
• less efficient. not by much. more obvious on low-end device. but it is better nowadays. https://reactnative.dev/docs/hermes , https://youtu.be/W5HS2iaSe6s

I am still researching on which backend do I want to use. There are two candidates, AWS amplify and Firebase. Both support flutter and can achieve offline-first approach. Currently, I lean on Amplify.

Pros to use Amplify

• support GraphQL natively, provide better query experience
• offline database support by Amplify DataStore
• database type is selectable, MySQL, PostgreSQL DynamoDB(NoSQL), etc.

Cons

• aws configuration seems troublesome and complex to kickstart
• difficult to opt out from Amplify eco-system
• only Analytics, No Crash report

Pro to use Firebase

• strong integration with Flutter because it is a Google product
• can support GraphQL using Firebase Function
• offline database support
• more beginner friendly on project setup
• has Crashlytics

Cons

• Firestore is NoSQL, but object must have relationship in some degree
• difficult to opt out from Firebase eco-system

there is ui jank on iOS side.

Early-onset jank · flutter/flutter

OpenContainer jank due to multiple frames of shader compilation · Issue #76180 · flutter/flutter

Flutter team is aware of that and is implementing a solution for it in Flutter 3. The experimental rendering backend, Impeller, is not production ready yet.

What’s new in Flutter 3

video reference