Put CSS and JavaScript in files or main HTML?

Question

Although it is always recommended to put JavaScript and CSS code into appropriate files (as .js and .css), most of major websites (like Amazon, facebook, etc.) put a significant part of their JavaScript and CSS code directly within the main HTML page.

Where is the best choice?

Answer 1

Place your .js in multiple files, then package, minify and gzip that into one file.

Keep your HTML into multiple seperate files.

Place your .css in multiple files, then package, minify and gzip that into one file.

Then you simply send one css file and one js file to the client to be cached.

You do not inline them with your HTML.

If you inline them then any change to the css or html or js forces to user to download all three again.

The main reason major websites have js & cs in their files, is because major websites code rot. Major companies don't uphold standards and best practices, they just hack it until it works then say "why waste money on our website, it works doesn't it?".

Don't look at examples of live websites, because 99% of all examples on the internet show bad practices.

Also for the love of god, Separation of concerns please. You should never ever use inline javascript or inline css in html pages.