Javascript - inline vs external script - what's the difference?

Question

I have a few snippets of javascript scattered about my pages - many are contained in my own .js files, however some of the stuff that I\'ve found online sits directly on the

Answer 1

External script files

• Much easier to analyse so you can debug more efficiently and read it. This makes life much easier for us as programmers
• Download time is reduced as the external file is cached so it can be downloaded with the website
• Instead of writing the same script numerous times, an external file can be called and executed anywhere in the code

External files decrease page rendering speed as the browser has to stop parsing and download the external file. This adds a network round trip which will slow everything down. Also because external files are cached it makes it tough to delete them if the have been updated

Inline code

• Inline code reduces the number of HTTP requests making improving the performance of the webpage. This because the code is loaded in the same page so a request is not needed
• Inline script is executed immediately

Although inline code is much harder to read and analyse as it just looks like a lump of code chucked together. It is hard work having to find the problem when debugging, making life as a programmer tough

Hope this helps you understand a bit more :)