7 ms·

> I know Flutter/Dart doesn't get much love here on HN but in my opinion I think it's much easier to reason about than a system like React which I think is the

by MrJohz 2y ago

> I know Flutter/Dart doesn't get much love here on HN but in my opinion I think it's much easier to reason about than a system like React which I think is the wrong level of abstraction compared to Flutter's render the entire widget tree approach. Could you expand on this a bit? My impression was that Flutter and React had relatively similar approaches to components, but I haven't had much experience with Flutter yet, so I'm interested to hear your experiences!

mdhb 2y ago
I’m too lazy right now to get into all of the specifics but just wanted to drop a quick note to say that I’ve been doing web development since 1997 and the difference between React and Flutter is like day and night. It’s genuinely hard for me to overstate the general quality of life improvements both from the developer experience and the overall quality of the apps I can produce in any given time frame. A big part of the reason for that is Dart is itself hands down the nicest language I’ve ever worked with. The team behind it got real serious when it comes to tooling and language design and everytime I have to go back to TypeScript I feel like I’m trying to run with a 50kg backpack on.
satvikpendem 2y ago
They do have similar approaches, I'm not sure what the above commenter is saying as both work basically the same (with React class components at least). Flutter doesn't have hooks but they're addressing that via macros next year, and anyway today there are packages like flutter_hooks and ReArch that enable hook-like functionality in Flutter today.
tmpfs 2y ago
At a basic level Flutter renders the entire widget tree and caches components that don't need to re-render rather than applying a diff of changes to the DOM. But it's really the Flutter/Dart API and widgets that make it much easier to work with, if I need to load some data asynchronously I use a `FutureBuilder`, if I need a stream of events I can use `StreamBuilder` etc. Compared to Reacts state, hooks, memo, effects etc. you end up with code that is far easier to reason about what is rendering when and why. Oh and the real killer feature is Flutters hot reload experience, it's easily the best DX I've seen for GUI work. As another comment mentioned it really is like night and day. I recommend giving it a try.
- MrJohz 2y ago
  I don't quite understand the point about rendering, unless you mean it in the Angular sense (i.e. on every state update, the whole app gets rendered, and elements are updated to the new state during that render). But I can imagine that the API can be easier. I think React handles state fairly well, but as soon as that state needs to interact with things outside the React world (http requests, continuously updating data, etc) then the current abstractions don't quite feel right.
  - beanjuiceII 2y ago
    react and flutter are pretty much the same thing, i do both for a living i am not sure what this person is going on about
  - fngjdflmdflg 2y ago
    >i.e. on every state update, the whole app gets rendered Yes, that's basically correct: >Calling setState notifies the framework that the internal state of this object has changed in a way that might impact the user interface in this subtree, which causes the framework to schedule a build for this State object.[0] The `build` method rebuilds the entire widget tree. So "the whole app" does not necessarily get re-rendered, only whatever is in the same widget as the changed state or below it, although potentially that can be the whole screen. Flutter also uses an algorithm to detect unchanged widgets and reuse them,[1] but conceptually the whole thing is re-rendered on state change. [0] https://api.flutter.dev/flutter/widgets/State/setState.html https://api.flutter.dev/flutter/widgets/State/setState.html [1] https://docs.flutter.dev/resources/inside-flutter#linear-reconciliation https://docs.flutter.dev/resources/inside-flutter#linear-rec...
    - elbear 2y ago
      React doesn't work in the same way? I don't know much about it, but I assumed it does.
      - fngjdflmdflg 2y ago
nu11ptr 2y ago
React = one small piece of a very large required ecosystem (HTML + CSS + Javascript + NPM + React + Vite + ???) Flutter = a UI framework for mobile/desktop/web (Flutter + Dart) On top of the purpose built nature, nearly everything is a Widget, even layout/styling making it pretty easy to grok very quickly.
- amelius 2y ago
  I personally prefer using many smaller components over using a large opinionated framework. But I'm not a big fan of React, so this could be better and worth a try.
  - tensor 2y ago
    It's less a "large opinionated framework" and more "fewer components overall. There is no HTML/CSS for example, it goes direct from Dart (equivalent to JS) to the Widget rendering system." Dart has its own build tools and package system that work well. You can still pull in dart libraries as you need them. Dart is also a much better language than JS. I can't tell you how many days I've lost to react/JS build tooling issues. A single problem can easily eat an entire day. With flutter/dart I haven't had a single issue like that.
