Membuat DAFTAR ISI dengan Autoload (leazy load) seluruh Halaman dan Postingan Blogger

🎯 Tujuan Utama Kode

Kode ini berfungsi untuk:
✅ Menampilkan daftar halaman statis (pages) dan
✅ Menampilkan daftar postingan (posts) secara otomatis (dengan autoload/infinite scroll)
✅ Memuat postingan berikutnya saat daftar posting sudah discroll sampai bawah (bukan halaman seluruhnya)💡 Kelebihan pendekatan ini:
✅ Hemat bandwidth (nggak load semua post di awal)
✅ Lebih cepat tampil di awal
✅ User experience lebih ringan

---

Kalau kamu mau, aku bisa bantu tambahkan fitur:
✨ Loading spinner saat fetch data
✨ Tombol “Load More” cadangan
✨ Batas maksimum infinite scroll  🚀

..

Daftar Halaman Statis

...

Daftar Postingan

..

Penjelasan Kode Autoload Posts

Kode ini berfungsi untuk memuat daftar halaman (pages) dan postingan (posts) secara otomatis. Saat kamu scroll hingga bagian bawah daftar posting, posting berikutnya akan diload tanpa harus reload halaman.

Cara Kerja Kode

• loadPages(): Memanggil data halaman statis dari feed dan menampilkannya di #pages-list.
• showPages(): Memproses data halaman, mengambil judul, link, thumbnail lalu menampilkannya sebagai daftar.
• loadPosts(): Memanggil data posting mulai dari index tertentu dan menyiapkan data untuk ditampilkan.
• showPosts(): Menampilkan daftar posting ke #posts-list, menaikkan index, dan mengatur agar loading tidak ganda.
• Scroll detector: Mendeteksi posisi bawah #posts-list. Jika sudah mendekati viewport, maka loadPosts() dipanggil untuk load post berikutnya.

Kelebihan

• Hemat bandwidth karena posting diload bertahap (infinite scroll).
• Halaman lebih cepat tampil karena tidak semua posting diload di awal.
• User experience lebih ringan dan praktis.

Tips

• Kamu bisa tambahkan loading spinner agar user tahu posting sedang diload.
• Bisa juga tambahkan tombol "Load More" sebagai cadangan jika scroll tidak berfungsi optimal.