Một trong những nguyên nhân phổ biến nhất gây ra việc render chậm trong các ứng dụng React là khi các component được re-render không cần thiết. Có hai công cụ được cung cấp bởi React có ích trong những trường hợp sau:

• React.memo(): Điều này ngăn việc re-render không cần thiết của function component.
• PureComponent: Điều này ngăn việc re-render không cần thiết của class component.

Cả hai công cụ này đều dựa trên sự so sánh nông (shallow comparison) của các props được truyền vào component — nếu props không thay đổi, thì component sẽ không re-render. Mặc dù cả hai công cụ đều rất hữu ích, nhưng so sánh nông sẽ ảnh hưởng về hiệu suất, vì vậy cả hai đều có thể có tác động tiêu cực đến hiệu suất nếu sử dụng không đúng cách.

Bằng cách sử dụng React Profiler, hiệu suất có thể được đo lường trước và sau khi sử dụng các công cụ này để đảm bảo rằng hiệu suất thực sự được cải thiện bằng cách thực hiện một thay đổi nhất định.