I am a die hard Flutter fan and have written more than 400 k lines of code (mobile & web apps ) in this technology. Make it SEO friendly and it'd beat all other stacks used for web development
As a Flutter developer developing website all I can say is that Flutter seems perfect for responsive pages where it looks perfect at any size, the smallest mobile to the biggest screen. Anything seems possible.
Basically google algo's will update their indexing model for canvas.. but we programmers need to tell Google that canvas is the future and update their seo indexing
@@JaredHasson contributing to the new stack & making it so preferable for web development, just like WordPress changed the CMS industry, we need to make a change in the SEO industry. Technology is all about making lives better, isn't it?
The key thing is: Flutter on web is fine for apps, but not for pages. Somewhat ironically, it works for the '2022 use case', but not for the '2002 use case'. A user will be fine with a loading time to open fairly heavy and often deep web apps like the examples shown. A user will not be fine with a long loading time to open public and relatively simple sites like a basic landing site, a news site, or a blog. Just drawing on a canvas also means SEO and browser functionality like read mode doesn't work.
It can work in the future, but yeah first step is t compete with react/angular/vuejs. Then will be time to start to think about server side rendering in a dart server, but even if it tries to enter the CMS arena, the CMS know-how only is more keen to PHP, so...does it even worth the effort?
Agreed it is powerful for complex web apps. But with the prominent rise is high performance no-code tools to build static websites like Webflow, the question at the start of each project becomes, what tool is best for the job at hand?
I really hope they fix the Seo for flutter web as fast as they can. As the only thing stopping a lot of flutter app developers to move on to flutter web is the Seo. If they crack it soon they might be the market leader in web. Since a lot of flutter devs are on a hold
No SEO support?! You heard it here first... The race right now is between Blazor, Maui, Flutter and Kotlin Multiplatform. If flutter support SEO so that flutter for Web is indexable and can reduce the bundle size just a tiny big it wins the complete multiplatform race, it's that simple.
My main question about flutter web is SEO, like I could develop any sort of web application that I want the search engine bot to understand my containt, SO!?
thanks for your great work Flutter/dart teams. Making flutter fully work on the web (with its advantages) will be crucial for so much wider adoption of flutter
I think here is the best place to ask this question: would you build a webshop with business analytics and this kind of stuff in Flutter or use a JS/TS framework
He already said it is under development to become stable first with WebASM, i guess the next version will be much around making web apps load faster and more recognisable by browser in term of SEO and loadspeed. CMIIW
That sounds great what flutter web is doing! I do have a question..whats the progression when it comes to the SEO, is that something that has improved with flutter web, or is that something that is still in the same place as it once was?
Fantastic talk. Thanks for bringing up Rive! I interacted with it in its early days but had forgotten about it, and it's perfect for my current project.
Happy that the video was helpful, Jared. If you'd like to try building and releasing your own web app via Flutter, check out this neat resource: goo.gle/3EyYmjP
Yay, another layer of complexity to learn web development, to get hired as a web developer, to build web applications, and having to wait for Flutter to be updated to use new web APIs. Sounds great... I'd prefer to see CSS and JavaScript continue to evolve, and the browser vendors create a Canvas UI framework to act as an alternative to HTML. The world doesn't need yet another third party UI framework for the web (hell, I don't think it needs even 1 with all of the powerful and useful CSS and JavaScript APIs).
Honestly, you're pointing out exactly why tools like Dart and Flutter should exist and evolve to become viable options. The world of web development is a mess, demanding developers become familiar with many different technologies even before they start diving into something like React. Over a decade ago, Adobe offered an alternative to web app development in the form of Flash, and those of us building complex web applications (as opposed to websites) enjoyed a far simpler, far more productive approach. While it's fair to say that Dart and Flutter are a different thing to learn, it should be with the understanding that in using them, we _replace_ a lot of technologies and tooling mess with a single unified system that's designed to work together. In other words, it's not "one more thing" to learn. It's something to potentially learn _instead._ And as someone who has lived in both worlds, I can definitely say that it's an option I want to see more of, not less.
I use flutter to make phone apps but as soon as I switch to web it sucked, single js lib of 7mb, this is not good experience on slow internet. This take time to be functional. Or I might be totally wrong with flutter web. In either case please discuss it
I think at the moment the 'web' has more potential to become the third major OS than GNU+Linux. Perhaps the flutter team should put more effort into distancing itself from Google (or any other big centralized organization)
Great video :) Quick question, how does Flutter render a WebView on the web? I.e. how does webview_flutter_web work from a technical point of view? Does it utilize the browser to render things inside the canvas? How does it do this?
@Kevin, Thanks for awesome flutter web insight. Can we use flutter web for our regular e-commerce kind of website. I have my mobile already built on flutter and I like to extend for web. I don't find any good example of websites who is using flutter web. All you show as examples are web tools and not regular website. Can you please help me with some examples of regular websites which built on flutter?
The "closing brackets syndrome" is the most reason I throw this Flutter away, very easy get confuse with around 4 or 5 brackets punch on your eyes, like nested of nested if else, wonder do they notice this design
@@rsocial453 even doing that when styling for individual widget still can't catch your eyes, if you using TextStyle or BoxDecoration or others property have many arguments it will break into many lines
I'd really like to give flutter a try, but most sites have mentioned the Flutter for web performance being really poor (which seems at odds with the pitch in this video). Has this changed?
Anyone else confused by... (at 7:49) refers to "Google Maps" but shows "Google Earth" logo? ...maybe I'm being pedantic? I love Google, but am constantly confused by what product is which, so please forgive me
Hey Mohsin! While we have solid support for background tasks on the native side, we have not implemented it on the web. The technologies are just too different. Web workers do exist in the browser that could support something like this, but it's quite tricky to make it work the same way. This is a common request. I hope we get to it!
I tried to build a Flutter web app but the performance on mobile is absolutely terrible (built in release mode). Is this normal? The animations are REALLY bad and the scroll is almost broken.
The Flutter and Firebase team gives me butterflies. I hope to one day work with other Flutter devs and Firebase devs around the world on my FlutterFire web app which is 3 months old now, a dev can only dream which such frameworks. 🥰🥺
Flutter is great but Flutter Web is far from production ready. HTML renderer render elements different or throws errors because some interfaces are not implemented. CanvasKit renders equal to Mobile or Desktop but the performance is just bad on the web for both render modes compared to Mobile/Desktop or normal web solutions. Special usecases could be faster but when we talk about normal business solutions with lists and charts, it is laggy for animations, page transitions and scrolling. There is also no solution to render images from another domain on CanvasKit. Since HTML renderer has so many issues and my app does not work with it and CanvasKit does not allow that for a lot of images (I opened a bug and it got pushed back) there is no solution to publish my app except to proxy all images what is a bad solution.
the sole reason why dart saw the light of day is google's conquest of the web. this was in the making for a long long time. that said, this is actually good news for the most part, flutter has solved many problems for many people, and it continues to do so by making the web more approachable and flexible. really looking forward to the end of this monoculture surrounding the html dom (and js by extension).
Flutter web performance sucks, it's absolutely and I mean absolutely bad... I regret ever trying flutter web out 👎👎👎👎👎👎👎 absolutely awful, I'm moving back to react native, I would recommend anyone trying to build a webapp to look elsewhere, definitely not flutter 👎👎
@@samuelkings9416 me too... but flutter as of it is now its a SPA on all fronts... but there should be a better solution for flutter SEO... even if canvas is the future..
@@royayon one way I've seen people do something of a sort of hack if create different HTML pages with the SEO done but redirects to the flutter web pages when clicked. Seems like I'm going to settle for that for now. Another thing I'm thinking of but I haven't seen it tried anywhere (I'm planning to test it in my next project) is to use firebase deep/dynamic links. I read that those links can be optimised for SEO. If it works, I'll most likely make a video or write an article about it.
![ROSÉ(로제) - APT. (Band VER.) (With. 이영지) [더 시즌즈-이영지의 레인보우] | KBS 241129 방송](http://i.ytimg.com/vi/IW8qaemx74g/mqdefault.jpg)
I am a die hard Flutter fan and have written more than 400 k lines of code (mobile & web apps ) in this technology. Make it SEO friendly and it'd beat all other stacks used for web development
What are the other technologies you have used. Tried NextJS, Remix run? Just wanted to know
Do you use it for web too or just mobile?
@@sachindraragul1094 I've used React and Angular
@@David-iq1kd For web too and it works great for web as well except for the fact that your website won't be SEO friendly
u r way too optimistic about Flutter web
As a Flutter developer developing website all I can say is that Flutter seems perfect for responsive pages where it looks perfect at any size, the smallest mobile to the biggest screen. Anything seems possible.
We love your motto, Paul! Anything is possible if you truly believe it to be ✨
What package are you using if any, to make it responsive?
@@abdimussa8932 Fraction Size, Linited Box, Media Query. Of(context).size
Hey brother i have problem in web. I am making website and getting issue to open drop menu in hover. Any suggestion please??
@@PaulBrassington_flutter_expert LayoutBuilder, too.
I'm just interested how are you going to handle SEO with canvas?
Basically google algo's will update their indexing model for canvas.. but we programmers need to tell Google that canvas is the future and update their seo indexing
@@mdshariqq1976 How can we do that?
@@JaredHasson contributing to the new stack & making it so preferable for web development, just like WordPress changed the CMS industry, we need to make a change in the SEO industry.
Technology is all about making lives better, isn't it?
@@JaredHasson awareness & communities
The key thing is: Flutter on web is fine for apps, but not for pages. Somewhat ironically, it works for the '2022 use case', but not for the '2002 use case'.
A user will be fine with a loading time to open fairly heavy and often deep web apps like the examples shown. A user will not be fine with a long loading time to open public and relatively simple sites like a basic landing site, a news site, or a blog. Just drawing on a canvas also means SEO and browser functionality like read mode doesn't work.
It can work in the future, but yeah first step is t compete with react/angular/vuejs. Then will be time to start to think about server side rendering in a dart server, but even if it tries to enter the CMS arena, the CMS know-how only is more keen to PHP, so...does it even worth the effort?
Websites should still prefer HTML and CSS way, whereas webapps can take advantage of Flutter like technology.
@@ivomuze react bla bla. That's history in 2 years
Correct, as stated in the video. Flutter for basic pages is a misuse.
Agreed it is powerful for complex web apps. But with the prominent rise is high performance no-code tools to build static websites like Webflow, the question at the start of each project becomes, what tool is best for the job at hand?
I really hope they fix the Seo for flutter web as fast as they can. As the only thing stopping a lot of flutter app developers to move on to flutter web is the Seo. If they crack it soon they might be the market leader in web. Since a lot of flutter devs are on a hold
How I so want this badly
I don't know if they will ever quite do this at least without the source code. Raw pixels just are not readable by machines.
No SEO support?! You heard it here first... The race right now is between Blazor, Maui, Flutter and Kotlin Multiplatform. If flutter support SEO so that flutter for Web is indexable and can reduce the bundle size just a tiny big it wins the complete multiplatform race, it's that simple.
What about the SEO and the loading time
My main question about flutter web is SEO, like I could develop any sort of web application that I want the search engine bot to understand my containt, SO!?
thanks for your great work Flutter/dart teams. Making flutter fully work on the web (with its advantages) will be crucial for so much wider adoption of flutter
I wish they just push for a state management library
Solve SEO and this will be the new standard for web-development!
What about SEO?
What about the loading time?
I feel like ten years from now, I will remember this video.
Great talk Kevin, thanks! Looking forward to WASM-GC and Flutter using it! Is there any ballpark timeline on when there might be a usable beta of it?
We don't provide timelines 🙂- For Chrome GC status, follow along at chromestatus.com/feature/6062715726462976
As he said Url > html . so by one url web app can be loaded. and html is still there to take care of seo.
I started flutter last month and i cant stop thinking on flutter web and how great it is thanks flutter team and thanks google
Hello Mohammad, are you still on flutter? just curios, as I'm just starting
Material UI inside a video is awesome 💙
When we were creating this video, Material UI just felt right 😎
You can find more awesome content by subscribing to our channel: goo.gle/FlutterYT
is it possible to embed canvaskit in chrome？ The loading time is the pain of flutter webapp.
SEO is also the pain of flutter webapp
@@ismadev nah, there are workarounds to have great SEO on flutter web
@@iGhostr but how?! :0
That's amazing, flutter always using graphics libraries to do there amazing work
flutter is the future
Thanks for the love 😎
Of course
can you please resolve the issue in web slow page loading issue
Expecting Flutter web to outgrow the performance of [Node Angular Vue etc ] soon by Flutter 💙web 4.O
I think here is the best place to ask this question: would you build a webshop with business analytics and this kind of stuff in Flutter or use a JS/TS framework
i like to see beter SEO with flutter web apps, I think is the most important on programming in this platform
When to solve the first load slow problem?
He already said it is under development to become stable first with WebASM, i guess the next version will be much around making web apps load faster and more recognisable by browser in term of SEO and loadspeed.
CMIIW
That sounds great what flutter web is doing! I do have a question..whats the progression when it comes to the SEO, is that something that has improved with flutter web, or is that something that is still in the same place as it once was?
Fantastic talk. Thanks for bringing up Rive! I interacted with it in its early days but had forgotten about it, and it's perfect for my current project.
Happy that the video was helpful, Jared. If you'd like to try building and releasing your own web app via Flutter, check out this neat resource: goo.gle/3EyYmjP
I love your work it is integral to companies like ours! Thank you
Kevin Moore for president!
Yay, another layer of complexity to learn web development, to get hired as a web developer, to build web applications, and having to wait for Flutter to be updated to use new web APIs. Sounds great...
I'd prefer to see CSS and JavaScript continue to evolve, and the browser vendors create a Canvas UI framework to act as an alternative to HTML. The world doesn't need yet another third party UI framework for the web (hell, I don't think it needs even 1 with all of the powerful and useful CSS and JavaScript APIs).
Flutter web sucks 👎👎 stick with js html css
Honestly, you're pointing out exactly why tools like Dart and Flutter should exist and evolve to become viable options. The world of web development is a mess, demanding developers become familiar with many different technologies even before they start diving into something like React. Over a decade ago, Adobe offered an alternative to web app development in the form of Flash, and those of us building complex web applications (as opposed to websites) enjoyed a far simpler, far more productive approach. While it's fair to say that Dart and Flutter are a different thing to learn, it should be with the understanding that in using them, we _replace_ a lot of technologies and tooling mess with a single unified system that's designed to work together. In other words, it's not "one more thing" to learn. It's something to potentially learn _instead._ And as someone who has lived in both worlds, I can definitely say that it's an option I want to see more of, not less.
Great work for the flutter teams
I use flutter to make phone apps but as soon as I switch to web it sucked, single js lib of 7mb, this is not good experience on slow internet. This take time to be functional. Or I might be totally wrong with flutter web. In either case please discuss it
Flutter web is currently used mostly to build admin dashboard or web apps where you do not need seo
Flutter web is currently used mostly to build admin dashboard or web apps where you do not need seo
@@safiussifat can it be fast enough to end users?
@@gaetanguiffo9378 Yeah, its very fast. Even faster with the flutter 3. You can warch flutter web examples on RUclips .
dart has bright future !
Rivaan you're a genius, looking forward for those videos
I think at the moment the 'web' has more potential to become the third major OS than GNU+Linux. Perhaps the flutter team should put more effort into distancing itself from Google (or any other big centralized organization)
Google owns Flutter. I don't understand what you mean.
Thanks for your Hard work.
Great video :) Quick question, how does Flutter render a WebView on the web? I.e. how does webview_flutter_web work from a technical point of view? Does it utilize the browser to render things inside the canvas? How does it do this?
Webview on flutter is a plugin and it's a different animal than flutter web
Flutter is amazing! Hope to use it for many many years
We hope to have many updates for years to come 😀
I still prefer to code with Kotlin rather than Dart 2.x. I wish there is an option to compile Flutter using any third-party programming language
Looking forward to wasm Dart at some point
So flutter web apps don't lag on scroll anymore?
That's what I wanna know too
Yes they do lag on scroll and in some animations and I cant find a workaround for it. (Flutter 3)
@Kevin, Thanks for awesome flutter web insight. Can we use flutter web for our regular e-commerce kind of website. I have my mobile already built on flutter and I like to extend for web. I don't find any good example of websites who is using flutter web. All you show as examples are web tools and not regular website. Can you please help me with some examples of regular websites which built on flutter?
Well, you could... It would be terrible for your site's SEO though, wich is absolutely crucial for an e-commerce.
@@jvmachado1204 Then there is no use for Flutter Web Pages until we have good SEO like webpage built on html/js.
The "closing brackets syndrome" is the most reason I throw this Flutter away, very easy get confuse with around 4 or 5 brackets punch on your eyes, like nested of nested if else, wonder do they notice this design
You can modularize your widget tree into smaller functional components which return widgets.
@@rsocial453 even doing that when styling for individual widget still can't catch your eyes, if you using TextStyle or BoxDecoration or others property have many arguments it will break into many lines
Lmao, idijot
@@iGhostr Next time use your brain before typing in any comment
I'd really like to give flutter a try, but most sites have mentioned the Flutter for web performance being really poor (which seems at odds with the pitch in this video).
Has this changed?
Yea this souns really nice, but in reality it struggles even under an apple m1 chip (nothing complex, landing page with a few menus and fading effect)
I hate how right you are on HTML.
How about creating very large application like Amazon , using flutter for front end, deploying in Google cloud platform as web app
Thank you very much .
excited to see what will happen with the aom and wasm-gc! props to everyone involved, you seem to be looking far ahead!
any options to do a server side render like Next but whit flutter? better seo, and velocity
Them: its best for web apps
Me: Lets check google page speed insights..
Ohhh. its worst for web apps
In flutter web when i relaod the page why it's all data destroyed in debug mode
And on live hosted it's shows 404 web page not found
Will Flutter ever have JSX-like syntax?
Flutter under OpenSource?
Wow, strong! Flutter for the win 🎉
Anyone else confused by... (at 7:49) refers to "Google Maps" but shows "Google Earth" logo?
...maybe I'm being pedantic? I love Google, but am constantly confused by what product is which, so please forgive me
make tutorial on background tasks
Hey Mohsin! While we have solid support for background tasks on the native side, we have not implemented it on the web. The technologies are just too different. Web workers do exist in the browser that could support something like this, but it's quite tricky to make it work the same way. This is a common request. I hope we get to it!
I tried to build a Flutter web app but the performance on mobile is absolutely terrible (built in release mode).
Is this normal? The animations are REALLY bad and the scroll is almost broken.
Can I send an email template built with flutter/dart that will run on a browser via a service like nodemailer?
Yes, only use an api (nodejs, goland, php, dart)
The Flutter and Firebase team gives me butterflies. I hope to one day work with other Flutter devs and Firebase devs around the world on my FlutterFire web app which is 3 months old now, a dev can only dream which such frameworks. 🥰🥺
keep up the good work 🔥
How to run web app on Safari browser ?
I'm learning flutter now
For me it sounds like, Flutter for Web is dead for a lot of use cases. What happened to the HTMLRenderer?
can flutter web develop rout api like laravel?
use dart language for create an api
Such great and inspiring work 😊 Amazing achievements, Flutter team 🤩
Max, thank you for your kind words of encouragement. We greatly appreciate the support of viewers like you 🙌
I just watched Billion Dollar Code, and these Terravision / Google Earth examples really burn
Why not Go? Why Google created Dart?
Flutter needed both Just-in-Time (JIT) and Ahead-of-Time (AOT) Compilation, Dart was the better choice then.
@@jvmachado1204 thank you, finally found the answer.
Thank You!
Flutter is great but Flutter Web is far from production ready.
HTML renderer render elements different or throws errors because some interfaces are not implemented.
CanvasKit renders equal to Mobile or Desktop but the performance is just bad on the web for both render modes compared to Mobile/Desktop or normal web solutions.
Special usecases could be faster but when we talk about normal business solutions with lists and charts, it is laggy for animations, page transitions and scrolling.
There is also no solution to render images from another domain on CanvasKit. Since HTML renderer has so many issues and my app does not work with it and CanvasKit does not allow that for a lot of images (I opened a bug and it got pushed back) there is no solution to publish my app except to proxy all images what is a bad solution.
Still difficult
It is like a new gen Flash-Environment
We need seo
The butterfly is a weird example because it lives for just a day and die :(
Google is really weird, you make PWA to make web apps behave as same as native apps, and you make flutter to make mobile & web apps 🤔
HTML & DOM JS: We are kings of the world.
AOM & WASM-GC: Well, your days are counted. The web is now a targeted platform of any languages.
I almost give up on Dart for web-app development, but this.... BRING ME H O P E. XD
Mobile Developers => Web and Mobile Devlopers 😁
DART EVERYWHERE.
Flutter on wed will just be awkward, we are still using vue/react
SEO sucks 😢 😪
Same feeling
It's been more than 1 year but they don't even put small effort for seo optimization or server side rendering
personally i think flutter should just focus on native stuff, and let web dev be web dev, react, vue etc...
Flutter web has lot of potential. Web dev with JS is a mess right now
the sole reason why dart saw the light of day is google's conquest of the web. this was in the making for a long long time. that said, this is actually good news for the most part, flutter has solved many problems for many people, and it continues to do so by making the web more approachable and flexible. really looking forward to the end of this monoculture surrounding the html dom (and js by extension).
@@iGhostr true, even tho it is handy, but i felt like flutter soon can make the browser become "native" too in browser.
Flutter not good for SEO and Loading Time
Flutter is trash in web world..!!
Flutter does not enhance web apps. It makes them far worse and slow. Plus, canvaskit is trash
Flutter web performance sucks, it's absolutely and I mean absolutely bad...
I regret ever trying flutter web out 👎👎👎👎👎👎👎 absolutely awful, I'm moving back to react native, I would recommend anyone trying to build a webapp to look elsewhere, definitely not flutter 👎👎
Nobody:
Hulk in Avenger: Infinity War
Kamar.shake().random()
What about SEO?
God, I so want this.
@@samuelkings9416 me too... but flutter as of it is now its a SPA on all fronts... but there should be a better solution for flutter SEO... even if canvas is the future..
@@royayon one way I've seen people do something of a sort of hack if create different HTML pages with the SEO done but redirects to the flutter web pages when clicked. Seems like I'm going to settle for that for now.
Another thing I'm thinking of but I haven't seen it tried anywhere (I'm planning to test it in my next project) is to use firebase deep/dynamic links. I read that those links can be optimised for SEO. If it works, I'll most likely make a video or write an article about it.