WEB HISTORY API

JavaScript menyediakan API untuk melacak dan mengubah sejarah browser saat ini. APIs ini mudah digunakan dan membantu membuat pengalaman pengguna yang lebih baik.

Apa itu Web History API?

Web History API adalah fitur JavaScript yang memungkinkan pengembang web untuk berinteraksi dengan riwayat sesi browser. Ini memungkinkan untuk memanipulasi riwayat perambaan, baik dengan menambah, memodifikasi, atau bahkan membaca entri yang ada di dalamnya.

Bagaimana Cara Kerja Web History API?

Web History API dalam JavaScript berfungsi dengan dua cara utama:

1. Menambah entri baru ke histori perambaan. Dengan menggunakan metode pushState(), kamu bisa menambahkan entri baru ke stack histori. Metode ini mengambil tiga argumen: sebuah objek status, sebuah judul, dan URL opsional.

history.pushState({page: 1}, "Title for page 1", "?page1");

2. Mengubah entri histori saat ini. Metode replaceState() digunakan untuk mengubah entri histori saat ini tanpa menambahkan entri baru. Argumennya sama dengan pushState().

history.replaceState({page: 2}, "Title for page 2", "?page2");

Event popstate

Event popstate dipicu ketika perubahan pada entri histori aktif terjadi, baik oleh tindakan pengguna atau dengan metode seperti pushState() atau replaceState(). Objek event.state adalah setara dengan objek status yang ditambahkan dengan pushState() atau replaceState().

window.addEventListener('popstate', function(event) {
  console.log("page: ", event.state.page);
});

Batasan Web History API

Perlu diingat bahwa penggunaan Web History API memiliki batasan. Misalnya, untuk alasan keamanan, banyak browser membatasi jumlah entri yang bisa disimpan dalam riwayat perambaan. Selain itu, API ini tidak memberikan akses ke URL riwayat perambaan sebelum sesi saat ini.

Namun, dengan memanfaatkan Web History API, kamu bisa memperkaya pengalaman pengguna dengan membuat navigasi halaman web yang lebih lancar dan intuitif.