const and ListView.builder

Learn the performance impact of const widgets and builders.

const widget

const widgets are created at compile time and are not recreated during rebuild. This avoids unnecessary build and paint work. const Text('Merhaba') uses the same object every frame.

const Text('Merhaba')
// same object every rebuild

ListView.builder

ListView.builder only builds the items visible on screen; for long lists it is much more efficient than ListView. It takes itemCount and itemBuilder parameters.

ListView.builder(
  itemCount: 1000,
  itemBuilder: (context, index) => Text('$index'),
)

Exercise Create a ListView.builder

In main, create a ListView.builder widget: itemCount: 10, itemBuilder: (context, i) => Text('$i'). Print the widget's runtimeType.

Show example solution

import 'package:flutter/material.dart';

void main() {
  final widget = ListView.builder(
    itemCount: 10,
    itemBuilder: (context, i) => Text('$i'),
  );
  print(widget.runtimeType);
}

Test yourself

When is a const widget created?
- Anew on every rebuild
- Never
- At compile time, reused on rebuild
- Only at runtime
Show answer

At compile time, reused on rebuild — A const widget is created once at compile time; during rebuild the same object is reused, so build and paint cost drops to zero.

Use ListView.builder

ListView.____(itemCount: 100, itemBuilder: (context, i) => Text('$i'))

Show answer

ListView.builder(itemCount: 100, itemBuilder: (context, i) => Text('$i'))

const and ListView.builder matches

const

Compile-time constant
ListView

List widget
builder

Builds visible items
itemCount

Total item count

Next lesson: Summary - Performance

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies