: Javascript in HTML vs in a .js file I heard that putting the javascript in the html code isn't good for SEO and that it's better to put it in a .js file. It's clear that it makes the
I heard that putting the javascript in the html code isn't good for SEO and that it's better to put it in a .js file. It's clear that it makes the code more understandable but is it the only reason?
More posts by @Martha676
3 Comments
Sorted by latest first Latest Oldest Best
If you include the JavaScript in the HTML, then the user has to download the JavaScript for every page they view that needs it.
If you make it an external file, then they have to download it once, which is slightly slower than including it in the page, because of the extra HTTP request. However, after that, it will be cached and they don't need to download it again.
In terms of the impact on SEO, that's the benefit - your site is quicker, which Google rewards greatly.
This means that if you have a piece of JavaScript that a user is going to need repeatedly, it should be external. If it's a one-off, you should include it on the page to reduce the number of HTTP requests.
Examples of where on-page JavaScript could be beneficial:
Arbitrage advertising sites, which typically pull a user in and bounce them out again. The user is typically not going to browse around. However, if you expect the user to come back again, you probably should make the JavaScript external so that it's cached when they return.
One-page sites. The same caveat applies as to arbitrage sites.
Pages which use a completely different set of JavaScript to every other page on your site. If, for example, you have a JavaScript slider on a particular page on your website and most of your visitors only look at that page once, then including the JavaScript in the header will probably be worth it for the SEO.
For code management, you are still best to develop with the code in an external file and then use a deployment script to grab the code and insert it for the production version of your code.
Finally, shared libraries like jQuery should always be external, because they will often already be cached in a visitor's browser from another site they visited.
Other reasons to keep JavaScript in external files:
Pages usually load faster because JavaScript and stylesheets are cached by the browser.
Checking for scripting errors with JSLint becomes easier.
Code reuse between pages becomes simple.
Minifying JavaScript to reduce file size while maintaining non-minified versions for editing is easier.
Centralised hosting of common files becomes possible. (e.g. Google Libraries API )
Note that using JavaScript should make little difference to SEO (externally or internally) unless:
It's being used to generate links or other dynamic content on the page.
Your scripts are so big that they drastically increase page load time.
In the case of 1, it's best not to create links with client-side JavaScript when you can. In the case of 2, it's good practice to minify stylesheets and JavaScript, then combine files to serve it with as few HTTP requests as possible.
There are two additional reasons for external JS files.
Caching. Once an external JS file is downloaded by the browser for the first time, it stays in browser's cache and the same code does not have to be downloaded every time a visitor reaches a page that she has not opened
Code management. If you want to change your script, you do it once, by modifying the JS file. The same effect may be obtained by server-side inclusion directly into an HTML document but the advantage of caching (point (1)) is not there anymore.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.