My Final Flutter Video

Summary

The speaker discusses the appropriate use of technologies like Flutter, React Native, and game engines for app development. They argue that understanding the nature of the application and its requirements is crucial. Flutter is criticized for its lack of native platform integration, leading to a subpar user experience. React Native, with its strong native bindings and community support, is praised for more complex applications. The speaker emphasizes the importance of choosing the right tool for the job to ensure the best outcome for users and developers.

Takeaways

• 🌟 Flutter is often misunderstood, with people not fully grasping what it is, what problems it solves, and what an application truly is.
• 📊 A spectrum is proposed to categorize applications based on their need for native features and the level of animation and interactivity.
• 🎮 Video game engines like Unity are best suited for highly animated and interactive applications, whereas simple, static applications may not require such engines.
• 🏪 Applications like Pokemon Go straddle the line, being both highly animated and requiring numerous native features like GPS and push notifications.
• 🔍 The 'game engine line' is introduced as a threshold where an application's animation justifies the use of a game engine for optimal experience.
• 💡 Flutter is likened to a web browser or game engine for apps, aiming to provide a cross-platform solution but often sacrificing native performance and integration.
• 📸 Flutter's approach to handling native features involves baking screenshots and stills of iOS elements into the app bundle, leading to an 'uncanny valley' experience.
• 🎨 Flutter's sweet spot is identified as being ideal for applications that focus on animations and have minimal interaction, such as animation platforms.
• 📱 For applications requiring more complex native features or better suited for a native experience, React Native or native development is recommended over Flutter.
• 📱 React Native, paired with Expo's packages, offers a powerful solution for building multi-platform mobile applications with strong native integrations.
• 🚀 Code push and over-the-air updates are highlighted as significant advantages of React Native, allowing for quick bug fixes and feature updates without App Store constraints.

Q & A

What is the main issue with using Flutter for applications that require native features?

The main issue is that Flutter avoids using native components as much as possible. Instead, it uses screenshots and stills of native features, which can result in an uncanny valley experience where the app feels almost, but not quite, native. This can lead to poor user experience and performance issues, such as incorrect scroll behavior, because Flutter doesn't fully integrate with the native platform's decades of development.

What is the 'game engine line' in the context of the spectrum described?

The 'game engine line' is a conceptual boundary on the spectrum that separates applications that benefit from using a game engine like Unity for their animation and interactive needs from those that would be better served by sticking to native platform features and rendering. It indicates the point at which an application's requirements for animation and interactivity are significant enough to justify using a game engine.

Why is React Native a better choice for certain applications compared to Flutter?

React Native is a better choice for applications that require complex native features or tighter integration with the platform because it provides a stronger binding layer with native code. It also benefits from a large ecosystem of packages that simplify native development, making it easier to access native features and SDKs without having to write everything from scratch.

What are some advantages of using React Native with Expo?

Expo provides a collection of native bindings for React Native that simplify development. These include Expo Font for loading third-party fonts, Expo FileSystem for direct file system access, and Expo Dev Menu for development tools. Expo also facilitates over-the-air updates and code push, allowing for quick deployment of bug fixes and small changes without going through the App Store review process.

How does the speaker view the use of Flutter for building e-commerce apps?

The speaker discourages the use of Flutter for e-commerce apps, arguing that it can hurt the users, the engineers, and the business itself. This is because Flutter's approach to not using native components can lead to a subpar user experience and performance issues, which are critical for the success of e-commerce applications.

What is the speaker's main criticism of Flutter's approach to native features?

The speaker criticizes Flutter's approach to native features because it does not fully utilize the native platform's capabilities. Instead, Flutter recreates its own versions of native components, which can result in an inferior user experience and performance. The speaker argues that this is particularly problematic for new developers who may be misled into thinking that Flutter is a suitable choice for all types of applications.

What is the 'sweet spot' for using Flutter according to the speaker?

The speaker identifies a 'sweet spot' for using Flutter as being in the area of applications that are not quite games but have defining characteristics in their animation frameworks. For apps that focus on performant animations with minimal interactions, Flutter can make sense because it provides a way to build and render animations across different platforms effectively.

Why does the speaker argue that React Native is a powerful solution for mobile development?

