Where is it better to import the js file?

I would like to know which solution is the fastest and best for my web pages between importing a javascript file from external source and from inside. What are the pros and cons for each solution. For example, which one is better:

< script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 

or

 < script type="text/javascript" src="../jquery.js"></script> 

(same for json2.js)

I did not find any tips on google

Thanks!

+4
source share
7 answers

The main advantage of using CDN (content delivery network) is that, given their widespread use, it is likely that your visitor may already have a cached copy of the script that you are trying to download in your browser. This completely negates the load time. If they don’t have a cached copy, the likelihood that the CDN will deliver them to them faster than your server can in any case. In my opinion, it is best to use CDN where possible.

Even with this in mind, CDNs are not infallible, and you do not want your site to rely 100% on another server. I would advise getting a local copy of your scripts and using them as a backup where possible. For jQuery, this is pretty simple:

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> if (typeof jQuery == 'undefined') { document.write(unescape("%3Cscript src='/Scripts/jquery-1.7.1.min.js' type='text/javascript'%3E%3C/script%3E")); } </script> 

Other libraries may differ in their testing methods if they are loaded, but the idea is the same.

It is also worth noting that if you download ALWAYS from Google CDN, use the full version number, otherwise the script will not be cached.

That is, if your request URL looks like this:

 "http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" // highest 1.4 version (1.4.4) "http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" // latest version (1.7.1) 

The expires header is set to the current date, so the caching effect is invalidated.

Read more about it here.

+4
source

The fastest of them definitely depends on your own server, at least in most cases (that is, in pure download speed). However, it is much more likely that the visitor has a version of jQuery from Google, already cached in his browser, from visiting another site using the same library, and therefore, it probably makes sense to use the Google API for the most common libraries, as this will much faster if the library is cached compared to having to download it from your server.

In addition, these days you can do this and request a version simply by using the first number:

 http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js 

And automatically get the latest version;)

+3
source

If you import javascript from http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js to improve access to data, Google has a CDN, which means more efficient delivery of content to users (depends from their location).

More details about CDN: http://developer.yahoo.com/performance/rules.html

+3
source

http://developer.yahoo.com/performance/rules follow this link, it will be very useful for you.

+2
source

Using CDN has some advantages:

  • If a user has already visited another site that uses the same script from the same place, it may already be in the browser cache. Page loading speeds up when they don’t need to reload it.
  • The CDN provider is probably configured on the server to maximize the efficiency of serving scripts, for example, by sending a file from the server, it is physically closed to the user.
  • You save bandwidth.

Disadvantages:

  • You depend on the service provider: if their service does not work, your site breaks. (This can be useful when serving a local copy of a file if an external script cannot be loaded.)
  • You must trust the service provider to maintain the correct file and nothing malicious.
+2
source

If this is a well-known resource, for example googlePlusOne or another stable web service (or external ad), it is better to use an external link. Thus, it will always be relevant. If it is a js library (e.g. jQuery or Ext), it is better to load the source.

0
source

Downloading libraries from the local repository will always be faster, which means that local is always better, but ... Loading libraries from external sources, such as jQuery, will allow your site to always download the latest version of the library.

0
source

Source: https://habr.com/ru/post/1384184/


All Articles