0Pricing
HTML Academy · Lesson

pushState and replaceState

Update the browser URL without a full page reload.

The History API

The History API lets a page change the URL displayed in the address bar without triggering a full navigation. Combined with client-side rendering, this powers Single-Page Applications that feel native without sacrificing bookmarkable URLs.

pushState

history.pushState(state, "", url) adds a new entry to the browser history. The URL in the address bar updates immediately; no network request is made. The user can navigate back to the previous entry with the browser's back button.

history.pushState({ view: "settings" }, "", "/settings");

All lessons in this course

  1. pushState and replaceState
  2. The popstate Event
  3. Hash-Based vs Path-Based Routing
  4. The Navigation API modern browsers
← Back to HTML Academy