n_kasmaiee

نحوه پیاده سازی سایت برای لود شدن به سبک لینکدین

n_kasmaiee ۱۳۹۶/۱۲/۲۲ طراحی رابط کاربری

سوال: دوستان برنامه نویس اگر تجربه ای دارین لطفا راهنمایی کنین چطور میشه صفحه وب رو تنظیم کرد که آیتم ها با اسکرول صفحه اروم اروم لود بشن مثل لینکدین یا پینترست که هر چه با اسکرول میریم پایین ایتمای بیشتری لود میشه بدون اینکه صفحه هنگ کنه و سرعتش خوب باشه؟
پاسخ‌ها به این تاپیک
EleRam
EleRam برنامه‌نویس و توسعه‌‌دهنده
۱۳۹۶/۱۲/۲۲
سلام خلاصه: برای این مورد باید با استفاده از جاوا اسکریپت، مقدار اسکرول صفحه یا کانتینر مورد نظرتون رو بگیرید و به وسیله Ajax لیست آیتم های صفحه جدید رو از سرور دریافت کنید. کاملتر: فرض کنید شما در حال حاضر صفحه لیست رو دارید که به صورت صفحه بندی (paginated) و به کاربر نشون میدید. برای اینکه شبیه استریم لینکدین تبدیل کنید باید در سمت کلاینت شماره های صفحه بندی رو مخفی کنید و با جاوا اسکریپت مقدار اسکرول صفحه رو بگیرید و تابعی بنویسید که هنگامی که اسکرول به انتهای صفحه رسید، طبق لینک های صفحه بندی، لینک صفحه بعدی رو بگیرید و به صورت ای جکس از سرور درخواست صفحه بعدی رو بدید. فقط باید دقت کنید که سمت سرور باید فقط محتویات یا لیست آیتم های صفحه جدید رو بفرسته و نه کل صفحه. بر می گردیم در سمت کلاینت. کلاینت بعد از دریافت پاسخ از سرور، لیست آیتم های صفحه جدید رو به فهرست قبلی اصطلاحا append می کنه. این چرخه همین طور ادامه داره تا زمانی که دیگه سرور اعلام کنه چیزی نداره و به انتهای لیست رسیده. افزونه های زیادی برای این کار هستن ولی خودتون هم می تونید این کار رو انجام بدید :)
mostafa
mostafa
۱۳۹۶/۱۲/۲۲
میتونید از infinite scroll jquery استفاده کنید که با هر بار اسکرول کردن و رسیدن اسکرول به یک اندازه خاص ، یک درخواست Ajax به سمت سرور ارسال کنید تا بک اند هم اطلاعات بیشتری را ارسال کرده و آن اطلاعات را که با ajax دریافت کرده اید به content صفحه وب خود اضافه کنید. مثلا هنگام load شدن سایت ، فقط اسامی 10 محصول از فروشگاه نمایش داده میشود که در query sql بک اند 10 تا 10 تا LIMIT شده است و شما هر بار با درخواستهای ajax خود 10 تا رکورد بعدی دیتابیس را فرخوانی میکنید.
محمد عزیزی
محمد عزیزی
۱۳۹۶/۱۲/۲۲
سلام بر شما. این قابلیت در .net به lazy loading معروف است. البته احتمال میدم یه مفهوم کلی باشه و در سایر زبانها هم همین اصطلاح باشه. مطلب هم فراوان موجوده. گوگل بفرمایید. موفق باشید.