Flutter: Don’t Fear the Tree Shaking Mechanism

What Tree Shaking is, why Flutter needs Tree Shaking and how it works in Dart

Photo by Johannes Plenio on Unsplash

Flutter uses a lot of methods to optimize the app performance. One of them is tree shaking.

What tree shaking is, what role it plays in Dart/Flutter and how tree shaking is implemented in Dart, all of that we are going to cover in today’s article.

What is Tree Shaking?

Tree shaking is an optimization technique used in Dart and many other programming languages, particularly in JavaScript with tools like Webpack and Rollup. It is the process of removing unused code from the final bundle sent to the browser (in web context). This makes the bundle smaller and more efficient, improving load times and application performance.

Here’s how tree shaking works:

1. The bundler analyzes the import and export statements in a module-based project. This allows the bundler to understand which parts of the code are being used in the application.
2. Based on this analysis, the bundler can then remove code that is never actually imported or used anywhere in the application. This includes simple things like variables and functions, but also entire classes and modules.