← Lessons

quiz vs the machine

Platinum1760

Frontend

History Stack Management

Choose push versus replace and understand how the back stack behaves.

6 min read · advanced · beat Platinum to climb

The model

The browser keeps a stack of history entries for the tab. Each entry has a URL and state. The current position is an index into this stack, and back or forward move that index.

Push versus replace

  • push adds a new entry above the current one, growing the back stack.
  • replace swaps the current entry in place, leaving stack length unchanged.

Use push for real navigations the user should be able to undo. Use replace for redirects, corrections, or transient updates that should not create an extra back step.

Forward entries are volatile

If you go back and then push a new entry, the forward entries are discarded, just like editing history in the middle of a list. This is why a redirect after going back can feel like a trap.

POP versus PUSH

A POP is triggered by the user via back or forward and cannot be intercepted to stop the URL change after the fact. A PUSH comes from your code. Knowing the type lets you decide whether to restore scroll or run guards.

Why it matters

Misusing push creates back button loops where the user cannot escape a page. Thoughtful stack management keeps navigation predictable and the back button trustworthy.

Key idea

Use push for undoable navigations and replace for redirects, and remember that new pushes discard forward entries.

Check yourself

Answer to earn rating on the learn ladder.

1. Which operation should a redirect typically use?

2. What happens to forward entries when you push after going back?

3. A POP navigation is