Original address: medium.com/snapp-mobil…

Original author: medium.com/jasperamor…

Published: 18 February 2019-11 minutes to read

From the early days of mobile application development, there has been a fierce debate over whether to build applications using native platform technologies versus cross-platform technologies. Flutter creates a new dimension to this debate because it is multi-platform and cross-platform.

The commitment of Flutter and the interest of the development community mean that it is worth revisiting this debate in the context of Flutter in its native vs.

Here are some of the things we think are important when looking at cross-platform mobile development:

  • Best native app experience with easier toolchain.
  • Platform expertise vs. abstract cost.
  • Platform professional programming languages vs general purpose languages.
  • Latest platform development vs catch-up.
  • Multiple codebase and testing efforts vs. single codebase and incremental testing efforts.
  • Platform-specific testing frameworks vs general-purpose testing frameworks.

A little background on Flutter

Let’s start with a very quick overview of why Flutter is different from other cross-platform efforts. To put it simply, Flutter takes a similar approach to a mobile game engine and breaks it down into these three pieces

  • IOS (.ipa) and Android(.apk) apps, which act as runters, but do not contain the compiled application code itself.
  • The native runtime engine handles low-level responsibilities such as drawing user interfaces and interoperability facilities for device and/or platform library access. For iOS, the engine is delivered through LLVM, while Android is delivered through NDK.
  • The application code is compiled into the ARM library, which works with the engine to create the application experience.

This is a big difference from the cross-platform Ionic/Cordova that runs in a Web view, and ReactNative that is JavaScript centric and interoperates with native UI components.

Flutter has brought more people back to cross-platform because it:

  • Runtime performance is very fast, addressing the lag issues that continue to plague javascript-based solutions (Ionic/Cordova or ReactNative). Flutter’s toolchain means that development can be done on emulators and devices (just like native development) with mobile application development using Chrome development tools (Ionic/Cordova or ReactNative).
  • First-class IDE support. There’s been a lot of investment in tools, and that’s what’s expected of Google right now.
  • Google’s pedigree in mobile operating systems gives Flutter legitimacy. It was conceived by brilliant Google engineers like Adam Barth.

Let’s restate our views on native versus cross-platform and reevaluate them in the context of Flutter.


Best of breed native app experience VS simpler toolchain

What is our view?

Native apps provide the best user experience based on speed, platform compliance, and use of the latest features. Cross-platform products focus on using programming languages and runtimes from the non-mobile world on the basis that it simplifies development.

How does this look to Flutter?

On the surface, Flutter is just a variation of what came before. In fact, you can reuse the React, Cordova, or Xamarin statements to describe Flutter *. In this respect, Flutter does not challenge our current thinking.

However, there are three aspects of the Flutter story that are different and interesting.

First, it’s upending the way native developers think about their native toolchains.

Flutter’s amazing Hot Reload is something native developers have wanted for a long time. Changes to the source code are immediately reflected on the device/emulator. Flutter is leading the way in native app development. (See Android Studio’s recent update to on-the-fly, bit.ly/2N6YcTo).

Second, Flutter is delivering application performance that native developers would be happy with. Even on resource-constrained devices like Android One, the Flutter sample app was far smoother than expected. This can be done because Flutter is compiled according to ARM instructions (via NDK for Android and LLVM for iOS). More innovative is the unique rendering model adopted by Flutter, which renders through a single channel in the widget (aka view) hierarchy. In addition, the concept of stateless and stateful widgets allows caching of layouts. However, Flutter is still young, and the jury is still out on performance.

Third, Flutter uses a relatively new modern programming language.

We have a bias against JavaScript as a language. (Unfortunately, we don’t have time to discuss this topic here.) The interesting thing about Flutter is that it uses the Dart language, which means that developers get a modern, mature programming language that is also very familiar. (We’ll write about Dart in the future).

What does that mean?

While it was clear that Flutter was a more compelling starting point than previous cross-platform efforts, it couldn’t get rid of some of its flaws, which continued to shape our idea that Flutter was still a compromise between the first-class native experience and the simplicity of the toolchain.

The Flutter UI widget is a facsimile of the native widget. As a result, they don’t always feel right. Additionally, Flutter will be in a constant state of catch-up as it must respond to innovations and improvements in iOS and Android. For example, Flutter does not (yet) give you access to ARKit/iOS or ARCore/Android.

* The argument for other cross-platform tools seemed to work when “Flutter “was used instead of their names.

