7 ms·

Flutter Web: A Fractal of Bad Design

124 points by adrian_mrd 6y ago

obarthelemy 6y ago
I've got to issues with that blog post: 1- it seems concerned with accessibility, and accessibility only
serial_dev 6y ago
I'm a Flutter developer and I believe that you can create very good apps with it for Android and iOS already and it has great potential on the desktop. The Flutter developer and user experience on the web is, however, not great. As a dev, you don't see the HTML elements you are used to, and as a user, some things will behave strangely or not work at all. I can spot a Flutter web app in about 3 seconds (I have a web developer background). In my opinion, Flutter for web makes sense when you already have mobile apps and you want to offer your services on the web quickly. You can build your existing mobile apps for the web in a matter of hours in most cases. However, if your company realizes that the web platform is important for the customers, it makes sense to invest time to migrate off of Flutter web to React/Vue/Angular, or if you want to share code or you just like Dart, you can also use AngularDart. Flutter for web might be overhyped, but for some purposes, it makes sense as a temporary solution, as a quick win. It's also important to keep in mind that the web offering of Flutter is not yet stable, so the team is very much aware that it's "not there yet".
remexre 6y ago
I feel like if you're trying to make code Just Work on both the web and any other platform, you either end up implementing HTML and CSS for the other platform, or do something that breaks the web. > Adapting old programs to fit new machines usually means adapting new machines to behave like old ones. > - Alan Perlis
- detaro 6y ago
  You won't get it automatically foolproof, but you'll have at least a good chunk of the information you could expose, and have extension places for developers to easily inform a HTML version. I'm not familiar with the accessibility APIs on mobile, but I presume some of this would also be useful for them.
- rektide 6y ago
  Alas a bunch of absolutely positioned elements wasn't enough. The team went full "the web is now VNC" mode.
throwaway122kk 6y ago
Can maybe Google get flutter to compile down to semantic html hence addressing writers concerns
- tlarkworthy 6y ago
  This is what the author was addressing with "It’s worth noting that Flutter for Web is currently in beta and the problems I am about to detail could be addressed. However, I believe these issues are fundamental to Flutter’s design choices so I feel confident in my criticism." I agree, this is a fundamental problem they are probably unable to fix.
  - dathinab 6y ago
    For me it looked like that, too. I.e. flutter will never work friction less with the current web, at least for screen readers etc. But I think what google will try to do in one or two years is to add extensions to the web to make flutter work well again (from their POV).
- bsaul 6y ago
  It was always my impression that rendering to a canvas was the quick n dirty way to get something running on the web, not the long term plan for flutter
radicalriddler 6y ago
Inspect Element doesn't even work on the Demo App they linked to. It's covered by this glass pane so you can't get past.
- rektide 6y ago
  In Clutter's CanvasKit there is just a canvas, pushing pixels in your face. Be glad you got a hard to use DOM, that's better than the abomination that is coming.
  - pax_americana 6y ago
    You seem you have a hate boner for CanvasKit. It's just a Skia project that Flutter uses as one of its render targets. It's main use is to provide a better Canvas painting API than what browsers offer natively.
    - rektide 6y ago
      I do quite dislike those who substitute out the HyperText Markup Language for big giant moving pictures, yes. Having my rich media replaced by extremely dumb media that I cannot deploy extensions against is, imo, a colossal downgrade & deeply deeply injurious to civilization, a severe & critical regression against information's usability & utility.
jsjohnst 6y ago
Anybody else get flashbacks to the days of Adobe Flash with regards to Flutter Web? About the only positive difference I see is that it uses the browser sandbox vs the Flash player and is thus arguably more secure, but otherwise it feels it has most of the same drawbacks.
yoavm 6y ago
Super important article, but I think he missed out on one of the most important points. Google pushes Flutter for web because Flutter is an experience you as a consumer can't control. As a company that makes most of it's money from ads - that's amazing. No more ad-blocking. Developers, resist. One the Web is built with Flutter it'll not be the Web anymore. It's be like TV.
- amelius 6y ago
  But can Google index what's in a Flutter app?
  - jmisavage 6y ago
    Maybe not right now, but they'll figure out a way. They figured out how to do it with SPAs.
    - whytaka 6y ago
      If there's a way to index, isn't there a way to find and block ads?
- nv-vn 6y ago
  People say stuff like this all the time but the truth is that Google as a company has very little direction at the scale of niche software like this. Google as an organization is not pushing Flutter in any meaningful capacity or trying to convince everyone to start adopting it. As a sibling comment asked, how would you expect a search engine giant to go for something that makes the web less indexable? The truth is that Google is a massive company with hundreds of teams that have 0 shared interest in any of their products and operate almost entirely independently.
  - yoavm 6y ago
    Yeah, people are saying this all the time, but the truth is that it's exactly the direction to web is taking. I'm not pretending to know how the decision was made, but I am pointing out that it goes very well with their bigger plans for the web (HTTP3, AMP, etc). I'm 100% sure Google will find a way to index Flutter based-website. I'm also 100% sure it'll be much harder to block ads, using a custom stylesheet, use reader mode, and practically any extension that manipulates the page.
