History API
The History API lets JavaScript manipulate the browser history and URL without page reloads — the foundation of single-page applications.
HTML
Intermediate
4 min read
History API
Example
// Push new state (changes URL without reload)
history.pushState({ page: "about" }, "About", "/about");
// Replace current state
history.replaceState({ page: "home" }, "Home", "/");
// Listen for browser back/forward
window.addEventListener("popstate", function(e) {
console.log("State:", e.state);
renderPage(e.state?.page || "home");
});
// Navigate programmatically
history.back();
history.forward();
history.go(-2); Pro Tip
Always handle the popstate event to sync your UI when users use browser back/forward.