Are you ready to dive into the world of swift app development and explore the latest declarative UI mobile SDKs? In this article, we'll compare three popular SDKs - SwiftUI, Flutter, and React Native - and see how they stack up in terms of developer experience, tooling, APIs, and overall performance.

What Is Declarative UI?

-------------------

Declarative UI is a game-changer for developers. Instead of writing imperative code that builds the user interface (UI), you declare how you want the UI to look, and the framework takes care of the rest. This approach eliminates the need to manually manage views, layouts, and other UI-related tasks.

The App

--------

For this comparison, we've created a simple mobile app that showcases the features of each SDK. The app displays BoardGameGeek's The Hotness list, allowing users to view details of each board game. We'll explore how each SDK handles network requests, JSON parsing, list views, view/screen navigation, image loading and scaling, and complex text layout.

Prerequisites for Running The Apps

-----------------------------------

Before you start building your own apps with these SDKs, make sure you have the following tools installed:

  • Xcode 12.0.1
  • Flutter 1.20.4
  • React Native 0.63.2
  • Node.js v13.14.0
  • npm 6.14.4
  • Docker v19.03.12 (for running the server)

Running The Apps

-----------------

To run each app, follow these steps:

  • SwiftUI: Open TheHotnessSwiftUI.xcodeproj and run the project (Cmd-R).
  • React Native: Run npm install, then npx pod-install, followed by npx react-native run-ios. Launch iPhone Simulator.
  • Flutter: Run flutter run.

My Impressions

----------------

After building each app, I was impressed with how easy it was to set up and use these SDKs. Each one has its own quirks when it comes to layout and design, but overall, they're all capable of producing high-quality, native-like apps.

Composability was a major highlight for me. With all three SDKs, it was easy to build the UI as one big blob and then split it up for easier understandability and possible reuse. This is a huge improvement over traditional imperative approaches like UIViewController or Activity/Fragment composition.

More Complex Things to Try

-----------------------------

While these SDKs are great for building simple apps, they can also handle more complex tasks. For example, you could add animations, gestures, and other advanced features to enhance the user experience.

Send Feedback

--------------

We'd love to hear from you! If you have any questions or feedback about this comparison, please don't hesitate to reach out.