rozab 6y ago
Oh my goodness. I tried opening that sample app on mobile and it was like interacting with a touchscreen ticket machine from 2005. I don't know if it was just broken on my browser (firefox android), or expects me to have the latest flagship to actually use it. Regarding the semantic HTML stuff, I don't think that's an issue inherent to the design, since flutter widgets tend to be highly semantic in nature. In fact, I think a platform like this could good for accessibility if it handles it properly instead of leaving it up to fallible developers.
- nikkwong 6y ago
  How though? All of the UI is rendered in a canvas element. This would break most existing screen readers and accessibility tools which rely on properly marked up and parseable HTML. I would suppose that the Flutter devs could provide some sort of bridge that would allow this to work (although I'm not sure how, unless the webkit team also steps in), but seems like an incredible amount of work and IMO with Google's history more likely to be abandoned than actually implemented.
- jtsiskin 6y ago
  Yes, I’m hoping it’s running in “dev mode” or something? Because even just scrolling on the latest iPhone was extremely low FPS and felt broken
  - nikkwong 6y ago
    The state transition animations also happen to be very choppy even on my beefed up PC.
- nv-vn 6y ago
  Yes, the real criticism of this article should have focused on the hard-to-fix problem of performance because it seemed absolutely abysmal to me -- multiple seconds before the page showed up as anything but black on both Firefox & Chrome.
- rektide 6y ago
  > In fact, I think a platform like this could good for accessibility if it handles it properly instead of leaving it up to fallible developers. Fluttercs CanvasKit will never be good for accessibility because it will never work with the tools user's use on the rest of the web. Tools expect hypertext, expect a dom, & smashing that on the rocks & turning the web into VNCh no matter how hard the team tries- is going to result in the kind of accessibility that matches well & works across the rest of the web.
kbrwn 6y ago
A uninformative rant about a software beta. Personally I am tired of these sort of posts that scream about how everything new is terrible because it doesn't have X feature that is super important for "accessibility". No not every application framework needs to be the same so that your vim extension can work properly.
- dathinab 6y ago
  It's not at all about vim extensions. It's about people with visual or motoric impairments using the web.
  - kbrwn 6y ago
    Beta version of software often ignore users that may have visual or motoric impairment. Plus much of the web is hositle to disabled folks already (like youtube not having closed captions on many popular videos) it's not a good argument against flutter imo.
- joduplessis 6y ago
  I think you're missing a lot when you start comparing the web to vim extensions, IMO of course.
prewett 6y ago
If you want a linked network of documents, HTML / semantic web is great. Problem is, sometimes you want interactive elements in your document (like navigation menus), and sometimes you want a layout that is precise but is also responsive to the browser width, and sometimes you really want a native application that works on all platforms that people don't have to download (and update) something special. HTML and semantic web get less and less useful as you go down that list. Flutter is trying to solve the cross-platform application problem. If your problem is well-addressed by a document, then you don't have the same problem that Flutter is solving, so yeah, you probably won't like it.
jmisavage 6y ago
This reminds me of Adobe's early attempts to get Flash on the iPhone. You could publish a Flash project to target iOS with their AIR runtime, which converted everything into OpenGL. Tons of people made apps with it, but the performance was terrible and all the UI controls were non-native and thus had no voiceover support. This is just Google reinventing or should I say rediscovering past techniques of app building.
- BenGosub 6y ago
  The main value is to target multiple platforms at once. Otherwise there's no point in choosing Flutter to develop for the web.
  - deleted 6y ago
    [deleted]
  - nexuist 6y ago
    As someone who shipped an app in Flutter on Android and iOS, there is practically 0 code re-usability between web and mobile. Regardless of platform, mobile apps feel the same - they both have navbars, tab bars, lists and table views, etc. Even if I could use an iOS navbar on web, it would look so out of place it's not worth considering. Okay, so you can't reuse UI components, surely you can reuse the Dart code that makes up the guts of the webapp? And, sure, you could, but why would you when you can spend maybe 10 minutes to translate it to native JS (the two languages are practically identical) and ship it without the Flutter Web dependency? I actually feel like it'd be easier for me to convert some of my Flutter components into React ones, than to try and learn Flutter Web and set up its whole toolchain. I think it's a cool idea, but it's not meant for widespread use (speculation): it's meant specifically for Google's Fuchsia, where they are probably planning on shipping Web applications pretending to be native desktop apps along with the full Chrome experience much like they did for Chromebook.
- dathinab 6y ago
  I don't think so. A major difference is that as far as I can tell flutter is long term meant to be the main way to write native Android apps. Flutter on web has this kind of problem due to how they handle text differently then a HTML does and HTML provides no way to customize it to the way they need it. Flutter on Android, iOs, Linux, etc. won't have this problem. Most modern UI's render with a graphics API like OpenGl (ES), Firefox does so for HTML.
danielEM 6y ago
Not a fan of flutter at all, but the fact that everyone in modern web tries to mimic something instead be able to do it straight says something about modern web standards itself.
- randompwd 6y ago
  It does. It says that designers and product managers don't care to bound themselves by reality.
joduplessis 6y ago
I don't think any person, even remotely, concerned about the open web / accessibility / building decent user experiences ever considered Flutter Web as a viable option for developing web apps. The only people I've EVER heard talk positively about this is Google & other Flutter Developers that don't seem too concerned about web standards.
- dathinab 6y ago
  Also let's be honest I'm not sure flutter web really matters. Flutter is a cross-paltform app framework. If you have a app on all platforms you (the company) care about the web app would often become just a seconds class citizen which you (the company) only have as some users are hesitant to install apps and some few users have some exotic platform or need access during holidays after their laptop was stolen etc. Anyway from a business POV a second/third class citizen you don't want to spend much money on. So flutter web would be good enough (once it's out of beta, at which point text selection likely will somewhat work). But if you ever have a web app as first class target you probably would never go for flutter anyway. My prediction: - Flutter will long term be come the new default native way to write apps on google phones. Dart will very slowly replace java. - Flutter will become a serious way to write the UI of apps on Linux, through maybe not as big as Qt/Gtk. But likely a common choice companies which target Linux as 2nd/3rd class citizen. - Companies mainly targeting Android will use flutter for their iOs, Windows, Linux, Web apps to save cost. - Google pushes some new Web API's around accessibility to provide a better flutter on web experience. Making it again harder for non chrome browsers, through in this case not intentionally.
  - joduplessis 6y ago
    Yea to me I honestly think Google is throwing stuff at a wall and seeing what sticks. Personally I hope Flutter remains primarily on mobile.
  - jitl 6y ago
    I really doubt that Flutter/Dart will displace Android/Jetpack Compose/Kotlin. Kotlin already very quickly replaced Java for new Android code at many places, and it offers big productivity advantages without any downsides. So, on Android there’s a strengthening incumbent. I think Flutter could evolve an interesting platform for “line of business” or “rapid application development” projects, similar to Lazarus/Delphi. In that respect, I agree that we could see growth for flutter for low-cost cross-platform projects, and on Linux. But, after the failures of React Native, none of the mobile developers I talk to have any interest in these non-native, layered-on-top frameworks that need a plugins ecosystem to call into native code or native APIs. Your productivity is basically held hostage by the runtime to an even greater degree than it already is on a mobile OS. I also don’t thing Google needs any new web APIs to make Flutter accessible. They can position some invisible divs with the right spots with the right WARIA attributes.
