0

scripts from other providers I would normally include in my application in the following way:

<script src="https://apis.google.com/js/api.js"></script>

However I was wondering whether there is any drawback to just open the url: https://apis.google.com/js/api.js and copy/paste the script inside my application

The advantage for this would be for example when using React - to just copy/paste the script inside the particular component that is using it.

However I'm not sure whether there are any drawbacks - for example whether these scripts might be updated sometimes by third parties (say Google) and it will stop working as I'll have old version copied locally.

Any idea whether there would be any problems with just copy/paste external third parties scripts locally into my code (say React component)?

user3784950
  • 65
  • 10
  • 1
    Possible duplicate of [Multiple files on CDN vs. one file locally](https://stackoverflow.com/questions/21099528/multiple-files-on-cdn-vs-one-file-locally) – Taki Apr 11 '18 at 14:34
  • You already named updates, also for code maintainability it is often better to keep things separate. Additionally some browser caching might realize it already has that library for some other site and not download it again. The better question is why would you want to copy it in, i mostly see downsides. – ASDFGerte Apr 11 '18 at 14:35
  • @Taki thx, useful link @ ASDFGerte the upside is that with React you're supposed to keep JS in particular component it relates to, not to load in the head. So to load external script I need to create 'script' element and append it and then have onload property on that to execute callback, it would be simpler in some cases just to copy the script locally – user3784950 Apr 11 '18 at 14:49

2 Answers2

3

The point of a CDN is to avoid downloading common scripts more than once: if you visit website A, and it gets https://apis.google.com/js/api.js, then you visit website B which also gets https://apis.google.com/js/api.js, your browser will only download it the first time, and website B will load faster.

Copying the script into your own file will work but you'll lose this advantage.

Ben West
  • 4,398
  • 1
  • 16
  • 16
0

Yes, actually you can put it in a JS file and then in the Index.html you can do a reference to that file.

<script type='text/javascript' src="../../path/to/the/file/api.js"></script>
Prince Hernandez
  • 3,623
  • 1
  • 10
  • 19
  • thx for the answer, yes, although I was thinking to just copy/paste the script in my React component (for example because when I need to execute the callback after that I don't need to use onload, I can just simply execute the code after the script I pasted) – user3784950 Apr 11 '18 at 14:57