AI Workshop: learn to build apps with AI →
History API: Add an entry to the history

Join the AI Workshop and learn to build real-world apps with AI. A hands-on, practical program to level up your skills.


Using pushState() you can add a new history entry programmatically. It takes three parameters.

The first is a state object that can contain any serializable data (there is a size limit).

The second parameter is unused by major browsers; pass an empty string.

The third parameter is the URL to associate with the new state. The URL must be same-origin with the current page.

const state = { foo: 'bar' }
history.pushState(state, '', '/foo')

Calling this does not change the page content or trigger navigation; it only updates the history entry and the URL bar.

Lessons in this unit:

0: Introduction
1: Navigating the history
2: ▶︎ Add an entry to the history
3: Modify history entries
4: Access the current history entry state
5: The `popstate` event
6: The `hashchange` event
7: Bfcache and page restoration