كما ترى، تغير عدد المشاركات التي قرأها @lcor اليوم بعد إعادة التحميل. من قبل، لم يكن يتناسب مع القائمة المرتبة.
في الواقع، الـ 214 هي المشاركات التي تمت قراءتها هذا الأسبوع:
لم يكن هذا هو الحساب الوحيد الذي أظهرت فيه الأرقام العدد الأسبوعي بدلاً من عدد اليوم عند قيامي بهذه الخطوات. هناك المزيد من المستخدمين الذين يبدون وكأنهم ليسوا في المكان الصحيح، حيث يتم عرض الأرقام الأسبوعية بالفعل.
المستخدمون التاليون في القائمة قبل/بعد إعادة التحميل
الأرقام مختلفة بالفعل ولكن الأهم من ذلك هو أننا نقوم دائمًا بطلبين لنقطة النهاية directory_items (واحد مع، والآخر بدون الامتداد .json) ولكن أحدها يحتوي على معلمات غير صحيحة
ومع ذلك، لا يمكنني إعادة إنتاج ذلك محليًا، لدي طلبان مختلفان، ولكنهما على نقاط نهاية مختلفة (groups/search.json مقابل directory_items)
هل حاولت إضافة المزيد من المستخدمين إلى تثبيتك المحلي؟ أتساءل عما إذا كنت بحاجة إلى أكثر من 50 مستخدمًا، بحيث لا يتم تحميلهم جميعًا دفعة واحدة. أعتقد أن المستخدمين الذين تظهر لديهم أرقام خاطئة هم أولئك الذين لم يكونوا مرئيين عند التحميل الأولي.
إذًا، انتهى بنا الأمر إلى حالة “سباق” سيئة بين “الحارس” الذي نستخدمه لاكتشاف متى نحتاج إلى تشغيل إجراء “تحميل المزيد” وعرض الصفوف في دليل المستخدمين
المشكلة
عندما كان هناك 50 مستخدمًا على الأقل، كانت صفحة /u (دليل المستخدمين) تشغل loadMore فورًا عند التحميل الأول، قبل أن يتمكن المستخدم من التمرير لأسفل. تسبب هذا في تحميل صفحة ثانية غير مرغوب فيها من النتائج تلقائيًا.
السبب الجذري
حالة سباق توقيت أثناء تحميل الصفحة الأولي:
ينتقل المستخدم إلى /u
يبدأ controllers/users في تحميل البيانات (isLoading: true)
يتم عرض القالب مع ConditionalLoadingSpinner الذي يعرض الدوار
تصل البيانات، وتصبح isLoadingfalse
يختفي الدوار، ويبدأ DirectoryTable في عرض 50 مستخدمًا
يتم إدراج عنصر الحارس LoadMore في DOM
يتم إنشاء IntersectionObserver ويبدأ في المراقبة فورًا
في هذه اللحظة، لا يزال الجدول يحسب التخطيط/يتوسع إلى الارتفاع الكامل
يظهر الحارس لفترة وجيزة في منفذ العرض (~292 بكسل من الأعلى) قبل أن يتوسع الجدول
يكتشف المراقب التقاطع → يشغل loadMore
يكمل الجدول التوسع إلى الارتفاع الكامل (~3689 بكسل)
ينتقل الحارس إلى الموضع الصحيح (~3959 بكسل، أسفل منفذ العرض)
كان المراقب “متسرعًا جدًا” - بدأ المراقبة قبل انتهاء المحتوى من تخطيطه، والتقط الحارس خلال اللحظة القصيرة عندما لم يصل الجدول إلى ارتفاعه النهائي بعد.
الإصلاح
تأخير إنشاء المراقب حتى يصبح المحتوى جاهزًا:
تمت إضافة معلمة @isLoading إلى LoadMore تمنع إنشاء IntersectionObserver عندما لا يزال المحتوى قيد التحميل.
كيف يعمل الآن
تحميل الصفحة → isLoading=true → يتخطى المعدل إنشاء المراقب
↓
تحميل البيانات → isLoading=false → يعيد المعدل التشغيل، وينشئ المراقب
↓
الجدول متوسع بالكامل → الحارس في الموضع الصحيح (أسفل منفذ العرض)
↓
يقوم المستخدم بالتمرير لأسفل → يدخل الحارس منفذ العرض → يتم تشغيل loadMore ✓