大桌子如何提高性能？

Question

我有一個保存表的父容器（每行是一個子組件）。 子組件在數據方面有點繁重（有很多圖像）

所以看起來像：

<parent>
    <child> </child>
    <child> </child>
    <child> </child>
    ...
</parent>

當我重新渲染父組件時（子組件在shouldComponentUpdate處停止，因此不重新渲染），這不會花費很多時間。

Perf.timeWasted沒有顯示任何內容。

當我重新渲染一個孩子時，它會快速渲染。

也許它考慮了React虛擬DOM的計算？

我還有其他測試/方向嗎？

編輯 ：

孩子的shouldComponentUpdate非常小，如下所示：

shouldComponentUpdate(nextProps, nextState) {
    let shouldUpdate =nextProps.test1;
    return shouldUpdate;
}

Answer 1

您可以嘗試使用來自liblary react-virtualized或react-infinite的 InfiniteLoader。 謝謝，此庫將僅呈現可見組件。 這樣可以提高性能。