dathinab 6y ago
> How did anyone look at this and say “yeah nah, selecting text isn’t an important use case on the web”? If you firstly target mobile. Many users will hardly ever select text and will be used to it not working sometimes. So while it's horrible bad it's also not at the top of the priority list and "can be done later".
- crmrc114 6y ago
  Yes, mobile users will never try to highlight and select text to "search with Google" or copy to paste into another application. That's a pretty huge design flaw. I highlight text all the time mate. Pretty common feature for some of us who read on our fondle-slabs.
  - dathinab 6y ago
    Sure you do, but look at non tech-savvy people. I have meet more then one or two people which wouldn't even be sure you can copy past text if you ask them now.
    - crmrc114 6y ago
      My elderly family members copy and paste recipes for cooking on their kitchen tablets into notes on their devices so they can edit them. I think the barrier for copy/paste is pretty low.
nv-vn 6y ago
I think this article is far too cynical. These demos show an early version of Flutter Web rather than a stable, production-ready system. I'm not sure how the author stumbled across Flutter Web and thought otherwise, but I think they largely missed the point here; in the very page they link to explaining "Flutter Web", all the content is preceded by a large warning stating that this is a beta and the bottom of the page talks all about use cases where Flutter doesn't make sense on the web [1]. It's important to take a step back here and remember that the web did not start as accessible, nor did any of the native desktop UI frameworks. The author suggests that the only way to "fix" Flutter Web is to throw it all away and start over, which is just patently false when comparing to the history of the competition. Not only would it be ridiculously easy to make Flutter generate semantic HTML without changing any of the core functionality or interface, but in fact HTML already features a widely-used solution for exactly the use case the OP focuses on [2]. The author also tries to take a stab at Flutter initially for attempting to replace HTML, but I think this is another misunderstanding of what Flutter is trying to accomplish. The goal is not to replace the web with something else, but instead streamline creating web apps (in much the same way as React, Vue, etc.) With that in mind, many of the criticisms stop making sense -- are people really expecting CSS restyling tricks and Vimium to work in modern web apps like Google Drive or Discord? To take one (rather sneering) quote out of the authors playbook: >To end I’d like to leave you with a quote from Dr. Ian Malcolm. >Your scientists were so preoccupied with whether or not they could, they didn’t stop to think if they should. [1] https://flutter.dev/web https://flutter.dev/web [2] https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role https://developer.mozilla.org/en-US/docs/Web/Accessibility/A...
- collective-intl 6y ago
  Thank you. Unbelievable how many people would rather no one try anything new at all. This article and the responses show the worst of HN -- bad faith attacks, no attempt to give the benefit of the doubt, no engagement with the underlying vision, unwarranted pessimism. Why not ask what niche this tech excels in, or what impact a refined version could have? Most projects fail -- that's obvious -- but how might this one succeed? In short, why so much negativity? The more you default to these views, the likelier it is you and everyone around you will never accomplish anything. This is the poison that is destroying Hacker News and likewise many startups before they have even been imagined.
