Kiểm soát re-render trong React mà không lạm dụng memo

Rất nhiều vấn đề hiệu năng React đến từ việc render lại không cần thiết — nhưng giải pháp không phải là memo hóa mọi thứ.

# Hiểu nguyên nhân trước

Component render lại khi state, props hoặc context thay đổi. Hãy đo bằng React DevTools Profiler trước khi tối ưu.

# Memo đúng chỗ

useMemo và React.memo hữu ích cho phép tính đắt hoặc danh sách lớn, nhưng dùng bừa bãi sẽ thêm phức tạp mà không đem lại lợi ích.

• Đưa state xuống gần nơi dùng nhất
• Tách component để cô lập vùng render
• Chỉ memo khi đã đo được lợi ích

Tối ưu dựa trên số liệu, đừng dựa trên cảm giác.