React-window: useMemo داخل المكون _row_ عندما يعيد الأصل تصيير

هل قرأت هذا الجزء من المستندات؟ https://react-window.now.sh/#/examples/list/memoized -list-items

يوجد خياران مضمّنان للحفظ:

• هذا واحد مقابل React.memo
• وهذا واحد لمكونات الفصل

لا يبدو أن المثال الخاص بك يستخدم أيضًا ، مما يؤدي إلى إعادة تصيير غير ضرورية بسبب الطريقة التي تدير بها نافذة رد الفعل ذاكرة التخزين المؤقت للأنماط.

أعتقد أن هذه المشكلة لا تتطلب أي تغييرات من جانب هذه المكتبة ، لذلك سأغلقها. يمكننا التحدث أكثر إذا كانت لديك أسئلة توضيحية.

مرحبا مجددا،

لم يكن مثالي هو الأكثر بلاغة فيما حاولت التعبير عنه ، لكني أعتقد أنه يمكنني الآن:

بدءًا من المثال الخاص بك (memoized-list-items) ، علاوة على عرض _rows_ التي توشك على الظهور ، أريد أيضًا تصغير العروض عند _تنشيط_ عنصر (حاليًا ، عند النقر فوق عنصر لتنشيطه ، يتم إعادة تصيير جميع _rows_ في العرض).

لقد حققت ذلك في النهاية باستخدام الخاصية itemData على FixedSizeList (هذا يسمح لي بتجنب الإغلاق المتداخل) ؛ هذا بدوره اسمحوا لي باستخدام useMemo .

يجب أن تظل هذه المشكلة مغلقة ، لكنني أعتقد أنها مثال مثير للاهتمام / تمرين تحسين وسأكون ممتنًا لك لمزيد من المعلومات.

النتيجة هنا: https://codesandbox.io/s/rr7w89w3q

أتجنب EXPENSIVE RENDER بتكلفة الغلاف: CHEAP PREP .

شكرا على الجهد الذي بذلته في هذه المكتبة.

نعم ، هذا منطقي. إذا تغير itemData ، فسيقوم _ عن عمد _ بتفكيك ذاكرة التخزين المؤقت للعنصر. في معظم الحالات ، هذا ما تريد القيام به لتجنب البيانات التي لا معنى لها. إذا كنت تعلم أن هذا ليس صحيحًا بالنسبة لحالة استخدام معينة ، فإن بعض المنطق المخصص كما فعلت يبدو مناسبًا. 👍