how is html,css,javascript files bundled and sent from server to client browser?

I have a basic question about websites/webapp. Typically websites/webapps have a html page which uses couple of css files and couple of javascript files. I am curious how all these files are sent from server to client browser. One simple but inefficient way could be that first server sends across html. Then, the client browser parses the html and figures out all the files/path/URL names of css,javascript files and then makes one request for each of this file. Then, the browser renders the webpage on the browser. This is inefficient, because the client is making multiple request for files which anyway it needs compulsorily. A better approach might be that in the first reponse itself, the server bundles together all these html,css,javascript files into one single response (may be the response stream would contain file name in header then file data, then delimiter, then file name, file data then again delimiter and so on). Both these solutions are just my guesses.

I am curious to know what is the technique being followed in practice. What does the structure of response look like etc.