The speaker argues that React Native is powerful because it allows for the development of applications with complex functionality that requires native features. It provides a strong binding layer with native code and a large ecosystem of packages, making it easier to access native features and SDKs. Additionally, features like code push and over-the-air updates give developers the ability to quickly deploy fixes and updates without going through the App Store, which is a significant advantage.

What is the speaker's view on the state of iOS support in Flutter?

The speaker believes that the state of iOS support in Flutter is currently poor, citing issues with the animation layer since iOS moved to the Metal engine. The speaker mentions that there are unresolved issues that have been ongoing since the transition, indicating a lack of maturity or robustness in Flutter's iOS support.

What does the speaker suggest is a better approach for developers choosing a technology stack?

The speaker suggests that developers should be more responsible and thoughtful in their choice of technology stack. They should consider the specific requirements of their application and the user experience, rather than simply choosing a technology because it is popular or the one they are most familiar with. The speaker encourages developers to understand the strengths and weaknesses of each platform and to make informed decisions based on the needs of their project.

What is the speaker's opinion on the Flutter community's understanding of its platform's limitations?

The speaker feels that the Flutter community, particularly its most vocal members, often fail to acknowledge or understand the limitations of the platform. They argue that these developers tend to focus on the advantages of Flutter while downplaying or ignoring the significant drawbacks, especially when it comes to the user experience and performance on non-native platforms.

Outlines

00:00

🤔 Understanding the Role of Flutter in App Development

This paragraph discusses the misconceptions around using Flutter for app development, emphasizing the need to understand what Flutter is, its purpose, and the nature of applications. It introduces a spectrum ranging from non-native to native features, using Pokemon Go as an example to illustrate where different types of applications fall on this spectrum. The speaker argues that while Flutter has its place, it's not suitable for all types of applications, especially those requiring significant native features.

05:00

🎮 The Game Engine Line and Flutter's Position

The speaker defines the 'game engine line,' a threshold where an application's need for animation justifies using a game engine like Unity. They contrast this with native platforms and Flutter, which avoids native controls and instead uses its own rendering and logic. The paragraph highlights the limitations of Flutter in providing native experiences, such as push notifications or platform-specific behaviors, and suggests that for certain types of applications, like animation-focused ones, Flutter might be a suitable choice.

10:02

🚫 Criticisms of Flutter and the Case for React Native

The speaker criticizes the use of Flutter for applications that do not fit its strengths, such as e-commerce apps, and argues that it can lead to a subpar user experience. They praise React Native for its ability to provide a stronger connection to native features and its active community, which offers a wealth of packages to simplify development. The speaker also discusses the benefits of code push and over-the-air updates in React Native, which allow for more flexibility and less reliance on app store approval processes.

Keywords

💡Flutter

Flutter is described in the video as a framework that enables the development of applications by using a single codebase to deploy on both iOS and Android platforms. Unlike traditional native development, Flutter tries to avoid calling native code as much as possible, instead opting to recreate native functionalities within its own environment. This approach can lead to a dissonance between the app's behavior and native platform expectations, notably in aspects like animations or the 'uncanny valley' experience with native features mimicry. The speaker argues that Flutter is best suited for applications where animations are a defining characteristic, rather than applications requiring deep integration with native features.

💡React Native

React Native is presented as a cross-platform development framework that allows developers to build mobile apps using JavaScript and React, while still leveraging native components for rendering. This means that React Native apps can access and utilize native platform features more directly compared to Flutter, leading to a more native-like user experience. The speaker highlights React Native's strength in its ecosystem, including the vast number of packages available for integrating with native functionalities, and its ability to update applications over-the-air without going through the app store's approval process.

💡Game Engines

Game engines such as Unity or Unreal Engine are mentioned in the context of developing highly interactive and animated applications, like video games. These engines provide the tools and capabilities to create complex animations and graphics-intensive experiences. The speaker draws a line, the 'game engine line', to delineate when it makes sense to use game engines over app development frameworks based on the level of animation and interactivity required by the application.

💡Native Features

Native features refer to the capabilities provided by a mobile platform or device, such as camera access, push notifications, and accelerometer data. The speaker discusses how the necessity of these features influences the choice of development platform, arguing that applications requiring extensive use of native features are better suited to traditional native development or frameworks like React Native that allow for closer integration with the device's hardware and software.

💡Animation

