How to access parent libraries from an Iframe

Question

I'm writing a web app, using an embedded web server that does not permit me to edit http header and so use file caching. My app uses an iframe, but the problem is that every time I change the iframe's src, it reload every libraries I'm using, even if they are loaded in the parent window.

I know I can get JQuery back with :

var jQuery = window.parent.jQuery;

Any suggestions to do the same with every JavaScript files ?

Answer 1

Since you can access the window scope you can access every library that has it's reference stored there.

Example for underscore.js.

var underscore = window.parent._;

You even can create your own references like this:

(function(myLibrary){
  //anonymous scope  
  var doStuff = function(whatStuff){
      whatStuff = whatStuff || 'defaultStuff';
      alert('Doing ' + whatStuff);
  };

  //adding stuff to my library
  myLibrary.doStuff = doStuff; 

  //publishing myLibrary to the desired scope
  //iframe's parent
  window.parent.myLibrary = myLibrary;
  //current window
  window.myLibrary = myLibrary;
}({}))

But why? Here's some more info how stuff works:

Possible to share javascript imports across iframes?

How to use jquery from parent inside an iframe?

https://www.sitepoint.com/jquery-sharing-parents-iframes-inherit-js/