Tôi có nên sử dụng React.PureComponent ở mọi nơi không?

Question

React cho biết việc hiển thị thuần túy có thể tối ưu hóa hiệu suất. Và bây giờ React có PureComponent. Tôi có nên sử dụng React.PureComponent ở mọi nơi không? Hoặc khi nào sử dụng React.PureComponent và vị trí thích hợp nhất để sử dụng React.PureComponent là gì?

Answer 1

Bạn nên sử dụng nó bất cứ khi nào có thể. Nó sẽ tiết kiệm đáng kể cho bạn thời gian hiển thị nếu bạn có nhiều trường hợp các thành phần cấp gốc cập nhật trong khi trẻ em không cần phải làm như vậy. Điều đó đang được nói, bạn sẽ thu được nhiều lợi ích hơn từ việc sử dụng PureComponent trong các nút cấp gốc của bạn (nghĩa là PureComponent sẽ không cải thiện hiệu suất tổng thể nhiều trong các thành phần mức độ lá bởi vì nó chỉ tiết kiệm các kết xuất từ ​​thành phần đó).

Một số lưu ý đối với PureComponent được giải thích rất rõ trong tài liệu phản ứng.

React.PureComponent's shouldComponentUpdate() chỉ nông so sánh các đối tượng.

Bạn có thể vô tình bỏ lỡ cập nhật hiển thị nếu thay đổi của bản thân bạn nằm sâu trong đối tượng lồng nhau. PureComponent chỉ tuyệt vời với các đối tượng/đạo cụ phẳng đơn giản hoặc bằng cách sử dụng một cái gì đó như ImmutableJS để phát hiện các thay đổi trong bất kỳ đối tượng nào với một so sánh đơn giản.

Hơn nữa, React.PureComponent's shouldComponentUpdate() bỏ qua các bản cập nhật cho toàn bộ thành phần. Hãy chắc chắn rằng tất cả các thành phần trẻ em cũng "tinh khiết".

PureComponent chỉ hoạt động khi kết xuất thành phần của bạn chỉ phụ thuộc vào đạo cụ và trạng thái. Điều này luôn luôn là trường hợp trong phản ứng nhưng có một số ví dụ mà bạn cần phải tái render bên ngoài vòng đời phản ứng bình thường. Để PureComponent hoạt động như mong đợi (bỏ qua kết xuất lại bạn không thực sự cần phải xảy ra), mọi hậu duệ của PureComponent của bạn phải là 'thuần túy' (chỉ phụ thuộc vào đạo cụ và trạng thái).