All you should know about Flutter development
github.com
github.com
Flutter is brilliant, and probably the way to go, for some apps. A great example of a successful Flutter app is the Sonos app, relatively simple and responsive ui talking to an api. No “rich” or user supplied content. Although they haven’t replaced their desktop app with the flutter app, my guess is that it is the plan.
I think Flutter is brilliant for that type of IOT app, banking/crypto/utilities also the sort that would work well. I don’t think it’s best placed if you want to start using WebViews for some content, when I was last looking at it a year ago there were serious problems.
If you are building a social media app, either Native or React Native (or a combination) is probably the best way to go. You are aiming high so need the best performance and ux.
If you are building a b2b SAAS app I would probably reach for something like Ionic/Capacitor. You can share almost all you codebase with your web/PWA/desktop (electron) apps and can achieve it all with a tiny team. If you need a little more native functionality then adding in NativeScript to a Capacitor works very well.
For an e-commerce app I would probably go Iconic/Capacitor too, the Amazon app for example is mostly webviews.
Productivity apps are much more difficult to recommend for as you probably need large native components.
You render your mobile web view like normal, wire up a JavaScript handler (formerly known as Turbolinks), and push native screens on iOS. It works really well for CRUD and "boring" SAAS apps with little interaction outside of forms. And when you need higher fidelity dropping down to SwiftUI or UIKit is straightforward.
https://github.com/hotwired/turbo-ios
To make things even simpler, I built Jumpstart iOS, which takes care of all of the Swift boilerplate. Navigation, authentication, and push notifications all work out of the box after adding a few endpoints to your server.
Last year I experimented with using NativeScript in a Capacior app to open native modals with a second webview. Since then Ionic have released “Capacitor Portals” which brings all the native apis available within the Capacitor webview to native apps, effectively allowing you to embed capacitor views in another app. I wander if there is the potential to combine the two to get the native view transitions.
Edit:
Just to elaborate a little further on my experiment. Effectively what you ended up with was the two webviews being able to communicate with each other as though you had used the window.open or frames JavaScript api in the browser.
I'd also add that from a business perspective if your product heavily depends on or is entirely mobile-based then it often makes sense to go native and remove an extra party, you don't want to be stuck waiting for upstream fixes or features to land months after they've been released.
Up until now everything is fine for our purposes and performance is near native. Usually similar e-commerce apps require multiple teams, or at least 5+ employees, to release an app on web, Android and iOS. Due to the fact that we have just one single codebase, we can still manage it with the 2 of us.
I also recommend the Capacitor community on Discord in case you need help getting started.
Honestly nowadays with Expo I would never suggest doing a hybrid app anymore unless you have a large existing JS codebase you want to leverage. Expo makes React Native development so ridiculously simple from the point of scaffolding your app all the way through the app store submission process that there's really no productivity loss anymore vs. doing an Ionic app. The tooling has come so far in the last 10 years that you can just easily develop a native iOS app in Javascript like it's a web app now.
Agreed. I would even say in these past 3 years or so, React Native development has smoothed itself out. The experience of setting up an app and being productive in it coming in as a web developer is phenomenal. One thing is that the community support is still small compared to native or even React itself. Peformance too is lacking. I've been waiting for the new architecture Fabric to come in replacing JSC with JSI but it's taking quite a long time. There still isn't a clear estimate on it's release yet.
Both Android and iOS have been making strides in simplifying DX for composing expressive UIs. It only makes sense to use those new Android Studio/XCode features as they come.
My one observation though is that for many (the majority?) of mobile apps the UI layer is the vast majority of the app, easily 70-80%. Especially for apps where the business logic is calling a http api, which most CRUD type apps are. For these a cross platform toolkit that abstracts away ui differences so you only have to build it once is a massive plus.
Not my experience, and I'm not talking benchmarks. That said I barely use my phone and I'm thinking mainly about desktop applications. Mac-native apps are universally faster and more responsive than Electron-based equivalents.
Doing more work costs more resources than doing less work, and it's hard to beat JITing Javascript and manipulating and rendering HTML+CSS for wasteful computation, no matter how much you optimize it.
That said, I've used phone apps that were essentially some webpage in webview that were highly responsive and pleasant to use, so it's certainly possible to have a good experience with webapps.
Reducing the amount of Javascript and using simpler HTML+CSS would also probably go a long way to make these apps fasters and lighter. I remember using AJAX-based chat websites in the 2000s that ran perfectly fine on hardware far weaker than even a 5 year old phone, so how the heck does Slack have such poor performance? That's the real problem.
I have only one significant complaint that effects Capacitor on iOS and it’s a WebKit bug (Ionic can’t fix it). With WebKit on iOS if you have an overflow:scroll with a text input of any kind (basically any app you build) the text cursor or selection highlight will remain visible outside the overflow area when you scroll. So for example if you select text in an input and scroll the view so the input is under a fixed toolbar, the selection highlight or cursor is visible infront of the toolbar. It looks very messy, I wish Apple would fix it. The minute you see it you know it’s not a native app.
My concern with Ionic/React native isn't speed (I'm sure it's good enough), it's maintainability. I've been burned enough by the JS ecosystem to stay away from it when I can. It usually takes around 1 hour to update 6 months worth of Flutter framework & packages updates, I can't say the same about the javascript ecosystem.
On paper it looks awesome, in practice I just don't want to deal with those maintenance issues anymore.
Plus, with Ionic in contrast to the majority of JavaScript frameworks, you are using one built by a company where the framework is the core business. They have a long track record and sustainable business. They aren’t going anywhere.
Personally I prefer an opinionated framework, I don’t have to research library’s and tooling. It all just works and I have a single set of docs for reference.
Capacitor is a mobile app toolkit for building apps with web technologies in a webview. Effectively the successor to Cordova/PhoneGap. It’s built and maintained by the same team/company as that behind the Ionic framework.
* Don't get confused by the myriads of state management solutions. Just use GetX, it's a sane solution that works as advertised.
* There were a couple of storage plugins like hive that claimed to be better because they be native to the platform and not SQL. As with all platforms, that's bull. SQLite is available, so use that.
* The routers are a clusterfuck, the recent addition of declarative routing by the flutter team was a step in the wrong direction. However, the go_router (in the list) that's based on that looks actually nice.
* Evade everything with code generation, it hinders a good development workflow and the related plugins for that regularly break. For JSON-serialization that's hard though, I make an exception here, since there are many DTOs to manage.
* Flutter theming is a mess. An example that says it all: If you set a colorScheme with a primaryColor, Theme.of(context).primaryColor is not automatically that color. The results of the new ColorScheme.fromSeed() were awful in my test. flex_color_scheme solves that. Be prepared for significant changes here when Material 3 gets fully introduced to Flutter (the recent release 2.10 started with that).
Some things to keep in mind despite plugins: Flutter is not ready for the web (and the sites it would produce are JS abominations, so it will never be suited for the web if the approach does not change) and while the framework seems more stable than native app development, there are still breaking changes, both in the core and even more so in the plugin ecosystem. Selecting plugins based on a good stability is hard (as it's not obvious), but worthwhile.
Despite its shortcomings and Google connection Flutter is really nice to build iOS and Android apps with one code base, and I'd prefer it even for just an Android app by now.
Just learn how to do things the proper way, because it's not that hard, and much more expressive and clean.
If you go for Flutter job it's best to not mention GetX either.
> If you go for Flutter job it's best to not mention GetX either.
I wouldn't work for an employer that does not let me pick the right tool for the job, so there is no danger there.
Maybe to make it as constructive as possible, why don't you link to what is your preferred alternative approach? I assume it's not setState :)
I personally also like to practice data-oriented design, write most of the logic in C/Zig with a functional reactive Dart API, and then share the streams with Riverpod. I keep most of the state in C/Zig, but that should be a Dart-only library, I just use C/Zig because I need the core functionality of my app to be portable, for example to use it with Vue.js, or even FreeBSD, which Dart don't even support, but if that's not the case a Dart-only library for the core functionality is the way to go.
This is terrible advice. GetX is great for rapid prototyping but nothing more.
Once you reach a certain point you will need to re-code your entire app to get rid of this.
If you choose GetX, you are no longer building a flutter app, you are building a GetX app, and you will want GetX developers to work with the code and at some point it will becomes unsustainable and you will need to start over.
GetX is bottom of the barrel flutter development, and is only valuable for people who churn out large amounts of apps for customers that have no idea what they want.
The page is called "Awesome Flutter" but it should be called "Third-party Flutter code to fill some of the holes in Flutter".
It is funny to see this theme getting repeated in various domains: at the same time, you will get users who complain that there are not enough choices for them in domain X, while others complain that there are too many choices in the same domain X. And usually there is no single best solution to rule them all.
E.g. in these specific items, I've found bloc + freezed-based code generation to do state works much better for me than any alternatives. ymmv.
YMMV definitely applies :) Since I have some experience with exactly that alternative: I see bloc + freezed as the antithesis to GetX. "Clean" abstraction over "simple" code. There might be more extreme example for both sides of course, but this has been my impression.
We do use bloc + freezed for some specific flows in the app where the abstraction just fit better. A better fitting abstraction is a big plus on its own for those usecases. On the other hand, bloc had a bunch of breaking changes (nicely visible in https://pub.dev/packages/flutter_bloc/changelog), and that especially in combination with hydrated bloc has given us a bunch of grief. I hate breaking changes more than anything.
It might still be a better solution - so really, YMMV - if your goal is maximum abstraction to be able to change frameworks (or in this case, I assume it would be about state management solutions), after all that's where the solution is coming from. For me, that was an anti-goal, abstraction = complexity, while minimal complexity with maximal development speed was what we needed. GetX fit perfectly for that. Admittedly, ignoring some things to learn with lists and at the beginning strange issues with Obx change detection, but the latter got better, either with bug fixes or experience. If Obx misbehaves now it has always been a clear fault on our side.
Saying this doesn't help anyone. There are many alternatives and as you say, they compete fiercely for Github stars. GetX is popular package, but it has it's drawbacks: maintainer and bloat.
- Maintainer: he's been known to make wild claims about his package, and target other alternatives with strong unbacked opinions.
- Bloat: it tries to do a lot of things. Integration with other packages, concepts and tools don't work well - certainly doesn't integrate easily.
And sorry, I really think this stated clearly is helpful. It's not worth your time to even look at alternatives. Sure, that could change in the future if the plugin gets abandoned, but it has seen good maintenance so far and zero breakage. Everything else to my eyes is FUD.
The solution to many people debating is not to just pick one side of the debate because the debate doesn't matter - you think.
Have you tried building android apps with Compose? It's significantly better than the old view system in android.
Keep going!
At that point I suspect you will see the importance of compiling to JS declining rapidly.
Side note: The other major push that seems relevant to some of the other comments here is they are also looking to redo the shader pipeline from scratch and make that AOT compiled as well because right now it tries to just JIT all of that and it isn’t always very predictable as a result. [1]
So combining that along with a WASM target I actually feel super bright about the future of Flutter as a tech choice on web, desktop, mobile etc…
They have some more detail about both of these things in their Roadmap [2] if you’re interested.
Dart is a relatively simple language and you'll get the hang of it quite quickly.
The widget-tree framework of flutter makes it easy for you to just have small amounts of code that all chain together, and it becomes easier to find your mistakes and grow your platform.
I recommend going for it if you have an interest.
Dart is single threaded, but the event loop is better than threads for most things, except heavy calculations, but that's what isolates are for. This is probably the best way to do it even in C when latency is important. CPU schedulers tend to leave you with less control over latency when there is underutilization or yielding.
When I tried it a couple of weeks ago on an old Android device (Pixel 3A) there was a little jank. Then I tried a couple apps bundled with Android and was surprised to find a comparable amount of jank.
I've heard it's worse on iOS though.
I had also higher expectation regarding Dart FFI - I think with their ffigen we are still only in ctypes like python bindings territory. Nowhere near something like pybind11 [0] for c++ bindings yet.
Expo has been making unbelievably rapid progress with tooling, documentation, consistent, high quality API's and general improvements. Evan Bacon + team are really impressive to watch
1) Need mostly cross platform desktop and using hardware extensively (bluetooth, camera, audio, nfc, sensors, etc.) -> Qt
2) Have web expertise or need easily to find well paid job and need mostly web, android, ios app -> React Native
3) Need only iOS, Android app that is mostly custom UI with some smooth animation mostly for some side project (not many jobs in the market comparing to React Native or iOS/Android Native) -> Flutter
But Google seems to be betting on multiple horses here. They also created Jetpack Compose. And of course Jetbrains extended that to Compose Desktop and Compose Web so that ecosystem is actually becoming quite interesting together with their multi platform Kotlin compilers. Compose Desktop does not currently use the Kotlin native compiler unfortunately but it does use Skia, which is the same graphics library that Google uses for Chrome and Flutter. If they'd fix the desktop variant to use the native compiler, they'd be able to target basically any platform. Including IOS.
IMHO that is such an obvious thing to do for Jetbrains that I pretty much assume that they are planning to go there. That would make this a direct competitor to Flutter.
Compose is getting quite popular despite still being relatively new. IMHO, if Jetbrains (or Google) get their act together and make that usable for IOS, there would be a lot of developers that would use that. I know I would. Flutter is not for me. I'm sure it's great but I have no desire to learn Dart.
We are currently using Kotlin js to be able to target mobile and web and kotlin jvm on our servers. We package up our app using Cordova and we have integrated a few plugins to e.g. do things with NFC. It works great. Performance is not an issue for us. And having just one code base and 1 UI team is critical for us. But I wouldn't mind some more options for cross platform development. Browsers are a necessary evil currently to target mobile and desktop with 1 application. But the boundaries between these platforms are increasingly artificial.
Just to give you example In many ways I prefer Ruby than Python as a language but Python is just swiss army knife and in many cases you are one PIP install away to finding library that solves your problem. Maybe Python doesn't have such a nice web framework as Ruby on Rails but ruby is not much used elsewhere.
I think people complaining about Dart as a chosen language not because of it's features but because
1) you have to learn and/or redevelop new SDK for it,
2) language doesn't have good interrop with any other languages (like Kotlin -> Java, Swift -> Objective-C, TypeScript -> JavaScript, Objective-C -> C++, Rust -> C, C++ -> C)
3) ecosystem is small
I really enjoy writing Flutter apps but the ability to push updates and bypass store reviews has been extremely valuable for multiple companies I've built apps for.
* Payment * Video with DRM
It’s their payment platforms and Ads platform and a centrepiece of their upcoming operating system. It has literally billions of dollars depending on it. It’s not going anywhere.
It's not going be that easy for them like with android. They had WearOS for a while and I bet they had give some big carrot to Samsung so that they finally use it instead of Tizen. Same with Google TV - Samsung prefer tizen, LG sticks with webOS. Google's IoT platforms (forgot the name) were a flop. Chromebook - mostly irrelevant and devs don't want to write software for that - recently they killed Chrome App Store.