“[because] R ̵ e ̵ ̵ ̵ ̵ t c a N ̵ a ̵ ̵ t ̵ ̵ I v e ̵ let you only (Dart) J ̵ a ̵ v ̵ a ̵ S ̵ ̵ R ̵ ̵ ̵ t p I c ̵…. Lets you compose a rich mobile UI from declarative components. (React NativeFacebook. Making. IO/react – nativ…)

“[Flutter]A % P % A % c % h % e % c % O % r % d % o % v % A % is an open source mobile development framework. It allows you to use the standard (Dart) w ̶ e ̶ ̶ technology b – H ̵ T ̵ Mn_335 ̵ five ̵ ̵ C ̵ S ̵ S ̵ 3 ̵ ̵ a ̵ d ̵ J ̵ a ̵ v ̵ a ̵ S ̵ ̵ r ̵ ̵ ̵ T p I C ̵ for cross-platform development.” (Cordovabit.ly/2Br2enX)

“Deliver native Android, iOS, and Windows apps with a shared [Dart]. % % N % E % T % codebase.” (Xamarin)


Platform expertise versus abstract costs

www.duckychannel.com.tw

What is our view?

The specialization of the platform means that access to and understanding of the API and SDK is the intent of the platform developer. Therefore, there is no abstraction cost for local development. All cross-platform efforts are an attempt to abstract the developer from the reality of the underlying platform. The trade-off for developers is that cross-platform tools are either a black box of unknowns, or developers have to juggle some knowledge of both native platforms and cross-platform abstractions.

How does this look on Flutter?

Using Flutter development does not change the limitations of cross-platform tools — they provide a subset of features available to native developers. If you want to go beyond this subset, you need an interoperability mechanism and platform expertise. Flutter is no exception, adopting a plugin mechanism to achieve interoperability with native code.

But Flutter is different.

First, you don’t have to worry too much about the underlying platform, because Flutter does a lot of what the platform is supposed to do. Flutter comes with an engine, including the Skia graphics library, for drawing all UI elements. The Flutter framework is responsible for rendering the entire UI. You don’t need to understand the differences between Android and iOS views and renderings at the same time because you use Flutter widgets. Flutter’s widgets also make it easy to launch your own.

Second, another common abstraction cost is why cross-platform application performance is dissected. Cross-platform runtimes (usually the area of greatest performance concern) are not usually directly possible to be dissected using native iOS and Android profiling tools. In these cases, going back to Chrome development tools is a common approach to profiling.

Flutter does come with its own profiling tools (bit.ly/2PXMIDo)– we don’t know enough about these tools to form an opinion, so this could be the subject of a future article.

What does that mean?

Flutter does not use native platform UI rendering, so rather than abstracting the underlying platform, the framework provides an alternative runtime.

However, access to the underlying device services is still required, and as with other cross-platform frameworks, this is done through the plug-in mechanism. The cost of abstraction exists, if less than other cross-platform technologies.


Platform-specific programming languages VS general-purpose languages

What is our view?

Swift and Kotlin (with Android extensions) are de facto languages for iOS and Android. Apple and Google have invested heavily to ensure that these languages are optimized for compile and runtime performance, and provide superior support for tools, documentation, and community engagement. The explicit goal of the cross-platform approach is to take languages out of the mobile development context and create an environment where they can be reused in a local environment.

What about Flutter?

The Flutter application is built using Dart, a relatively unknown programming language. Dart’s origins date back seven years, and the original hope was to make it a modern alternative to JavaScript. This never happened because the Dart virtual machine never entered Chrome. Today, Dart is typically ported to JavaScript or compiled into machine code. The Dart virtual machine still exists, but with less attention than before.

So it’s easy to see how Dart aligns well with its cross-platform Cousins that use JavaScript or C# — it’s clearly a language that comes from outside the mobile development context.

However, Dart 2.0, which was recently released, is a “reboot” of the language designed to “make mobile and Web development more enjoyable and efficient” (bit.ly/2MLR828). Dart has evolved as a language specifically for Flutter and Angular Dart. This is in stark contrast to languages like JavaScript, which were never designed for mobile development.

What does that mean?

Fortunately for Dart, its reboot is mainly to serve the Flutter and Angular Dart. In fact, the development of Flutter is largely due to the ability of JUST-in-time (JIT) compilation when hot overloading, or Ahead-of-time (AOT) compilation. This is the basis of hot reloading. Dart is easy to learn. Its asynchronous programming model and the fact that it is a single-threaded language will be particularly familiar to JavaScript developers — it even shares the async/await syntax. However, the prospect of another programming language is likely to be a barrier to acceptance.

