I've been reading many articles lately about SEO on load times. Trying to get the perfect load time can be quite time-consuming but also a good feeling when you see your site loading twice as quick.
Now a lot of these tutorials and blogs are saying to put chunks of CSS/JS in you head tag to help above-the-fold content to load faster.
"external resources take longer to load", each request back to the server for a file takes more time. So would it not make sense to actually just embed all CSS/JS in your head tag from the beginning.
Sure this could look messy at first, but the only reason why it takes long for external scripts to download in the browser is because the output has already been sent to the browser.
What if we simply do:
<head>
... Usual things here ...
<?php require('css/bootstrap'); ?>
<?php require('css/mystylesheet'); ?>
</head>
<body>
... Usual things here ...
<?php require('js/bootstrap.js'); ?>
<?php require('js/myscript.js'); ?>
</body>
Now this will just be served as a simple HTML file with embedded CSS and JavaScript as soon as it hits the users browser. And it is just as clean looking in our text editor as before because we require the file in PHP.
Would this improve overall speed performance or should i stay clear of this method?