iTranslated by AI

The content below is an AI-generated translation. This is an experimental feature, and may contain errors. View original article
📱

How to Identify if a Mobile App is Native, Flutter, or React Native

に公開
Android
Flutter
iOS
React Native
mobile
idea

Introduction

Technical selection, product analysis, competitor research, considering SDK implementation... there are many situations in the field where we want to infer from the outside whether "is this app native? Or is it Flutter or React Native?"

However, common "guesswork based on appearance" has its limits.

  • It is hard to tell just by the UI's look or animations (any framework can be made to look native)
  • Store descriptions and recruitment articles can be outdated or fragmentary and may not match the current version
  • Network communication and User-Agents are frequently customized, making them weak as evidence
  • Disassembling or analyzing the app's internals can be difficult from a compliance standpoint in some cases

So, what is the information that can be observed "firmly" even from the perspective of terms of use and legal compliance?
The key is the "License (Acknowledgements)" screen within the app.

Conclusion

  • Install the app on a physical device and open the "License/Acknowledgements" screen from "Settings/Info/Help," etc.
  • Pick out "proper nouns" (library names) from the list of OSS libraries displayed and determine probabilistically based on combinations of multiple traces.
  • If the screen is not found or information is insufficient, refer to structural traces in the APK/IPA as auxiliary indicators (within the scope of compliance).

Detailed specific indicators and procedures follow.

Example 1: How to view the license screen of the Matsuya Official App (iOS)

TOP Screen

  1. Open the app's hamburger menu
    Matsuya Official App TOP Screen

  2. Tap "License" (ライセンス)
    Matsuya Official App Hamburger Menu

  3. Scroll through the list on the license screen and check if Flutter or React Native libraries are included
    Matsuya Official App License Screen

  4. In this case, since Flutter libraries are included, it's clear that it is a Flutter app.

Example 2: How to view the license screen of ChatGPT (iOS)

  1. Open the iOS "Settings" app
  2. Tap "Apps" → "ChatGPT" → "License"
  3. Scroll through the list on the license screen and check if Flutter or React Native libraries are included
    ChatGPT License Screen
  4. No specific traces of Flutter or React Native are found, and since there are many Swift-based libraries, it can be estimated that the probability of it being a native app is high.

Where is the license screen?

  • iOS
    • Inside the app: "Settings", "About" → "Licenses", "Acknowledgements". Or, as in the ChatGPT example above, through the path iOS "Settings" app → "Apps" → App Name → "License" or "Acknowledgements"
  • Android
    • Inside the app: "Settings", "Help", "Info" → "Open Source Licenses", "Licenses", "Acknowledgements", etc. Many apps adopt Google's official OSS license screen, where the list and license texts are shown together

There are variations in notation such as "OSS", "Third-party notices", "Acknowledgements", or a "License section within the Terms of Service," so try multiple paths.

Actual Identification Method (Process of Physical Confirmation)

  1. Open the app and navigate to the License/Acknowledgements screen from settings, etc.
  2. Pick out proper nouns (package names/Pod names/module names) while scrolling through the list.

Names commonly seen in Flutter

  • flutter, Dart, sky_engine
  • cupertino_icons, collection, characters, vector_math, intl, etc. (pub.dev staples)
  • (Implementation Trend) Confidence increases if the app's "License" screen looks like the standard Flutter LicensePage.
    • Flutter has a mechanism to display dependency licenses all at once using showLicensePage / LicenseRegistry.

Names commonly seen in React Native

  • react, react-native (MIT)
  • hermes / hermes-engine (JS engine)
  • Yoga (layout engine), Folly (C++ library by Meta), glog (Google Logging), boost-for-react-native
  • React-Core, RCTTypeSafety, React-jsi, RCT*, etc. (tend to appear in iOS Podfile.lock or Acknowledgements)

Names commonly seen in Native

  • On iOS, there are many Swift-based libraries.
  • On Android, there are many Kotlin-based libraries.
  • Note: For example, these may still appear in Flutter or React Native apps when interacting with the native layer, so it is difficult to determine for sure based on these alone. However, if no license notation for Flutter or React Native is found, the possibility of those frameworks being used is low.

License Screens of Famous Apps

Apps are updated periodically, so be sure to check the license screen of the same version on your own device. Below are examples observed at the time of writing.

1. Discord

Discord License Screen
It contains many React Native-related libraries.
You can tell that this app is built with React Native.

2. X(Twitter)

X(Twitter) License Screen
No specific traces of Flutter or React Native are found, and it mainly consists of native libraries.
It can be estimated that the probability of it being a native app is high.

3. Slack

Slack License Screen
No specific traces of Flutter or React Native are found, and it mainly consists of native libraries.
It can be estimated that the probability of it being a native app is high.

"Additional Clues" when the License Screen is missing or weak

  • Android (APK Structure)
    • assets/flutter_assets/, lib/*/libflutter.so → Highly likely to be Flutter
    • assets/index.android.bundle (JSC) or .hbc (Hermes bytecode), libreactnativejni.so, com/facebook/react/* → Highly likely to be React Native
  • iOS (IPA/App Bundle)
    • Contains Flutter.framework / Flutter.xcframework → Highly likely to be Flutter
    • React-Core / RCT* / Folly / Yoga / hermes-engine → Strong indication of React Native

Pitfalls and Points to Note

  • Some apps have unmaintained or incomplete license screens (unfortunate, but it happens in reality)
  • In a hybrid configuration (native + some Flutter/React Native parts), traces of both will appear
  • The more corporate the app, the better the license screen is maintained, and the higher the success rate of this method

Closing

The license screen is an easy place to observe from a compliance standpoint and where framework "traces" are most likely to gather.
However, exceptions like hybrid configurations for specific screens exist in reality, so it's safer to use this as a simple identification method. Also, since apps are constantly updated, please be mindful of version dependency.

The indicators listed in this article should serve as a "minimum checklist" to standardize your investigation. If you have insights like "this app had these traces" or "I interpreted this case this way," I would be happy if you could contribute your observation notes to the following Zenn Scraps. Let's share knowledge and steadily improve accuracy together.

Summary of Development Framework Adoption Examples Used in Apps (Native, Flutter, React Native)
👉 https://zenn.dev/igz0/scraps/c873e138da9d07

Reports of misidentifications or corrections are also welcome.
Let's gather your insights and collect information about the development frameworks used in apps together!!

References

Flutter (License UI, Build Artifacts, Assets)

Android (OSS License Screen)

iOS (Generation of Acknowledgements)

React Native (Hermes and Surroundings)

Discussion