CODEWITHSUNDEEP
javascripthtmlpushstate
Kyle
Kyle

Reputation: 22055

HTML5 History API - What is the max size the state object can be?

The pushState method accepts a state object. Firefox documents say the maximum size of this object is 640kb. Is it defined in the specs what the smallest maximum size a browser can implement is? Can I reasonably expect major browsers to provide me with at least 100kb?

EDIT: I tested it out with Chrome, and it was still working for state objects over 1MB.

Upvotes: 18

Views: 10330

Answers (5)

Maverick
Maverick

Reputation: 4498

The specification doesn't set out a limit, however the various browser do have their own limits.

Firefox's is well documented and as you said, it's 640kB ("as much RAM as anybody will ever need").

I couldn't find Chrome or Internet Explorer's listed anywhere, but some quick testing shows:

Chrome working at least up to 10MB (and possibly further),

IE hitting the limit at 1MB (in IE11, which is all I have handy).

So, to summarise for the people of the future: history.state object size limit is:

  • Firefox: 640kB
  • Internet Explorer 11: 1MB
  • Chrome: at least 10Mb

EDIT: Versions tested: IE: 11, Chrome: 33, Firefox: Irrelevant as they document the max size on MDN for you :)

Upvotes: 19

Peter Warrington
Peter Warrington

Reputation: 694

Firefox now imposes a limit of 16MiB on history.state: https://developer.mozilla.org/en-US/docs/Web/API/History/pushState#parameters

Chrome and other browsers still do not document this, see other answers for detail.

Upvotes: 3

C. Graham
C. Graham

Reputation: 358

Painstakingly, I have a page that is exceeding the character limit on IE11. I did a substring operation to get an exact character count since I couldn't find it anywhere. The answer is that (at least on IE11) 524282 characters are allowed to be passed to the pushState/replaceState.
I handled that via the following code:

function pushState(data, title, url) {
  if (data.length > 524282) {
      //can't push the data to the History API--pass null
      history.pushState(null, title, url);
      history.replaceState(null, title, url);
  }
  else {
    history.pushState(data, title, url);
    history.replaceState(data, title, url);
  }
    document.title = title;
}

I call beforeNavigate to save any current position information or state changes made by the user before loading the new content via an ajax request.

function beforeNavigate(){
    if ($("#container").html().length <= 524282) {
        //save current state to history before navigating via ajax
        history.replaceState($("#container").html(), document.title, window.location.pathname);
    }
}

Handle pushing the back and forward buttons by listening for popstate. If we passed a null value for data, then e.state will return null, and we need to load the stored url via an ajax request.

window.addEventListener('popstate', function (e) {
    if (e.state!=null) {
        $("#container").html(e.state);
    }
    else {
        //load the partialpage into the container(a full html page is not returned by the ajax query for my site)
        $.ajax({
            url: location.href,
            type: "GET",
            success: function (data) {
                $('#container').html(data);
            }
         });
    }
});

Upvotes: 0

YuC
YuC

Reputation: 1847

only see the MDN tells that FireFox impose a size limit to 640K, don't know other browsers. https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history

Upvotes: 0

Wladimir Palant
Wladimir Palant

Reputation: 57681

No. The normative document here is http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#dom-history-pushstate and it doesn't even mention a limit for the data size. A different limit is suggested however:

User agents may limit the number of state objects added to the session history per page.

As you can see on this example the specification generally avoids mentioning any hard limits and leaves them at the discretion of browser makers. So even if the spec is revised at some point in future to consider the possibility of data size limits, it is unlikely to give you a real number. Instead it will be "big enough for common use cases".

Upvotes: 9

Related Questions