Under the Hood : Flutter Engine

Transcript

2. Flutter, a framework developed by Google. 2 Cross-Platform UI Framework
3. Flutter, a framework developed by Google. 3 Cross-Platform UI Framework Large Community
4. Flutter, a framework developed by Google. 4 Cross-Platform UI Framework Large Community Open Source
5. Flutter, a framework developed by Google. 5 Cross-Platform UI Framework Large Community Open Source Beautiful Developer Experience
6. Flutter, a framework developed by Google. 6 Cross-Platform UI Framework Large Community Open Source Beautiful Developer Experience Has 3 layers Flutter SDK Flutter Engine Platform - Specific Embedders
7. Flutter SDK 7 Written in Dart
8. Flutter SDK 8 Written in Dart Open Source
9. Flutter SDK 9 Written in Dart Open Source Modern react-style framework
10. Flutter SDK 10 Written in Dart Open Source Modern react-style framework Rich set of widgets implementing Material and Cupertino Design styles
11. Flutter SDK 11 Written in Dart Open Source Modern react-style framework Rich set of widgets implementing Material and Cupertino Design styles But how?
12. How does Flutter SDK work? 12 Flutter SDK is an UI toolkit
13. Flutter SDK is an UI toolkit How does Flutter SDK work? 13 Composes of Widgets
14. Dart Code Widget Tree Layout Phase Painting Phase Compositing Phase Rasterizing Phase Flutter SDK is an UI toolkit How does Flutter SDK work? 14 Composes of Widgets
15. 15 Phase Where Description Layout Flutter SDK Determines exactly how big each object is, and where it will be displayed on the screen Phases, The Motion of Our Lives
16. 16 Phase Where Description Layout Flutter SDK Determines exactly how big each object is, and where it will be displayed on the screen Phases, The Motion of Our Lives Painting Flutter SDK Provides each widget with a canvas, and tells it to paint itself on it
17. 17 Phase Where Description Layout Flutter SDK Determines exactly how big each object is, and where it will be displayed on the screen Phases, The Motion of Our Lives Painting Flutter SDK Provides each widget with a canvas, and tells it to paint itself on it Compositing Flutter Engine Puts everything together into a scene, and sends it to the GPU for processing
18. 18 Phase Where Description Layout Flutter SDK Determines exactly how big each object is, and where it will be displayed on the screen Phases, The Motion of Our Lives Painting Flutter SDK Provides each widget with a canvas, and tells it to paint itself on it Compositing Flutter Engine Puts everything together into a scene, and sends it to the GPU for processing Rasterizing Flutter Engine The scene is displayed on the screen as a matrix of pixels
19. 19 Flutter Engine Responsible for rasterizing composited scenes whenever a new frame needs to be painted.
20. 20 Flutter Engine Responsible for rasterizing composited scenes whenever a new frame needs to be painted. Its’a low-level implementation of Flutter's core API
21. 21 Flutter Engine Responsible for rasterizing composited scenes whenever a new frame needs to be painted. Its’a low-level implementation of Flutter's core API Includes Graphics Text-Layout File and Network I/O Dart Runtime / Compile Toolchain
22. 22 Flutter Engine In Depth Reliable rendering across platforms Skia handling traditional 2D graphics Impeller optimizing modern GPU pipelines. Skia - Impeller
23. Reliable rendering across platforms Skia handling traditional 2D graphics Impeller optimizing modern GPU pipelines. Facilitate communication between Flutter and native code (iOS/Android). Allow Dart to interact with platform- specific services like camera, sensors, or notifications. Use MethodChannel, BasicMessageChannel, or EventChannel to enable seamless data exchange. Skia - Impeller Platform Channels 23 Flutter Engine In Depth
24. Reliable rendering across platforms Skia handling traditional 2D graphics Impeller optimizing modern GPU pipelines. Facilitate communication between Flutter and native code (iOS/Android). Allow Dart to interact with platform- specific services like camera, sensors, or notifications. Use MethodChannel, BasicMessageChannel, or EventChannel to enable seamless data exchange. Skia - Impeller Platform Channels Flutter Engine In Depth Integral part of the Flutter Engine Handles Dart code execution, garbage collection, and asynchronous operations Dart Runtime 24
25. 25 Power of Open Source Community Collaboration
26. 26 Power of Open Source Community Collaboration Cost Effective
27. 27 Power of Open Source Community Collaboration Cost Effective Customization
28. 28 Flutter In Numbers Open Issues Closed Issues 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 0 5000 10000 15000 20000
29. 29 Commits 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023 2024 0 1000 2000 3000 4000 5000 6000 Flutter In Numbers
30. 30 Challenges and Disadvantages Increased Maintenance Effort Risk of Divergence Compatibility Issues Reduced Community Support Difficulty in Upgrading Security Risks Performance Concerns
31. 31 Workshop
32. 32 /in/huseyinhamad/ Teşekkürler