Animation is a central theme in the video, particularly in the context of choosing the appropriate development platform. The speaker suggests that applications with a heavy focus on animation might benefit from using Flutter or a game engine, depending on the complexity and nature of the animations. Flutter is seen as suitable for applications where animations are the defining feature but do not require complex interactivity like a full-fledged video game.

💡Native Integration

Native integration refers to the ability of an application to utilize the native functionalities and UI components of the platform it runs on. The video contrasts Flutter's approach of recreating these elements within its own framework to React Native's strategy of leveraging actual native components, which can lead to a more authentic and performant user experience. The speaker argues that applications requiring deep native integration should avoid Flutter in favor of more native-aligned solutions.

💡Cross-Platform Development

Cross-platform development is the practice of building software applications that can run on multiple operating systems from a single codebase. Both Flutter and React Native are highlighted as cross-platform frameworks, but the speaker criticizes Flutter for its handling of native features and suggests React Native as a superior option due to its ability to integrate more seamlessly with native components and offer a native-like user experience.

💡E-commerce Apps

E-commerce apps are mentioned as an example of applications that generally do not require the extensive animations or game-like interactivity that might justify the use of Flutter or game engines. The speaker argues that developers of e-commerce apps should prioritize native platforms or frameworks like React Native for better performance and user experience, illustrating the broader point that the choice of development platform should be guided by the specific needs and characteristics of the application.

💡Uncanny Valley

The term 'uncanny valley' is used to describe the discomfort or eeriness people feel when encountering an almost, but not quite, lifelike representation of a human or in this case, UI components. The speaker uses it to critique Flutter's approach of mimicking native UI elements, which can lead to experiences that feel slightly off compared to truly native applications. This concept underscores the importance of choosing the right framework based on how closely an app needs to integrate with and mimic native platform behaviors.

💡Expo

Expo is mentioned as an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. It's highlighted for its rich set of libraries that simplify access to native functionalities for React Native applications. The speaker praises Expo for its contribution to the React Native ecosystem, particularly for enabling developers to leverage native features more easily and for facilitating the over-the-air updates of apps, showcasing the advantages of React Native for cross-platform development.

Highlights

The speaker discusses the misconceptions about using Flutter for app development and emphasizes understanding what problems it solves.

A spectrum is introduced to categorize applications based on their need for native features versus their level of animation and interactivity.

The speaker argues that for apps requiring minimal native features, like a checkout for an Amazon grocery app, using a game engine or Flutter may not be necessary.

The concept of the 'game engine line' is introduced, which delineates when an application's animation needs are best served by a game engine like Unity.

Pokemon Go is used as an example of an app that is both highly animated and requires many native features, necessitating a balance between game engine and native platform usage.

Flutter is described as a 'game engine for apps' that avoids rendering native components, leading to an 'uncanny valley' experience for users.

The speaker identifies a 'sweet spot' for Flutter where its animation capabilities are most useful for certain types of applications, like those focused on graphics and minimal interactions.

React Native is positioned as a strong alternative to Flutter, offering better integration with native platforms and a large ecosystem of packages.

The speaker criticizes Flutter for its lack of native platform integration, which can lead to subpar user experiences and technical limitations.

The potential use of Flutter for animation libraries is acknowledged as a valid application of the technology.

The speaker advocates for responsible technology selection, cautioning against choosing a technology just because it's popular without considering its suitability for the project.

The limitations of Flutter for iOS development are discussed, including issues with the animation layer and the technology's maturity.

React Native's ability to push code updates directly to users without going through app stores is highlighted as a significant advantage.

The speaker expresses frustration with the Flutter community's lack of acknowledgment of the technology's limitations and their insistence on its superiority.

A call for more responsible discussions around technology choices is made, urging developers to consider the impact of their decisions on users and the community.

The speaker shares a positive experience with a member of the Flutter community who recognizes the technology's current state and potential improvements.

The video concludes with an invitation for the Flutter community to provide insights and counterarguments to the points made.

Transcripts

you triggered me

people keep asking me about building

apps in video game engines I said I

wouldn't talk about flutter anymore but

I want to put this one down for good

stop writing your apps and game engines

let's talk about what I mean here and

think through what an app even is

because I feel like most of the time

people talk about flutter they're

failing to understand what flutter is

what problems it solves and what an

