Does Internet Explorer support pushState and replaceState?

Deep dive into browser history manipulation

History.pushState and replaceState methods are the secret sauce behind AJAX-based navigation, allowing an application-like user experience on your web pages. In simple terms, they empower you to modify the browser's location and history information without reload. Neat, right?

Salvaging IE9 with polyfills

There's hope even for IE9, despite the lack of support for history manipulation. Polyfills like History.js mimic the native behavior, ensuring the UI doesn't break despite URL changes.

Emulating state changes with History.js

Here's why History.js is your friend for old browsers:

• Fakes HTML5 in retro browsers: Transforms hash alterations into 'state' transitions.
• Lifesaver for HTML4 browsers: Adds query strings to your URLs as a workaround.
• Consistent user experience: Ensures your application behaves similarly across different browser versions.

// Disclaimer: life is easier if history API supported
if (!window.history.pushState) {
    // Life-saving fallback (thank you History.js!)
    History.pushState(null, "Title", "new-page.html");
}


Considerations for cross-browser compatibility

For developers, ensuring your web application behaves similarly across all targeted browser versions is important. Hence, determining history API support before implementation is a best practice, and prepare a game-plan to implement workarounds for older browsers like IE9.

Browser history API: the nitty-gritty

Browser support validation via CanIUse

CanIUse is your compass in the sea of browser compatibility. A quick check under "history.pushState" or "history.replaceState" shows the Internet Explorer versions supporting these features.

Tread carefully with relative paths

Dealing with pushState() errors can be tricky. Sometimes, a relative path is all you need to fix the pesky URL formation issues and ensure smooth page navigation.

The utility belt: Modernizr

While History.js is handy, Modernizr steps in as another handy tool for detecting feature support. It conditions the loading of polyfills and ensures similar functionality across browsers.