Rendering?! | Decoding Flutter

Want to learn how Flutter turns widgets into pixels? See what operations Flutter performs to update the pixels you see on screen.
Leave us suggestions for code to unravel in the comments below!
Architectural Overview on flutter.dev → goo.gle/3BpP5pH
Building a desktop design language in Flutter → goo.gle/2WVWGO3
RenderObject API docs → goo.gle/3oH8RK0
RenderBox API docs → goo.gle/2WUhoh8
Get started with Flutter → goo.gle/Flutter
Learn more about the Dart Language → goo.gle/2YF9OCi
Watch more Decoding Flutter episodes → goo.gle/Decodin...
Don’t miss an episode, subscribe to Flutter → goo.gle/FlutterYT
#DecodingFlutter #Flutter #Developer
product: Flutter - Performance and optimization - Rendering performance; fullname: John Ryan;

[@ssokuma]

It's really nice having a deeper level content on the channel.
It felt a bit dense for a 4m video though.
I vote for "Trees?!" video, exploring the relation between them.

[@vladimirkraus1438]

Very interesting. More of these "fundamentals" videos please...

[@goldmenberd1350]

I thinking that Flutter could a excellent 2D Engine for Games and Apps 🙄🤣

[@alifprogrammer]

please resolved the website slow loading issue

[@malikshari5525]

same issue facing please note this comment flutter team

[@azmatullahbukhari]

Yes

[@jerinpwilson5288]

Flutter is the answer to global warming with all those 🌲🌲🌲.

[@jerinpwilson5288]

They are always planting new ones.....

[@10centgaming30]

that's a forest

[@laybunzz]

You are not wrong

[@mightytechno]

It's good to understand these deep concepts. Hope to see more videos like these

[@xuantung8660]

Very informative. Keep it up guys

[@hiroshihorie392]

So many trees, lets just call it Forest.

[@rydmike]

Love these deeper decoding Flutter videos! Keep ‘em coming and don’t be afraid to make them slightly longer and deeper if needed for clarity and understanding 💙

[@fnoffer]

very interesting

[@nested9301]

so dart server-side dead?

[@plugfox.archive]

Shelf, Functions Framwork

[@DrDiabolical000]

"Those pixels don't just randomly appear on screens",
Me : Dad..?

[@Run4online]

😮

[@nipunshah1373]

Amazing Information !

[@flutterdev]

We're delighted to hear this was helpful, Nipun! 😄
We'd love to take the opportunity to share some additional resources to help you on your Flutter journey 🛤️
Check out the linked resources below:
RenderObject API docs → goo.gle/3oH8RK0
RenderBox API docs → goo.gle/2WUhoh8
Hope this helps 🙌

[@yousefzk22]

Oh Wow!

[@honmameiko1333]

quite instinctive to web developers, it is like i am working with some another kind of browser rendering process

[@rishabhanand4270]

A little similar to the web. Are there tricks to cut layout cost like there are tricks on the web (with CSS for example). I mean, it looks like for the layout part of the pipeline, Flutter needs to know every drawing boundary and size of every single widget before the painting pipeline. If we could somehow help flutter out with that?

[@rowlingsedinathewritingofh9866]

Yes, it's very similar, if you don't place a size on images in HTML, you will find the page content jumps down as the image load, a repaint. Similarly, images are lazyloaded in Flutter, and can cause lower widget to jump down, a repaint, to prevent this you have to give Flutter the aspect ratio of the lazyloaded image, by parenting the image in an AspectRatio widget.

[@apisaga]

Keren

[@Jannemandevries]

Did you know that Flutter is always one frame behind on iOS native? I tested this thoroughly. This means that if you swipe to scroll or push a button or something it takes one extra frame before you see changes on screen. I.e. it has a 1/60 'input lag', not much but something to keep in mind. Is this Flutter's best kept secret?

[@Dieterbe]

Thank you !

[@cholasimmons]

I'm curious what it is people dislike about flutter videos😄.
"haters"?

[@moiseskerschener2634]

Haters is quite difficult, if I hated it, I wouldn't be here!.

[@wil-fri]

react native developers and bots?