application even is in the first place

I'm trying to Define this as a spectrum

the way I think about this is left to

right here we have doesn't need native

stuff and on the right we have does the

native stuff think cameras

accelerometers push notifications all

the native features that your phone or

whatever platform offers to the

developer so if you're just making a

checkout for your Amazon grocery app if

I don't need many of these native

features if any at all but if you are

making a camera app or an AR app

probably need a lot more of these

features from bottom to top we have the

video game Spectrum where on the bottom

here it's no animation everything's

static but on the top here everything is

animated you're writing custom animation

Logic for individual details to make a

really good interactive experience

probably video game one interesting

project that to start with the project

yeah every application can be put

somewhere on this chart if we take

something like Pokemon go for example

it's an interesting spot because Pokemon

go is very animated interactive it's a

literal video game but it also needs a

lot of native stuff because it has so

many Native features built in like using

the accelerometer for figuring out what

Pokemon you're looking at all the fancy

AR stuff the GPS stuff the push

notifications there's a lot going on in

Pokemon go that is native

characteristics that are necessary for

the application to be a good experience

as such there's a lot of work that has

to be done for the developers to build

good Integrations with that native layer

but they also have to build in a game

engine if they want the animations and

overall experience to be good at all as

such I'm going to define a line here to

make it a little easier to reason about

these things I'm going to call this the

game engine Line This is the line where

the thing you're making is animated

enough that using an engine like Unity

makes sense there's between something

like unity in a native platform like

kotlin or Swift or even react native

itself use the native Primitives that

the phone or whatever device is already

providing Apple provides a button in iOS

that handles all the accessibility all

of the screen reading stuff all of the

weird behaviors and touchability from

different ways you can use an iPhone app

and their buttons are pretty good I know

I click them all the time every day

Apple's button primitive is probably

something we should use when we're

building a phone app that has buttons

and interactive features but if we're

mostly focused on the environment itself

the animated 3D experience then Apple's

stuff doesn't help us a whole lot we

don't get much benefit from Apple having

a really good screen readable button if

I need to render that button on a sign

in a 3D world that I can walk up to and

click and that difference of the

platform and the the place the user

experience lives being fundamentally

different from the platform Apple built

that is where game engines come in they

say screw all of your native stuff we're

not using any of that we're going to use

the processor though and we're going to

build our own rendering layer our own

engine for making things appear and

disappear it means it takes longer for

these things to spin up but it also

means you can do much more just why a

game like fortnite could never be

written in react native or native code

and it's why unity and Unreal Engine

have found the success they found by

being a really good way for any

developer to build a video game

experience in an engine that could run

against many different platforms

somebody thought that was a good idea

for applications and this is where

flutter gets interesting the thing I

feel like many people miss about flutter

is that it's not a native platform react

native renders native button it renders

a native video player if you're under a

video player it renders native things

and calls native code flutter avoids

doing that as much as it possibly can

flutter is kind of like a web browser or

game engine for your apps which means if

you want one of those little toast

notifications like the pop-up that iOS

gives you that says hey are you sure

about this yes or no flutter can't let

you do that so instead of giving you an

actual iOS feature they literally take

screenshots and stills of all of the

different iOS features and bake them

into the app bundle so that when you

render on iOS it will take that

screenshot and overlay text on it and

the result is that every flutter app has

this terrible uncanny valley experience

you you can feel it when you use a

flutter app there are lots of simple

Silly Ways to check like if you use two

fingers to scroll and flutter it Scrolls

twice as fast because they didn't

Implement their scroll layer correctly

just stupid like that it is the

defining characteristic of flutter

you're throwing away the entire native

platform in the Decades of hard work

hundreds of thousands of developers have

put into improving that native platform

because you think your game engine is a

better experience so who is flutter

actually for I am going to show you guys

where I think flutter's sweet spot is I

think there's a very thin space in this

area here where if the application

You're Building isn't quite a game but

it's defining characteristics are the

animations like an animation framework

flutter can make a lot of sense revive

is the new animation platform built with

the goal of making performant animations

easy to build and because they're trying

to make an animation layer that runs on

every platform for these like cute

graphic type animations with minimal

interactions flutter makes a lot lot of

sense for these types of cute things if

you want to add a quick animation to an

existing thing funny enough they're not