BenGosub 6y ago
It looks like they are developing Flutter Web in isolation, unconcerned about what are the needs of the broader public for a web framework.
- rektide 6y ago
  'We wrote this cross platform framework, now we must bend to break the web to fit it.'
obarthelemy 6y ago
I've got 2 issues with that blog post: 1- it seems concerned with accessibility, and accessibility only, and accessibility from standard 3rd party tools only. Leaping from accessibility issues in alpha software to "fractal of bad" seems a bit rushed 2- It's entirely negative. Cross-platform aside (which is a huge win if it ends up working), HTML/js has issues, and Flutter has solutions. Certainly not universal and perfect, but I'm sure useful at least in some cases ?
gix12 6y ago
The article is missing the point of flutter. It's designed to build apps, not semantic web. No way flutter apps will be indexable. I believe one of the web rendering backends(there are 2) is using webgl and compiles to webassembly, so there goes your divs... But I must say as an app programming platform, flutter is brilliant. The ability to pass around statically typed classes representing everything from widget to text style to animation is so fast and logical, that it actually made me enjoy frontend programming. No need to mess around with html+js+css+some macro language to glue it together. Did I mention i run the same flutter app on android, ios, web and linux box? I just wish they would use something like kotlin instead of dart, but still, it's well worth it.
- liuliu 6y ago
  It is a generic accessibility problem with any UI toolkit that goes beyond the "native toolchain". However, customizing everything from drawing layer is the only way to achieve any kind of UI consistency, especially on mobile. You can go very far with React Native approach (using native widgets), but there are limits. There are many failed attempts to draw UI oneself. But ultimately, it is because development cost (you need to implement a lot of widgets, supporting new OS capabilities in on-going basis). If Google can support these development cost, it can be done. Accessibility issues can be solved for these toolkits. OS often exposed some kind of the API to achieve that. For web, you certainly can have hidden elements to support accessibility. Again, it is just a matter of development cost. As you said, nobody should seriously mistake Flutter app with semantic web. Most of the SPA online will break if you style CSS differently or disable Javascript, this is just the world we live in. The missing of semantic information for Flutter app should be treated as the generic accessibility problem, not some resistance to the semantic web vision.
reader_mode 6y ago
I'm starting a new project in flutter and have a decent chunk of experience with frontend tech. Here's my thoughts on it so far, starting with the good: - Rendering performance is really good - Live reload is the best I've seen on any platform - Layout/rendering engine is powerful and the widgets are high-quality - building your own widgets for a cross platform UI framework is the right way to go because building abstractions between cross platform stuff (like Xamarin.Forms) winds up giving you the lowest common denominator The bad : - Dart language while functional is very tedious and pointlessly rigid - you can see the language is designed by VM engineers - it makes silly UX choices for the sake of implementation performance - TypeScript is a much better language despite it's legacy JS constraints - tooling works (which is a nice surprise in the npm era) but can be spotty (eg. IDE/analysis engine craps out hard on invalid code it brings my 32GB ram/6 core i9 to a crawl at times) - the framework itself is also designed in the spirit of the language - a lot of effort towards implementation and performance convenience and very little effort on developer usability for the APIs - the new Navigator 2.0/Router is an excellent example - the worst router implementation I've seen to date. Also their documentation leaves a lot to be desired - Flutter framework architecture seems immature - it lacks tools for efficient design patterns from both OO and FP worlds, their BLoC state management is a complicated mess that offers very little value - Redux is far superior in this regard but the language is so limited that using Redux approach is just too verbose I agree with authors objections but I disagree with the conclusion - I think web apps need to move away from DOM as the UI rendering engine - DOM was built for documents not applications - the semantic information he's crying about is a result of patchwork of repurposed tools. Flutter has really good accessibility tech and IMO the Flutter Web problem is IMO that they are not taking the DOM out of the equation far enough - ideally it would just be a WebGL canvas rendering the UI and it would integrate with accessibility tech in other ways. The practical problem with that is that WebGL is a sandboxed version of native GL API so the performance of building Skia on WebGL could be significantly worse than native.
gfarah 6y ago
Anecdotally, we currently have one mobile app (500k-ish users) and one web app (2500-ish users) both in Flutter. Even though there is still a lot that needs to improve in Flutter web, our frontend team promised the web app in 3 months and ended up delivering (in 3.5 months) web and mobile version of the small (2500-ish users) app. Users seems to love it, business stakeholders were thrilled and the frontend team enjoyed working with the framework.
deleted 6y ago
[deleted]
darepublic 6y ago
I didn't know flutter for web was do abysmal
hpaavola 6y ago
There is no sane way of running automated acceptance tests for any of these canvas thingies. All existing test automation tools rely on proper DOM with even somewhat semantic HTML. If everything is just canvas, we are back to image recignition and clicking by coordinates. And that is always extremely slow and brittle approach; one color change requires updates to many many reference images. Resolution/scaling/window size/window position changes coordinates. Etc etc. In practice there is no way of testing pages done using Flutter Web.