Latest platform development and catch-up

What is our opinion?

Native app developers always benefit from the latest platform updates and features. A cross-platform approach can only respond to change. Depending on the size and importance of the platform changes, there may be a significant delay before cross-platform apps reflect what native apps have already accepted.

What about Flutter?

Third, Flutter is consistent with other cross-platform approaches. As iOS and Android features improved, the Flutter team had to react and bring these improvements to the framework. One of the advantages that Flutter has over the others is that Google can choose to make Flutter keep pace with Android. This is not certain, as the Flutter and Android teams have separate roadmaps and priorities. However, in a recent update to Material Design, Flutter is now supported alongside Android and iOS.

Less encouragingly, Google’s own services are at a relatively early stage in terms of support. For example, Firebase support in Flutter/Dart lags behind iOS and Android.

What does that mean?

Flutter’s relationship with Google means it may have an edge on other cross-platform frameworks. However, Flutter is still several steps behind native app development in providing the latest features. As proof, Flutter does not provide access to augmented reality on iOS or Android. Machine learning features in the latest iOS and Android versions are also missing.

This is still a disadvantage of cross-platform development.


Multiple codebase and testing efforts versus single codebase and incremental testing efforts.

What is our view?

Building the same application twice is a reality for native development. In addition to the extra effort and cost, maintaining equal functionality between the two applications over time is a challenge. However,Stories from the trenchesAs it turns out, cross-platform code is not a one-size-fits-all promise.

Differences in supporting platform UIs and interactions begin to erode the allure of a single code base. Platform – or device-specific UI failures also result in more and more platform-specific code. Achieving performance across a wide range of devices and operating system versions with a single code base is also a challenge. We look forward to the day when more code can be shared across platforms. We don’t believe today’s cross-platform approach is the answer.

What about Flutter?

So far, Flutter seems to work well across different mobile operating systems and devices, largely thanks to its UI rendering approach. In this respect, Flutter seems to offer the advantage of a single code base.

However, it is inevitable that the Flutter code needs to incorporate special operating system considerations. Such as applying the correct iOS or Android look and feel, or using iOS and Android widgets in your UI.

What does that mean?

As with other cross-platform approaches, Flutter implies a single code base for iOS and Android. This does mean that the code still has to account for differences in UI rendering on the supported platforms. Although Flutter is new, there are not many best practices and established patterns for managing differences in this code. It falls to the developer to manage these differences cleanly in a maintainable way. In some cases, this inevitably leads to a pile of spaghetti. However, as the footprint of Flutter increases, good practices will emerge.


A platform-specific test framework compared to a generic test framework

What is our opinion?

Testing mobile apps presents some unique challenges. Unit tests run in isolation and instrumented tests require access to platform services or libraries. Integration tests need to be run in headless mode or on devices. Native developers can use testing frameworks to address these challenges head-on. Cross-platform developers must use non-mobile testing frameworks or do generic black box testing through Appium or something similar.

How does this look on Flutter?

Testing the Flutter application did not use the native testing framework. Instead, the Dart unit test mechanism and the Flutter specific unit test package are used for testing. These packages support testing widgets (that is, UI views) and black-box integration testing. Widget tests are run outside of the context of the application, whereas integration tests must be run on the device or in the emulator.

What does that mean?

In testing, Google’s support became apparent. Flutter goes beyond what other cross-platform frameworks offer and makes test support the focus of Flutter.

In other cross-platform projects, testing is not a core topic. There are no specific instructions for testing in the React Native documentation. Ionic has a blog post covering this topic, but nothing more. They seem to leave it to JavaScript testing frameworks like Mocha or Jasmine. Xamarin seems to have some testing support, but I keep finding dead links in the documentation — like to bit.ly/2wQO5f6.

This puts Flutter halfway between native capabilities and cross-platform reality. Like other aspects of Flutter, the framework benefits from a degree of self-control.


TL; DR

At Snapp, we are comfortable with our position that the cross-platform approach represents a number of compromises and drawbacks compared to native development. We have long argued that the “silver bullet” of cross-platform advocates does not exist in reality. The recent deviation from a cross-platform approach by companies like AirBnB is a case in point. Flutter is an interesting initiative by Google, with ambitions that go far beyond mobile devices. As with all new technologies, it will take some time to see Flutter’s real-world strengths, weaknesses and realities over time. We will be watching Flutter with interest.


Translation via www.DeepL.com/Translator (free version)