actually using flutter in the runtime

that you ship if you use it but they're

like a stripped down Dart based

alternative that they're working on but

their actual editor experience is all

based on flutter and I think this is

that rare sweet spot where flutter

actually makes sense because the

defining characteristic of this app

isn't the interface it's the interop

between the interface and this animation

framework I was actually really

surprised when I saw this project it

shocked me as though like oh wow

somebody found a real use for flutter

finally but I cannot imagine anything

above this line that isn't better suited

to use a real game engine and I

certainly cannot imagine anything below

this line that is better suited to not

or that isn't better suited to use

something like react native and if we

Define this like more split or like here

we'll say at this point and I don't want

to define the specific features where

these lines get crossed but let's say

from here at any point past this is web

is fine but let's say you have a mobile

website it's pretty good it's doing

everything you need but now you need

push notifications or you have users

that specifically have the habit of

checking an application you want to

quickly build an app for them I don't

think rushing to react native and

certainly not rushing to flutter is the

right call here I think there's a lot of

space I'd argue almost to like here

where web rappers are fine we can argue

where this line goes it's all subjective

and I don't really care to argue it the

goal of this line is specifically to

highlight that there's an area here

where you have one or two features that

aren't capable that aren't possible from

the web that you need to have a good

experience for your users I think this

sweet spot here especially if you're not

going too crazy with the animation stuff

like this area here is very compelling

for a platform like ionic the benefit of

ionic is you get to write a website

effectively using react opponents all

the stuff you normally do and it is

rendering in a web shell but it gives

you access to certain native features

like push notifications like the camera

without leaving the web platform so you

still get all your usual CSS all the

usual things it's not a native app like

anything before this line is really

isn't going going to be a native app if

it's ideal but at a certain point You're

Building enough native stuff that it

becomes irresponsible to not make the

move thankfully the vast vast majority

of what is doable on Native platforms is

doable through react native so I'll call

this the react native line the goal of

this line is to highlight that there's a

huge area here where your functionality

for your application might be more

complex than what I put this the needs

of your application might require things

that aren't part of ionic's layer or web

wrappers let's say you're building an

alternative Spotify or apple music

listening experience on Native you need

to call the native sdks to play those

things ionic might have some bindings

for that but it's way easier to work

with a platform like react native that

gives you a much stronger binding layer

and also as a community with hundreds

upon hundreds of packages that interrupt

with those native layers so powerfully

one of the biggest things that one of

the biggest things I feel like doesn't

get enough attention in the react native

world is not quite react native it's the

insane amount of packages that Expo has

published to make reacting native

development easier all of these are

native bindings to both IOS and Android

and often other platforms as well where

here like Expo font lets you load

third-party fonts in your native app

using the native platform Expo file

system lets you access the native file

system directly Expo Dev menu is more

for like Dev stuff Expo crypto lets you

do encryption using the native

encryption and cryptography layers on

both platforms Expo context gives you

direct access to contacts these aren't

things that are rendering in JavaScript

these are very specifically native

Bindings that you call in JavaScript and

then you use to call things JavaScript

isn't used JavaScript isn't used to

render things or do things in react

native it's used to tell the native

Parts what to do so the Expo image

picker would tell or the actual image

picker for example will tell the native

layer hey open the native image picker

and then when the native image picker is

done picking it sends the JavaScript

that says oh hey we have images now we

should do something with them we're

going to send this to the native render

layer to show you the images all react

native really does is tells the native

layer what to put where it's not that

big of an abstraction and more and more

calling things from native in react

native is getting easier they're doing

some really crazy work with the bridge

between the two to effectively let you

write Swift Code and then call it in

JavaScript with almost no latency if you

do the same thing in flutter you're

going to be Reinventing a lot of the

patterns like the equivalent image

picker in flutter doesn't use the native

image picker it renders its own chaotic

like weird flutter thing that is side

loading the images that it read from FS

to try and render its own alternative

view whatever flutter offers UI that is

similar to the native platform it is

explicitly not using the native platform

they are effectively and it says before

screenshotting the native features

ripping out the identifiable elements

and then running text like generation on

top to make it look close enough to real

it's not a real application platform and

it is not a native platform the most

insulting thing for me is that the

people who complain about react native

and chill flutter complain about react