124 points by adrian_mrd 6y ago

I've got to issues with that blog post: 1- it seems concerned with accessibility, and accessibility only

I'm a Flutter developer and I believe that you can create very good apps with it for Android and iOS already and it has great potential on the desktop. The Flutter developer and user experience on the web is, however, not great. As a dev, you don't see the HTML elements you are used to, and as a user, some things will behave strangely or not work at all. I can spot a Flutter web app in about 3 seconds (I have a web developer background). In my opinion, Flutter for web makes sense when you already have mobile apps and you want to offer your services on the web quickly. You can build your existing mobile apps for the web in a matter of hours in most cases. However, if your company realizes that the web platform is important for the customers, it makes sense to invest time to migrate off of Flutter web to React/Vue/Angular, or if you want to share code or you just like Dart, you can also use AngularDart. Flutter for web might be overhyped, but for some purposes, it makes sense as a temporary solution, as a quick win. It's also important to keep in mind that the web offering of Flutter is not yet stable, so the team is very much aware that it's "not there yet".

remexre 6y ago

I feel like if you're trying to make code Just Work on both the web and any other platform, you either end up implementing HTML and CSS for the other platform, or do something that breaks the web. > Adapting old programs to fit new machines usually means adapting new machines to behave like old ones. > - Alan Perlis

detaro 6y ago
You won't get it automatically foolproof, but you'll have at least a good chunk of the information you could expose, and have extension places for developers to easily inform a HTML version. I'm not familiar with the accessibility APIs on mobile, but I presume some of this would also be useful for them.
rektide 6y ago
Alas a bunch of absolutely positioned elements wasn't enough. The team went full "the web is now VNC" mode.

throwaway122kk 6y ago

Can maybe Google get flutter to compile down to semantic html hence addressing writers concerns

tlarkworthy 6y ago
This is what the author was addressing with "It’s worth noting that Flutter for Web is currently in beta and the problems I am about to detail could be addressed. However, I believe these issues are fundamental to Flutter’s design choices so I feel confident in my criticism." I agree, this is a fundamental problem they are probably unable to fix.
- dathinab 6y ago
  For me it looked like that, too. I.e. flutter will never work friction less with the current web, at least for screen readers etc. But I think what google will try to do in one or two years is to add extensions to the web to make flutter work well again (from their POV).
bsaul 6y ago
It was always my impression that rendering to a canvas was the quick n dirty way to get something running on the web, not the long term plan for flutter

radicalriddler 6y ago

Inspect Element doesn't even work on the Demo App they linked to. It's covered by this glass pane so you can't get past.

rektide 6y ago
In Clutter's CanvasKit there is just a canvas, pushing pixels in your face. Be glad you got a hard to use DOM, that's better than the abomination that is coming.
- pax_americana 6y ago
  You seem you have a hate boner for CanvasKit. It's just a Skia project that Flutter uses as one of its render targets. It's main use is to provide a better Canvas painting API than what browsers offer natively.
  - rektide 6y ago
    I do quite dislike those who substitute out the HyperText Markup Language for big giant moving pictures, yes. Having my rich media replaced by extremely dumb media that I cannot deploy extensions against is, imo, a colossal downgrade & deeply deeply injurious to civilization, a severe & critical regression against information's usability & utility.

jsjohnst 6y ago

Anybody else get flashbacks to the days of Adobe Flash with regards to Flutter Web? About the only positive difference I see is that it uses the browser sandbox vs the Flash player and is thus arguably more secure, but otherwise it feels it has most of the same drawbacks.

yoavm 6y ago

Super important article, but I think he missed out on one of the most important points. Google pushes Flutter for web because Flutter is an experience you as a consumer can't control. As a company that makes most of it's money from ads - that's amazing. No more ad-blocking. Developers, resist. One the Web is built with Flutter it'll not be the Web anymore. It's be like TV.

amelius 6y ago
But can Google index what's in a Flutter app?
- jmisavage 6y ago
  Maybe not right now, but they'll figure out a way. They figured out how to do it with SPAs.
  - whytaka 6y ago
    If there's a way to index, isn't there a way to find and block ads?
nv-vn 6y ago
People say stuff like this all the time but the truth is that Google as a company has very little direction at the scale of niche software like this. Google as an organization is not pushing Flutter in any meaningful capacity or trying to convince everyone to start adopting it. As a sibling comment asked, how would you expect a search engine giant to go for something that makes the web less indexable? The truth is that Google is a massive company with hundreds of teams that have 0 shared interest in any of their products and operate almost entirely independently.
- yoavm 6y ago
  Yeah, people are saying this all the time, but the truth is that it's exactly the direction to web is taking. I'm not pretending to know how the decision was made, but I am pointing out that it goes very well with their bigger plans for the web (HTTP3, AMP, etc). I'm 100% sure Google will find a way to index Flutter based-website. I'm also 100% sure it'll be much harder to block ads, using a custom stylesheet, use reader mode, and practically any extension that manipulates the page.

rozab 6y ago

