is Pushstate inferior to Hashbangs when it comes to caching?

别来无恙 提交于 2019-12-07 09:51:35

问题


There are several advantages to the HTML5 Pushstate in comparison to hasbangs, in fact, Google is now encouraging the use of Pushstate. The only Pushstate disadvantage being publicly discussed is the fact that non-modern browsers do not support it. However, to me it seems that Pushstate is also disadvantageous when it comes to caching. I might be wrong, hence this question.

is Pushstate inferior to Hashbangs when it comes to caching pages?

Here is a case where it seems that Pushstate is bad at caching.

Pushsate

  • Bob navigates to eg.com/page1, the full page is downloaded, rendered and cached.

  • Bob clicks a button, eg.com/json/page2 is downloaded and cached.

  • The browser Processes the JSON and re-renders parts of Bob's page.

  • Pushstate changes the displayed browser address to eg.com/page2.

  • Bob closes the browser, then re-opens it and directly visits eg.com/pushstate2. The full page is downloaded, rendered and cached.*

*-Despite the fact that it is already theoretically available in the cache under the guise of eg.com/json/page2

Hashbangs

  • Alice navigates to eg.com/#!page1, eg.com/index.html is downloaded and cached.

  • eg.com/json/page1 is downloaded and cached.

  • The browser Processes the JSON and renders Alice's page.

  • Alice clicks a button, eg.com/json/page2 is downloaded and cached, the displayed browser address is changed to eg.com/#!page2

  • The browser Processes the JSON and renders Alice's page.

  • Alice closes the browser, then re-opens it and directly visits eg.com/#!page2. NOTHING is downloaded and everything is loaded from cache, unlike Pushstate.

Summary

I have numerous similar cases in mind, The question is whether or not this is indeed valid, I may be missing something which is leading me to wrong conclusions. is Pushstate inferior to Hashbangs when it comes to caching pages?


回答1:


I think that pushstate is inferior, but if you are building a SPA page correctly the differences should not be significant:

Assuming that you are using one of the latest frameworks, your index.html page should be relatively small with a few <script> tags (frameworks like webpack, systemjs etc). The js files that are referenced with these tags do get cached normally so the only difference between the two methods is fetching index.html for every pushstate url as opposed to fetching it once in hashbang mode.

I got the idea from the following question: https://webmasters.stackexchange.com/questions/65694/is-this-way-of-using-pushstate-seo-friendly



来源:https://stackoverflow.com/questions/27356774/is-pushstate-inferior-to-hashbangs-when-it-comes-to-caching

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!