A total newbie. This seems like a basic question, but one that I can't find the answer to:
I have a few lines of JQuery to show and hide a responsive menu on half-a-dozen pages. I understand I need to "link" to the JQ library:
<script src=".3.1/jquery.min.js"></script>
Will this slow my site down? Will a visitor have to download the whole JQ library for my two lines of code to work? if this is the case I might revert back to Javascript.
A total newbie. This seems like a basic question, but one that I can't find the answer to:
I have a few lines of JQuery to show and hide a responsive menu on half-a-dozen pages. I understand I need to "link" to the JQ library:
<script src="https://ajax.googleapis./ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Will this slow my site down? Will a visitor have to download the whole JQ library for my two lines of code to work? if this is the case I might revert back to Javascript.
Share Improve this question asked Apr 2, 2018 at 12:40 MarkeeeMarkeee 5732 gold badges10 silver badges27 bronze badges 4- 1 this may slow down website. Its better to have local copy on your server. – Trupti Commented Apr 2, 2018 at 12:42
- 1 @T.Bhamare: It's much more plicated than that, and probably faster at least as often as slower than a local copy. – T.J. Crowder Commented Apr 2, 2018 at 12:42
- Initially it might be slow, but very unlikely since there's a very good chance that the user has the file already cached. – zer00ne Commented Apr 2, 2018 at 12:43
- If the link is a CDN then its good to have a CDN reference. Else keep the file in local directory and get its path. – Himanshu Upadhyay Commented Apr 2, 2018 at 12:44
4 Answers
Reset to default 4Loading a script file is never free, so you have to decide whether it's worth it for the functionality provided.
Once you've decided to do it (if you do), the question is whether to use a CDN or host it locally.
Pros of a CDN:
- It may already be in browser cache because the same file is used elsewhere.
- CDNs use edge-casting, highly-optimized servers and server configurations, etc. to make delivery as fast as possible. While it may be possible for you to have a server that's just as fast, it's quite likely that you don't.
Const of a CDN:
- If the CDN is down, the link doesn't work even though your site is up and running.
- It's not under your control.
Generally, yes. There are certain conditions which can affect the download speed, like content blocking, cache and async.
We can caluculate how long it will take to download a file if we know the internet connection speed and the file size.
That minified jquery CDN file is 84.8 KB.
And the average global internet connection speed is around 7.2 Mbps.
So...
It will take about 78.45 ms to download a file of that size.
Depending on what you think is a site slowdown. Are some miliseconds a huge slowdown?
You can speed up the process slightly by having the jQuery library on your own server (eliminates the need for extra request to the google CDN => saves time). Another thing to speed up the process would be to use the SLIM and minified CDN versions of jQuery.
Now if you have only 2 lines of code, there might not be a particular need to just include jQuery for that (again think longterm), but think if in the future you would use jQuery for more things.
In the end the including of just jQuery will not slow down your response times that much (max of a couple of miliseconds).
Hope this helps!
The CDN network will not slow down your webpage since you are trying to get the minified file. Even if you use the offline file, it will still take some time to load from the storage. Since you are developing a web site/web application, your app should be connected to network. If you are not showing any jquery content when the page first loads, you can make it to load in the background by adding async
attribute to the script
tag.
You can check how much time this file takes to load by going to (in Chrome)
developer console -> Network.
It will show list of requests and its time to finish. Different filters are also available. So select All to see all network connections and time for finishing the request.