Oh my goodness. I tried opening that sample app on mobile and it was like interacting with a touchscreen ticket machine from 2005. I don't know if it was just broken on my browser (firefox android), or expects me to have the latest flagship to actually use it. Regarding the semantic HTML stuff, I don't think that's an issue inherent to the design, since flutter widgets tend to be highly semantic in nature. In fact, I think a platform like this could good for accessibility if it handles it properly instead of leaving it up to fallible developers.

nikkwong 6y ago
How though? All of the UI is rendered in a canvas element. This would break most existing screen readers and accessibility tools which rely on properly marked up and parseable HTML. I would suppose that the Flutter devs could provide some sort of bridge that would allow this to work (although I'm not sure how, unless the webkit team also steps in), but seems like an incredible amount of work and IMO with Google's history more likely to be abandoned than actually implemented.
jtsiskin 6y ago
Yes, I’m hoping it’s running in “dev mode” or something? Because even just scrolling on the latest iPhone was extremely low FPS and felt broken
- nikkwong 6y ago
  The state transition animations also happen to be very choppy even on my beefed up PC.
nv-vn 6y ago
Yes, the real criticism of this article should have focused on the hard-to-fix problem of performance because it seemed absolutely abysmal to me -- multiple seconds before the page showed up as anything but black on both Firefox & Chrome.
rektide 6y ago
> In fact, I think a platform like this could good for accessibility if it handles it properly instead of leaving it up to fallible developers. Fluttercs CanvasKit will never be good for accessibility because it will never work with the tools user's use on the rest of the web. Tools expect hypertext, expect a dom, & smashing that on the rocks & turning the web into VNCh no matter how hard the team tries- is going to result in the kind of accessibility that matches well & works across the rest of the web.

kbrwn 6y ago

A uninformative rant about a software beta. Personally I am tired of these sort of posts that scream about how everything new is terrible because it doesn't have X feature that is super important for "accessibility". No not every application framework needs to be the same so that your vim extension can work properly.

dathinab 6y ago
It's not at all about vim extensions. It's about people with visual or motoric impairments using the web.
- kbrwn 6y ago
  Beta version of software often ignore users that may have visual or motoric impairment. Plus much of the web is hositle to disabled folks already (like youtube not having closed captions on many popular videos) it's not a good argument against flutter imo.
joduplessis 6y ago
I think you're missing a lot when you start comparing the web to vim extensions, IMO of course.

prewett 6y ago

If you want a linked network of documents, HTML / semantic web is great. Problem is, sometimes you want interactive elements in your document (like navigation menus), and sometimes you want a layout that is precise but is also responsive to the browser width, and sometimes you really want a native application that works on all platforms that people don't have to download (and update) something special. HTML and semantic web get less and less useful as you go down that list. Flutter is trying to solve the cross-platform application problem. If your problem is well-addressed by a document, then you don't have the same problem that Flutter is solving, so yeah, you probably won't like it.

jmisavage 6y ago

This reminds me of Adobe's early attempts to get Flash on the iPhone. You could publish a Flash project to target iOS with their AIR runtime, which converted everything into OpenGL. Tons of people made apps with it, but the performance was terrible and all the UI controls were non-native and thus had no voiceover support. This is just Google reinventing or should I say rediscovering past techniques of app building.

BenGosub 6y ago
The main value is to target multiple platforms at once. Otherwise there's no point in choosing Flutter to develop for the web.
- deleted 6y ago
  [deleted]
- nexuist 6y ago
  As someone who shipped an app in Flutter on Android and iOS, there is practically 0 code re-usability between web and mobile. Regardless of platform, mobile apps feel the same - they both have navbars, tab bars, lists and table views, etc. Even if I could use an iOS navbar on web, it would look so out of place it's not worth considering. Okay, so you can't reuse UI components, surely you can reuse the Dart code that makes up the guts of the webapp? And, sure, you could, but why would you when you can spend maybe 10 minutes to translate it to native JS (the two languages are practically identical) and ship it without the Flutter Web dependency? I actually feel like it'd be easier for me to convert some of my Flutter components into React ones, than to try and learn Flutter Web and set up its whole toolchain. I think it's a cool idea, but it's not meant for widespread use (speculation): it's meant specifically for Google's Fuchsia, where they are probably planning on shipping Web applications pretending to be native desktop apps along with the full Chrome experience much like they did for Chromebook.
dathinab 6y ago
I don't think so. A major difference is that as far as I can tell flutter is long term meant to be the main way to write native Android apps. Flutter on web has this kind of problem due to how they handle text differently then a HTML does and HTML provides no way to customize it to the way they need it. Flutter on Android, iOs, Linux, etc. won't have this problem. Most modern UI's render with a graphics API like OpenGl (ES), Firefox does so for HTML.

danielEM 6y ago

Not a fan of flutter at all, but the fact that everyone in modern web tries to mimic something instead be able to do it straight says something about modern web standards itself.

randompwd 6y ago
It does. It says that designers and product managers don't care to bound themselves by reality.

joduplessis 6y ago

I don't think any person, even remotely, concerned about the open web / accessibility / building decent user experiences ever considered Flutter Web as a viable option for developing web apps. The only people I've EVER heard talk positively about this is Google & other Flutter Developers that don't seem too concerned about web standards.

dathinab 6y ago
Also let's be honest I'm not sure flutter web really matters. Flutter is a cross-paltform app framework. If you have a app on all platforms you (the company) care about the web app would often become just a seconds class citizen which you (the company) only have as some users are hesitant to install apps and some few users have some exotic platform or need access during holidays after their laptop was stolen etc. Anyway from a business POV a second/third class citizen you don't want to spend much money on. So flutter web would be good enough (once it's out of beta, at which point text selection likely will somewhat work). But if you ever have a web app as first class target you probably would never go for flutter anyway. My prediction: - Flutter will long term be come the new default native way to write apps on google phones. Dart will very slowly replace java. - Flutter will become a serious way to write the UI of apps on Linux, through maybe not as big as Qt/Gtk. But likely a common choice companies which target Linux as 2nd/3rd class citizen. - Companies mainly targeting Android will use flutter for their iOs, Windows, Linux, Web apps to save cost. - Google pushes some new Web API's around accessibility to provide a better flutter on web experience. Making it again harder for non chrome browsers, through in this case not intentionally.
- joduplessis 6y ago
  Yea to me I honestly think Google is throwing stuff at a wall and seeing what sticks. Personally I hope Flutter remains primarily on mobile.
