Impeller is PROD ready for iOS, Dart 3, x3 WEB Performance and more with Flutter 3.10
Tags: flutter
Published: 2023-05-11 16:47:30

Flutter 3.10 is finally here and it's packed with incredible new features! 🎉 Get ready for the game-changing release of Impeller for iOS, the revolutionary Dart 3 that makes null-safe code mandatory, and a whole bunch of Web enhancements, including the cutting-edge WASM standard that will make your Flutter apps run up to 3 times faster on the web! Plus, we're going to see more improvements to the Material 3 widgets, enhancements in the DevTools for easier app profiling, and support for SLSA level 1 to tackle potential security risks.

Stick with me as I'm going to give you a hyper-quick tour of all these improvements so you can get an overview of the best of the best in Flutter 3.10.

> 📽 Video version available on [YouTube](https://youtu.be/xaGe8ptTfZM) and [Odysee](https://odysee.com/@svprdga:d/impeller-is-production-ready-for-ios-dart-3-x3-web-performance-and-more-with-flutter-3-10)

{% embed https://youtu.be/xaGe8ptTfZM %}

### Impeller is production-ready on iOS

In Flutter 3.10, Impeller replaces Skia and becomes the primary rendering engine on iOS. This new rendering engine brings improved performance to our animations and eliminates the troublesome shader compilation issues that caused janky animations and an unpleasant visual experience. To achieve this, Impeller utilizes a tessellation algorithm that bypasses the need for shader compilation during graphics rendering.

Impeller harnesses the advanced capabilities of next-generation GPUs to render various shapes and colors on the screen seamlessly, ensuring a consistently high framerate. It has been meticulously crafted from the ground up to cater specifically to the requirements of Flutter.

In Flutter 3.10, Impeller is the default rendering engine for all iOS apps developed with Flutter. Furthermore, the Flutter team has revealed their ongoing efforts to bring Impeller to Android, with a preview version slated for future releases.

### Dart 3

Flutter 3.10 introduces an exciting addition: Dart 3, the latest major release of the programming language driving Flutter. Dart 3 brings a significant enhancement by completely removing non-null-safe code, ensuring a fully protected and problem-free experience in this 100% safe language, eliminating the pitfalls typically associated with nullable languages.

Furthermore, Dart 3 introduces numerous language enhancements, including the introduction of Patterns. This feature makes it easy to work with structured data. The official [Dart 3 blog post](https://medium.com/dartlang/announcing-dart-3-53f065a10635) provides a practical demonstration of a function that conveniently returns two values simultaneously.

```dart
(String, int) userInfo(Map<String, dynamic> json) {
  return (json['name'] as String, json['height'] as int);
}
```

Consequently, there will be no need to encapsulate multiple values within a collection or create a dedicated class for that purpose.

Additionally, the updated switch statement allows for the orderly deconstruction of structured patterns, while new class modifiers like `interface class` and `sealed class` offer expanded capabilities.

Please tell me in the comments section if you are interested in me creating a comprehensive article exploring these enhancements and demonstrating how you can leverage them to your advantage.

### Improvements for Flutter for Web

In relation to Flutter for the web, noticeable improvements have been made to enhance application loading speed. One key achievement is the substantial reduction in the size of Canvaskit, the largest component in Flutter for the web, now reduced to one-third of its previous size. Additionally, unused fonts can now be removed, further reducing the overall weight. Flutter 3.10 introduces comprehensive support for seamlessly embedding pure HTML elements within the application. Furthermore, the inclusion of fragment shader support empowers developers to create stunning visual effects using familiar Dart code.

In addition to all this, the Flutter team remains dedicated to ensuring seamless integration between Flutter and the new WebAssembly standard, commonly known as WASM. This involves enabling the inclusion of garbage-collected languages like Flutter within the standard. Initial tests have already demonstrated a remarkable performance boost of up to three times. With the eventual distribution of WASM to the general public, this exciting addition holds great promise for web applications developed using Flutter.

### New Material 3 widgets

This latest version of Flutter continues its efforts to enhance support for Material 3. It introduces the option to create color schemes based on either a base color or an image. Significant enhancements have been applied to various widgets, including DropdownMenu, NavigationDrawer, TabBar, SnackBar, and others, aligning them with the updated Material 3 design guidelines. Additionally, widget support for iOS/macOS has been improved. Users can now utilize Apple's spell-checking feature within editable text widgets, along with the addition of a new checkbox and radio button design that complements Cupertino aesthetics. Furthermore, there are animation improvements specific to Apple platforms.

Speaking of Apple, this Flutter version now enables wireless debugging directly to iPhones and iPads, a functionality previously available only in Xcode.

To witness all of these improvements in action, you can explore the [official sample](https://flutter.github.io/samples/material_3.html) showcasing Material 3 features.

### Enhanced DevTools

This version also introduces several enhancements to the development tools, empowering developers to analyze and optimize their apps' performance effectively.

Notably, the memory page has received new features. The addition of the Diff tool enables the comparison of memory usage before and after specific interactions, providing insights into the impact of those interactions. Furthermore, improvements have been made to streamline heap exploration directly from the console.

The DevTools user interface has been updated with Material 3 widgets, enhancing usability and maintaining consistency with the latest design guidelines. Additionally, the open-source tool Perfetto has been integrated, replacing the older trace viewer. Perfetto excels in managing large datasets and introduces features like pinning threads of interest, dragging and selecting multiple timeline events, and utilizing SQL queries to retrieve specific timeline data.

### Flutter now supports SLSA level 1

Ensuring security is a critical aspect when working with open-source code. That's why Flutter now supports Supply Chain Levels for Software Artifacts ([SLSA](https://slsa.dev/)), level 1. This implementation enables Flutter's build scripts to operate on trusted platforms. Furthermore, the release workflow for each new version of Flutter undergoes a rigorous approval process involving multiple engineers. Additionally, both beta and stable releases now come with provenance, meaning that trusted sources have constructed the final artifact that developers will utilize to build Flutter applications on their machines.

These measures are in response to recent security attacks and vulnerabilities observed in other open-source projects, [such as the NPM ecosystem](https://www.bleepingcomputer.com/news/security/npm-supply-chain-attack-impacts-hundreds-of-websites-and-apps/). The Flutter team is proactively taking steps to enhance the security of the ecosystem, making it more robust and reliable for developers and end users alike.

### Conclusion

So far, I have briefly covered the key highlights of the notable improvements in Flutter 3.10. If you wish to delve deeper into these details, I highly recommend reading the official [blog post on Flutter 3.10](https://medium.com/flutter/whats-new-in-flutter-3-10-b21db2c38c73) and the blog post on [Dart 3](https://medium.com/dartlang/announcing-dart-3-53f065a10635). Additionally, I suggest watching the comprehensive collection of recently uploaded [Flutter videos on YouTube](https://www.youtube.com/watch?v=yRlwOdCK7Ho&list=PLjxrf2q8roU1523hIgnNX4r6ukX72QYLg).

Thank you for reading thus far! Until next time!