native for problems that only exist in

flutter flutter is not a native platform

people are mad at react native because

it's running code that isn't native on

the platform so they just abstract the

whole platform away entirely makes no

sense the fast vast majority of people

who regularly shill flutter in my

replies and in my community are just

doing it because it's the thing they

picked and when I ask them to justify it

they say well it's cross-platform like

okay and one of those platforms barely

even works do you know the state of iOS

flutter right now do y'all understand

how awful the animation layer currently

is in flutter for iOS did you see the

Jank there are you joking this has been

the case since iOS moved to metal as the

default engine and the issue for this as

far as I know is still open Yep this is

still broken and we have been promised a

solution now you have to use flutter's

engine if you're using flutter if there

was a bug like this in react native you

can just drop react native and write it

in Native and just call the native thing

Slaughter makes that nearly impossible

because they're so far abstracted from

the platform it's Insanity we're not

even talking about the website we

haven't even talked about code push like

two of the biggest features features

that make react native powerful which is

the interop of mindset between web and

mobile and theoretically the entrop of

code as well not the biggest fan of

react data for web but it's a decent

enough solution people have shipped

really cool things with it but also when

you're trying to actually ship updates

to your application the abstraction that

react native gives you lets you ship a

fresh JavaScript bundle that triggers

different native code without having to

go through the App Store obviously if

you ship new features this way Apple's

going to block you but if you use this

for bug fixes and small changes they

don't matter that much you are no longer

blocked by the App Store on every single

small thing you need to do for your

users and dumb stuff like having a an

April Fool's Day theme or like a random

like 4th of July type theme or whatever

the hell you want to do for a one-off

feature you book this event and you want

to pin it to the top of your app you can

now do that with code push and with

over-the-air updates trivially in react

native land it is such a huge advantage

to just throw away I don't know why you

would do it the reason I hate talking

about flutter is all of these things are

objectively true and every time I argue

about flutter somebody picks a random

one of these things to get really Huffy

about and find some Edge case about and

I'm like okay but what about the other

two and they say oh no those don't

matter we're just talking about this

thing all three of these things make

flutter basically unusable unless you

have very very specific requirements

that both aren't affected by these

negatives and also benefit from having a

game engine that your application runs

in realistically speaking if you weren't

considering Unity at some point you

shouldn't be considering flutter at all

and this is what kills me with flutter

is people building like e-commerce apps

and flutter you're hurting your users

you're hurting your engineers you're

hurting yourself please stop doing it

yeah I just I think react native with

Expo is as good as you can get for

multi-platform mobile right now it's

really hard to beat I've said everything

I have had to say about flutter I'm

tired of people picking Tech because

it's the thing they like and use and

they haven't thought through what the

impact would be there are times I would

use flutter if I was working on an

animation library and there are times I

would write Swift if I was working on a

camera app I feel like the flutter

people feel like flutter should be this

entire chart and when I challenge them

on that they just themselves

constantly it is genuinely really really

hard to have conversations about flutter

because the average flutter Fanboy is a

new developer which is probably my least

favorite part is the people who are

getting hurt the most by flutter are new

devs just looking for the first horse to

bet on and it really really sucks for

them because they're betting on a horse

that's effectively gimped from the start

it really really sucks and I hope that

we can be more responsible as we talk

about these Technologies because I just

don't think there's much room here and

that there's much being built in this

space and again to this day I have seen

a singular application that fluttermate

sounds for but when I talk to flutter

Engineers their response is there is no

application react native makes sense for

as such I think there's a conversation

to be had here shout out to Luke the one

person from the flutter side that's

actually been Pleasant to engage with

and recognizes the state of the market

and all of these failures it has also

been embracing new web platform stuff to

take advantage of these cool new tools

sadly that is not the experience I've

had with most people from the flutter

side feel free to prove me wrong in the

comments and reply with actual Insight

on things I might not be understanding

of a flutter as well as where react

native makes sense in your flutter

mindset but I have a feeling when we

scroll down the comment section in this

video is going to be a bunch of flutter

Fanboys themselves saying I

don't understand anything about

applications so prove me wrong guys I'd

love to see it this was fun as always

appreciate each and every one of you

even the ones who are here to post

because yeah it helps the algorithm

thank you guys as always stop putting

your apps in game engines peace nerds