- jitl 6y ago
  I really doubt that Flutter/Dart will displace Android/Jetpack Compose/Kotlin. Kotlin already very quickly replaced Java for new Android code at many places, and it offers big productivity advantages without any downsides. So, on Android there’s a strengthening incumbent. I think Flutter could evolve an interesting platform for “line of business” or “rapid application development” projects, similar to Lazarus/Delphi. In that respect, I agree that we could see growth for flutter for low-cost cross-platform projects, and on Linux. But, after the failures of React Native, none of the mobile developers I talk to have any interest in these non-native, layered-on-top frameworks that need a plugins ecosystem to call into native code or native APIs. Your productivity is basically held hostage by the runtime to an even greater degree than it already is on a mobile OS. I also don’t thing Google needs any new web APIs to make Flutter accessible. They can position some invisible divs with the right spots with the right WARIA attributes.

dathinab 6y ago

> How did anyone look at this and say “yeah nah, selecting text isn’t an important use case on the web”? If you firstly target mobile. Many users will hardly ever select text and will be used to it not working sometimes. So while it's horrible bad it's also not at the top of the priority list and "can be done later".

crmrc114 6y ago
Yes, mobile users will never try to highlight and select text to "search with Google" or copy to paste into another application. That's a pretty huge design flaw. I highlight text all the time mate. Pretty common feature for some of us who read on our fondle-slabs.
- dathinab 6y ago
  Sure you do, but look at non tech-savvy people. I have meet more then one or two people which wouldn't even be sure you can copy past text if you ask them now.
  - crmrc114 6y ago
    My elderly family members copy and paste recipes for cooking on their kitchen tablets into notes on their devices so they can edit them. I think the barrier for copy/paste is pretty low.

nv-vn 6y ago

I think this article is far too cynical. These demos show an early version of Flutter Web rather than a stable, production-ready system. I'm not sure how the author stumbled across Flutter Web and thought otherwise, but I think they largely missed the point here; in the very page they link to explaining "Flutter Web", all the content is preceded by a large warning stating that this is a beta and the bottom of the page talks all about use cases where Flutter doesn't make sense on the web [1]. It's important to take a step back here and remember that the web did not start as accessible, nor did any of the native desktop UI frameworks. The author suggests that the only way to "fix" Flutter Web is to throw it all away and start over, which is just patently false when comparing to the history of the competition. Not only would it be ridiculously easy to make Flutter generate semantic HTML without changing any of the core functionality or interface, but in fact HTML already features a widely-used solution for exactly the use case the OP focuses on [2]. The author also tries to take a stab at Flutter initially for attempting to replace HTML, but I think this is another misunderstanding of what Flutter is trying to accomplish. The goal is not to replace the web with something else, but instead streamline creating web apps (in much the same way as React, Vue, etc.) With that in mind, many of the criticisms stop making sense -- are people really expecting CSS restyling tricks and Vimium to work in modern web apps like Google Drive or Discord? To take one (rather sneering) quote out of the authors playbook: >To end I’d like to leave you with a quote from Dr. Ian Malcolm. >Your scientists were so preoccupied with whether or not they could, they didn’t stop to think if they should. [1] https://flutter.dev/web https://flutter.dev/web [2] https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role https://developer.mozilla.org/en-US/docs/Web/Accessibility/A...

collective-intl 6y ago
Thank you. Unbelievable how many people would rather no one try anything new at all. This article and the responses show the worst of HN -- bad faith attacks, no attempt to give the benefit of the doubt, no engagement with the underlying vision, unwarranted pessimism. Why not ask what niche this tech excels in, or what impact a refined version could have? Most projects fail -- that's obvious -- but how might this one succeed? In short, why so much negativity? The more you default to these views, the likelier it is you and everyone around you will never accomplish anything. This is the poison that is destroying Hacker News and likewise many startups before they have even been imagined.

