DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 964,423 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for What's new in Flutter 3.3
Rohit Jain
Rohit Jain

Posted on

What's new in Flutter 3.3

Flutter official 3.3

Super Excited to share that it's here, Flutter 3.3 Other than 5500+ Merged Pull Requests, this release brings super performance updates to Flutter Web, Desktop includes text and performance related to being specific and a lot more. Super cool ones are listed below.

We knew it, More Material You Support

  • No it's not dynamic theming, we need to wait a bit more for that, but there is a lot now as well, Flutter Updated the IconButton, Chips and large and medium variants for AppBar.
  • You need to add the useMaterial3: true flag in theme data.
  • New TextTheme as instead of headline1, headline2, headline3, ... now we have headlineLarge, headlineMedium, headlineSmall, titleLarge and many more, try out these today using Theme.of(context).textTheme.titleLarge
  • Bottom Bar, Drawer, Time & Date Pickers, and Banners are under development

Impeller

The impeller is a new rendering runtime for Flutter. It is our solution to Flutter's early-onset jank issue. Impeller precompiled a smaller, simpler set of shaders at Engine build time so that they will not be compiled while an app is running.

Overall, Impeller has the following objectives:

Predictable Performance: All shader compilation and reflection are performed offline at build time. All pipeline state objects are built upfront. Caching is explicit and under the control of the engine.
Instrumentally: All graphics resources (textures, buffers, pipeline state objects, etc..) are tagged and labeled. Animations can be captured and persisted to disk without affecting per-frame rendering performance.
Portable: Not tied to a specific client rendering API. Shaders are authored once and converted to backend-specific formats as necessary.
Uses Modern Graphics APIs Effectively: Makes heavy use of (but doesn’t depend on) features available in Modern APIs like Metal and Vulkan.
Makes Effective Use of Concurrency: Can distribute single-frame workloads across multiple threads if necessary.

The impeller is currently available for preview on iOS on the master channel;

  • For using it you can use flutter run --enable-impeller
  • or In iOS, you can add it to the info.plist file as
<key>FLTEnableImpeller</key>
<true/>
Enter fullscreen mode Exit fullscreen mode
  • or In Android, yeah you guessed it add it to the AndroidManifest.xml file as
<!-- Under Application Tag -->
<meta-data
    android:name="io.flutter.embedding.android.EnableImpeller"
    android:value="true" />
Enter fullscreen mode Exit fullscreen mode

Text Selection

Text Selection was not as it should be in flutter web but now with the SelectionArea widget, this is very easy. Wrap any widget with SelectionArea and that's it. It will show you the selection cursor on the web and the text will be easily selected. Example

Improved Trackpad Inputs

Previously when working with the trackpad and dragging together, sometimes it was not performing as expected but now it will also work smoothly as now flutter will deliver the scrolling gestures that are only recognized by scroll view whereas previously it was a general event.

Scribble Support

With more Pencil devices Flutter is extending support for Scribble handwriting inputs and more sprinklers on top of this, it is enabled by default in Text and Editable Fields.

Windows Support

Support for Auto-Updating whenever we push the application, so users can have the latest features, we need to make a couple of tweaks in pubspec.YAML file and build arguments and that's it, Sharing windows applications will be a piece of cake.

Go_router Package

Go Router package makes it easy to navigate and handle deep links. All our Web Issues of Back Buttons and redirects will be resolved, this package is maintained by the Flutter team so relying on it is a good idea. Example

VS Code Extension

Now we can add multiple Packages together separated by a comma in Dart: Add Dependency.

Raster Cache Improvements

  • ImageProvider now has a method called loadBuffer that functions similarly to load, except that it decodes from an ui.ImmutableBuffer.
  • ui.ImmutableBuffer can now be created directly from an asset key.
  • The AssetBundle classes can now load an ui.ImmutableBuffer.
  • The PaintingBinding now has a method called instantiateImageCodecFromBuffer, which functions similarly to instantiateImageCodec.
  • ImageProvider.load is now deprecated, it will be removed in a future release.
  • PaintingBinding.instantiateImageCodec is now deprecated, it will be removed in a future release.

Primary Scroll Controller

The PrimaryScrollController API has been updated to no longer automatically attach to vertical ScrollViews on desktop platforms.

Error Handling

Handling errors is super easy now, manually doing it or using custom zones, because it slows down application start-up. Example

Without Devtools there is no Flutter Upgrade, DevTools has many updates under the hood

Let me know if you have any questions or queries. I’ll be happy to help you. Like Share, and Follow, if you love what you read. King Technologies

Thanks for Reading

Top comments (0)

πŸ‘‹ Hey, my name is Noah and I’m the one who set up this ad. My job is to get you to join DEV, so if you fancy doing me a favor, I’d love for you to create an account.

If you found DEV from searching around, here are a couple of our most popular articles on DEV: