It is the same to have linked resources and to embed them in the html page. However not convenient to use on multiple pages. Then you have to repeat yourself.
If you put all scripts and css together keep this in mind:
In most cases, the bulk of the JavaScript code handles user-initiated events, such as mouse-clicking and dragging. All of these user-triggered events occur after the page is loaded and the onload event is triggered. In order to defer loading of these JavaScripts insert a JavaScript event listener in the head of the containing document that forces the external file to be loaded after the onload event. ( Google developers tips )
This is the code-example to make it more clear, the delaying scripts will be loading after the essential page elements have been formed:
// Add a script element as a child of the body
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "deferredfunctions.js";
document.body.appendChild(element);
}
// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;