PerformanceBeginner10 XP2 min read
Why should you use ListView.builder instead of ListView for large lists?
TL;DR: ListView.builder builds only the visible items lazily. ListView() with a children: list builds all items upfront, causing jank and high memory usage with 100+ items.
Full Answer
| Aspect | ListView(children: [...]) | ListView.builder() |
|---|---|---|
| Item creation | All at once on first build | On-demand as they scroll into view |
| Memory | All items in memory | Only visible + buffer |
| Good for | < 20 static items | Any dynamically-sized or long list |
| itemCount | Not needed | Provide for correct scroll extent |
🎯
For items of varying height, use ListView.builder with cacheExtent to pre-render items just outside the viewport and avoid layout jank during fast scrolling.
Code Examples
dartListView vs ListView.builder
Output
// ListView.builder: 1000 items scroll at 60fps // ListView(children): potential jank on initial build
Common Mistakes
- ✗Using ListView(children: []) inside a Column — causes 'Vertical viewport was given unbounded height' error
- ✗Setting itemCount too low and missing items
Interview Tip
💡
Mention that ListView.builder is backed by SliverList + SliverChildBuilderDelegate internally. Show you know the Sliver layer that powers Flutter's scrolling.
#listview-builder#lazy-loading#viewport#recycling