A Brief History of Web App Loading
In the beginning, there was the <script> tag. We managed dependencies manually by carefully arranging our scripts in our HTML. You had to be careful to load jQuery before you loaded your plugins, your app code after your libraries. This started to get out of hand as we began building more interactivity and evolved from web sites to web apps. We needed a way to manage and share dependencies, because large projects had complex waterfalls of requests that were difficult to manage and optimize. We had defer and async attributes, but they only help in some circumstances.
The first step forward was when we began concatenating our scripts together. This reduced the total number of HTTP requests that needed to be made and helped guarantee execution order, but it remained a manual process. Scripts needed to be concatenated together in the correct order in order to work. We can concatenate different groups of scripts together to balance each file’s size against the total number of requests, but we had to specify the order and grouping. This is about the time that the concept of having a build step for your Javascript gained popularity, and CoffeeScript entered as the first popular alternate syntax.
Enter Require.js and Bower. Require.js introduced “asynchronous module definitions,” or AMD modules, a packaging method still used by some apps. They were loaded into the…