- synergy20 2y ago
  flutter does a so so job on desktop and it's web version is wasm based. the job market for dart flutter is a drop while react is the lake. react with electron, react native, react itself together are still the only ones production ready cross platform GUI with widest adoption
  - mdhb 2y ago
    comments about job markets aside… The first and the third paragraphs really haven’t been true for some time now. Flutter is absolutely production ready as a cross platform GUI.
    - pzo 2y ago

by MrJohz 2y ago

mdhb 2y ago

I’m too lazy right now to get into all of the specifics but just wanted to drop a quick note to say that I’ve been doing web development since 1997 and the difference between React and Flutter is like day and night. It’s genuinely hard for me to overstate the general quality of life improvements both from the developer experience and the overall quality of the apps I can produce in any given time frame. A big part of the reason for that is Dart is itself hands down the nicest language I’ve ever worked with. The team behind it got real serious when it comes to tooling and language design and everytime I have to go back to TypeScript I feel like I’m trying to run with a 50kg backpack on.

satvikpendem 2y ago

They do have similar approaches, I'm not sure what the above commenter is saying as both work basically the same (with React class components at least). Flutter doesn't have hooks but they're addressing that via macros next year, and anyway today there are packages like flutter_hooks and ReArch that enable hook-like functionality in Flutter today.

tmpfs 2y ago

At a basic level Flutter renders the entire widget tree and caches components that don't need to re-render rather than applying a diff of changes to the DOM. But it's really the Flutter/Dart API and widgets that make it much easier to work with, if I need to load some data asynchronously I use a `FutureBuilder`, if I need a stream of events I can use `StreamBuilder` etc. Compared to Reacts state, hooks, memo, effects etc. you end up with code that is far easier to reason about what is rendering when and why. Oh and the real killer feature is Flutters hot reload experience, it's easily the best DX I've seen for GUI work. As another comment mentioned it really is like night and day. I recommend giving it a try.

MrJohz 2y ago
I don't quite understand the point about rendering, unless you mean it in the Angular sense (i.e. on every state update, the whole app gets rendered, and elements are updated to the new state during that render). But I can imagine that the API can be easier. I think React handles state fairly well, but as soon as that state needs to interact with things outside the React world (http requests, continuously updating data, etc) then the current abstractions don't quite feel right.
- beanjuiceII 2y ago
  react and flutter are pretty much the same thing, i do both for a living i am not sure what this person is going on about
- fngjdflmdflg 2y ago
  >i.e. on every state update, the whole app gets rendered Yes, that's basically correct: >Calling setState notifies the framework that the internal state of this object has changed in a way that might impact the user interface in this subtree, which causes the framework to schedule a build for this State object.[0] The `build` method rebuilds the entire widget tree. So "the whole app" does not necessarily get re-rendered, only whatever is in the same widget as the changed state or below it, although potentially that can be the whole screen. Flutter also uses an algorithm to detect unchanged widgets and reuse them,[1] but conceptually the whole thing is re-rendered on state change. [0] https://api.flutter.dev/flutter/widgets/State/setState.html https://api.flutter.dev/flutter/widgets/State/setState.html [1] https://docs.flutter.dev/resources/inside-flutter#linear-reconciliation https://docs.flutter.dev/resources/inside-flutter#linear-rec...
  - elbear 2y ago
    React doesn't work in the same way? I don't know much about it, but I assumed it does.
    - fngjdflmdflg 2y ago

nu11ptr 2y ago

React = one small piece of a very large required ecosystem (HTML + CSS + Javascript + NPM + React + Vite + ???) Flutter = a UI framework for mobile/desktop/web (Flutter + Dart) On top of the purpose built nature, nearly everything is a Widget, even layout/styling making it pretty easy to grok very quickly.

amelius 2y ago
I personally prefer using many smaller components over using a large opinionated framework. But I'm not a big fan of React, so this could be better and worth a try.
- tensor 2y ago
  It's less a "large opinionated framework" and more "fewer components overall. There is no HTML/CSS for example, it goes direct from Dart (equivalent to JS) to the Widget rendering system." Dart has its own build tools and package system that work well. You can still pull in dart libraries as you need them. Dart is also a much better language than JS. I can't tell you how many days I've lost to react/JS build tooling issues. A single problem can easily eat an entire day. With flutter/dart I haven't had a single issue like that.
synergy20 2y ago
flutter does a so so job on desktop and it's web version is wasm based. the job market for dart flutter is a drop while react is the lake. react with electron, react native, react itself together are still the only ones production ready cross platform GUI with widest adoption
- mdhb 2y ago
  comments about job markets aside… The first and the third paragraphs really haven’t been true for some time now. Flutter is absolutely production ready as a cross platform GUI.
  - pzo 2y ago