How does JavaScript load external libraries?

Question

I'm a bit confused on how JavaScript is able to load external libraries. Is it doing a GET request to the url I specify in the script tags? Does the browser handle the storage of the library or is it kept somewhere in the DOM?

It seems like most things that the browser might be doing with loading external libraries would violate the same-origin policy. Is there any extra security modern browsers enforce when loading scripts from external sites? Is it possible to load an external library and then print its source to the screen?

Thanks!

Answer 1

I'm a bit confused on how JavaScript is able to load external libraries.

JavaScript has no native means to load libraries. That is a feature provided by the host environment (such as a browser or node.js).

Is it doing a GET request to the url I specify in the script tags? Does the browser handle the storage of the library or is it kept somewhere in the DOM?

The browser will make a GET request, load the script into the JavaScript environment for the viewport, but only keep the HTMLScriptElement DOM Node in the DOM.

It seems like most things that the browser might be doing with loading external libraries would violate the same-origin policy.

The same origin policy is designed to protect non-public data on third party sites. Scripts aren't data (although they can be written so they have embedded data in them, JSON-P depends on this as a way to avoid the same origin policy).

Is there any extra security modern browsers enforce when loading scripts from external sites?

No

Is it possible to load an external library and then print its source to the screen?

No (although you can use XHR to make a separate HTTP request to get the script source — which is subject to the same origin policy).