Web Page Performance - CSS and JavaScript in Separate Files? [duplicate]

Question

Looking at the Google HTML/CSS Style Guide, I don't see anything specific. It seems like putting the CSS and JavaScript in the HTML file would perform better than loading external files.

For production Websites, should I include everything in 1 file, or no?

Answer 1

Usually when you develop, you split up your code in your project tree. So you have a large amount of js, and maybe css / sass / less files.. which represents smaller components for your project.

When you are going to launch your project to production, you usually have build program which concatenates all the files into a single bundle and this bundle is also minified, for faster loading like bootstrap.min.js for a example.

Take a look (google) for some production ready packer like:

• brunch
• webpack