*ngFor trackBy: Smarter DOM Updates in Angular
*ngFor's `trackBy` tells Angular how to uniquely identify items in a list. This prevents it from destroying and recreating the entire list in the DOM on every data update, instead allowing it to reuse existing elements.
*ngFor's `trackBy` function provides a stable identity for list items, preventing Angular from destroying and recreating DOM elements on every data update. By default, it tracks by object identity, so new array instances cause a full re-render. `trackBy` lets you specify a unique key (like `item.id`), allowing Angular to reuse, move, or update elements efficiently. Forgetting it is a classic performance footgun, causing silent UI lag by churning through the DOM unnecessarily on dynamic lists.
Read the original → angular.dev
- #angular
- #performance
- #frontend
- #dom
Get five bites like this every day.
Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.