Flutter's `compute`: Offload Heavy Work from the UI Thread
Flutter's compute function runs heavy calculations in the background to prevent your app's UI from freezing. Use it for tasks like parsing large JSON or complex math. The footgun: on the web, it runs on the same event loop, not in a true parallel thread.
Why it exists
Flutter needs to render frames consistently to feel smooth. Any calculation on the main thread that takes more than a few milliseconds can block rendering, causing stuttering or "jank." The compute function provides a simple way to move this work into the background, keeping the UI responsive.
The mental model
Think of compute as hiring a temporary assistant (an Isolate) for a single, heavy task. You give them instructions (the callback function) and the necessary materials (the message). While they work, you're free to keep the main business running smoothly (the UI). When they're done, they hand you back the result.
How it works
The compute function takes a top-level or static function and a single argument for it. On native platforms (iOS, Android), it spawns a new Isolate—an independent worker with its own memory—runs the function there, and returns the result as a Future. On the web, which lacks true multi-threading in the same way, it schedules the work on the main event loop, providing asynchrony but not parallelism.
When to use it
Use compute for self-contained, CPU-intensive operations that take longer than a few milliseconds. This is perfect for parsing large JSON documents, applying complex filters to an image, or running heavy mathematical algorithms. It's a direct way to prevent these tasks from dropping UI frames.
When not to use it
Avoid compute for very short tasks (under a millisecond), as the overhead of spawning an isolate is not worth it; use SchedulerBinding.scheduleTask instead. It's also unnecessary for I/O-bound work like standard network requests, as Dart's async/await already handles that without blocking the UI.
One canonical example
To check if a large number is prime without freezing the app, you can offload the work. First, define a top-level function: bool isPrime(int n) { / heavy loop logic / }. Then, from your UI event handler, you call it with compute: final bool result = await compute(isPrime, 999999937);. The UI remains interactive while the calculation happens in the background.
Interview question
For which task is Flutter's `compute` function most appropriate?
- a.Fetching data from a remote API endpoint.
- b.Parsing a large JSON response into Dart objects.Correct
- c.Saving a small user preference to local storage.
- d.Displaying a simple animation on the screen.
Why? this is the answer
The `compute` function is designed for CPU-intensive operations like parsing large JSON, which can block the UI thread. Tasks like fetching data or saving preferences are I/O-bound and better handled by Dart's async/await, while animations are UI rendering tasks.
Just read this? Test yourself on what you have been reading.
Read the original → api.flutter.dev
Put your scrolling time to good use
Learn one idea, try a quiz and save useful cards for revision. Tezvyn makes it easy to learn and stay current in your tech field, a few minutes at a time.
The iPhone app is on the way
We are building it. Until it lands, nothing here is held back from you: every interview card, your saved cards, streaks and the job board all work in Safari, plus hundreds of free practice quizzes of thirty questions each. Sign in and it all carries over to the app the day it arrives.
Want it as an icon? Tap Share at the bottom of Safari, then Add to Home Screen. It opens full screen and the cards you have read stay available offline.
We are hiring for this. Open roles that interview on flutter — each one lists the topics its interview covers.
See open roles