javascript / beginner
Snippet
Performance Tuning with trackBy
When rendering lists, the trackBy function helps Angular identify which items have actually changed, avoiding expensive DOM re-renders.
snippet.js
1
2
3
4
5
6
7
export class ListComponent {items = [{ id: 101, name: 'Apple' }, { id: 102, name: 'Banana' }];trackById(index: number, item: any): number {return item.id;}}
angular
Breakdown
1
trackById(index, item)
Receives the current item's index and the item object itself.
2
return item.id;
Returns a unique identifier so Angular can track this specific element.