原理：このスキームの原理は、コンテンツ領域を持つスクロール領域として大きなコンテナーを使用することです。JSは、データの数と各データの高さからコンテンツ領域の高さを計算します。コンテンツ領域は、パディングまたは絶対配置を使用してスクロール領域を拡大します。コンテナをスクロール可能にするには、もう1つはデータアイテムです。スクロールするときは、現在のスクロール位置scrollTopを計算し、データアイテムから各アイテムの高さを見つけて、この時点でコンテナに配置されるデータを計算します。
要約すると、5つの主要な最適化
-
テーブルの実装を他の要素ラベルの実装に変更します
-
ビューポートに表示されているデータのみをレンダリングする
-
関数スロットルを実行する
-
表示されたサブコンポーネントのスロットメソッドを使用する代わりに、常駐のVNodeおよびVueコンポーネントを減らし、代わりに手動で仮想DOMを作成してオブジェクト参照を切り捨てます
-
操作中に追加されるオブジェクトの数を減らすと、コンポーネントは操作中に更新および更新されるため、コンポーネント内のサブコンポーネントの数を減らすことができます
長いパフォーマンスリストのメモリパフォーマンス分析と最適化を思い出してください