BenGosub 6y ago

It looks like they are developing Flutter Web in isolation, unconcerned about what are the needs of the broader public for a web framework.

rektide 6y ago
'We wrote this cross platform framework, now we must bend to break the web to fit it.'

obarthelemy 6y ago

I've got 2 issues with that blog post: 1- it seems concerned with accessibility, and accessibility only, and accessibility from standard 3rd party tools only. Leaping from accessibility issues in alpha software to "fractal of bad" seems a bit rushed 2- It's entirely negative. Cross-platform aside (which is a huge win if it ends up working), HTML/js has issues, and Flutter has solutions. Certainly not universal and perfect, but I'm sure useful at least in some cases ?

gix12 6y ago

The article is missing the point of flutter. It's designed to build apps, not semantic web. No way flutter apps will be indexable. I believe one of the web rendering backends(there are 2) is using webgl and compiles to webassembly, so there goes your divs... But I must say as an app programming platform, flutter is brilliant. The ability to pass around statically typed classes representing everything from widget to text style to animation is so fast and logical, that it actually made me enjoy frontend programming. No need to mess around with html+js+css+some macro language to glue it together. Did I mention i run the same flutter app on android, ios, web and linux box? I just wish they would use something like kotlin instead of dart, but still, it's well worth it.

liuliu 6y ago
It is a generic accessibility problem with any UI toolkit that goes beyond the "native toolchain". However, customizing everything from drawing layer is the only way to achieve any kind of UI consistency, especially on mobile. You can go very far with React Native approach (using native widgets), but there are limits. There are many failed attempts to draw UI oneself. But ultimately, it is because development cost (you need to implement a lot of widgets, supporting new OS capabilities in on-going basis). If Google can support these development cost, it can be done. Accessibility issues can be solved for these toolkits. OS often exposed some kind of the API to achieve that. For web, you certainly can have hidden elements to support accessibility. Again, it is just a matter of development cost. As you said, nobody should seriously mistake Flutter app with semantic web. Most of the SPA online will break if you style CSS differently or disable Javascript, this is just the world we live in. The missing of semantic information for Flutter app should be treated as the generic accessibility problem, not some resistance to the semantic web vision.

reader_mode 6y ago

I'm starting a new project in flutter and have a decent chunk of experience with frontend tech. Here's my thoughts on it so far, starting with the good: - Rendering performance is really good - Live reload is the best I've seen on any platform - Layout/rendering engine is powerful and the widgets are high-quality - building your own widgets for a cross platform UI framework is the right way to go because building abstractions between cross platform stuff (like Xamarin.Forms) winds up giving you the lowest common denominator The bad : - Dart language while functional is very tedious and pointlessly rigid - you can see the language is designed by VM engineers - it makes silly UX choices for the sake of implementation performance - TypeScript is a much better language despite it's legacy JS constraints - tooling works (which is a nice surprise in the npm era) but can be spotty (eg. IDE/analysis engine craps out hard on invalid code it brings my 32GB ram/6 core i9 to a crawl at times) - the framework itself is also designed in the spirit of the language - a lot of effort towards implementation and performance convenience and very little effort on developer usability for the APIs - the new Navigator 2.0/Router is an excellent example - the worst router implementation I've seen to date. Also their documentation leaves a lot to be desired - Flutter framework architecture seems immature - it lacks tools for efficient design patterns from both OO and FP worlds, their BLoC state management is a complicated mess that offers very little value - Redux is far superior in this regard but the language is so limited that using Redux approach is just too verbose I agree with authors objections but I disagree with the conclusion - I think web apps need to move away from DOM as the UI rendering engine - DOM was built for documents not applications - the semantic information he's crying about is a result of patchwork of repurposed tools. Flutter has really good accessibility tech and IMO the Flutter Web problem is IMO that they are not taking the DOM out of the equation far enough - ideally it would just be a WebGL canvas rendering the UI and it would integrate with accessibility tech in other ways. The practical problem with that is that WebGL is a sandboxed version of native GL API so the performance of building Skia on WebGL could be significantly worse than native.

gfarah 6y ago

Anecdotally, we currently have one mobile app (500k-ish users) and one web app (2500-ish users) both in Flutter. Even though there is still a lot that needs to improve in Flutter web, our frontend team promised the web app in 3 months and ended up delivering (in 3.5 months) web and mobile version of the small (2500-ish users) app. Users seems to love it, business stakeholders were thrilled and the frontend team enjoyed working with the framework.

deleted 6y ago

[deleted]

darepublic 6y ago

I didn't know flutter for web was do abysmal

hpaavola 6y ago

There is no sane way of running automated acceptance tests for any of these canvas thingies. All existing test automation tools rely on proper DOM with even somewhat semantic HTML. If everything is just canvas, we are back to image recignition and clicking by coordinates. And that is always extremely slow and brittle approach; one color change requires updates to many many reference images. Resolution/scaling/window size/window position changes coordinates. Etc etc. In practice there is no way of testing pages done using Flutter Web.