Google Cache vs Cross Origin

[j-c-t]

Quite an interesting project, thank you for doing the research! I note that some of your results around certain frameworks not appearing in google's cache may be related to cross origin issues, when the cache attempts to load them. You can see this if you open up your JavaScript console while viewing the page in Google's cache.

For example, for the Angular 2 test:

XMLHttpRequest cannot load http://jsseo.expert/angular2/main.ts. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://webcache.googleusercontent.com' is therefore not allowed access.

And ember:

vendor.js:28587 Error: Failed to execute 'replaceState' on 'History': A history state object with URL 'http://jsseo.expert/ember/search?q=cache%3Ajsseo.expert%2Fember%2F&rlz=1C5C…%2Fember%2F&aqs=chrome..69i57j69i58j69i60.902j0j4&sourceid=chrome&ie=UTF-8' cannot be created in a document with origin 'http://webcache.googleusercontent.com' and URL 'http://webcache.googleusercontent.com/search?q=cache%3Ajsseo.expert%2Fember…%2Fember%2F&aqs=chrome..69i57j69i58j69i60.902j0j4&sourceid=chrome&ie=UTF-8'. at History.nrWrapper [as replaceState] (search:10) at Class.replaceState (vendor.js:35531) at Class.initState (vendor.js:35421) at Object.applyStr [as default] (vendor.js:50754) at Object.tryInvoke (vendor.js:51244) at Class.initState (vendor.js:35086) at Class._setupLocation (vendor.js:38983) at Class.setupRouter (vendor.js:38636) at Class.startRouting (vendor.js:38621) at Class.startRouting (vendor.js:13736)

It may be possible to resolve the above (at least the Angular 2 one, regarding CORS headers; less sure about the Ember one) in such a way that you will get better cache results.

I believe most of the other tests load their files from within the cache without issue.

[kamilgrymuza]

@j-c-t - thanks for reporting this 👍 . It's an interesting find - I wonder why this isn't a problem for other experiments in which we include a JS file via the script tag as well - e.g. Plain JS External or React External.

This way or another - we will try to investigate this further, especially that we planned to create a few experiments around cross-origin issues anyway.

I'll leave this issue open for now and once we know more will report back.

Cheers! :)

[j-c-t]

I'm guessing, but for Angular 2, it's possible that your web server is misunderstanding the mime type for main.ts (the response header I'm seeing is Content-Type:video/mp2t, as .ts is not only common for TypeScript but is also an MPEG container format) and needs to have its CORS configuration set to return Access-Control-Allow-Origin: * for this file format. Or maybe a different approach to transpiling and loading the TypeScript. :)

For Ember it looks like it may be something more fundamental to History, for example: https://stackoverflow.com/questions/14807921/html5-history-api-pushstate-from-a-domain-to-a-subdomain