bundles in requireJS

Question

I am new to requireJS and tring to learn it so that i can use it in my current application.
While reading API documentation of requireJS, I came across bundles

Answer 1

When building a large SPA (Single Page App), it is imperative that you concatenate and minify your files. The problem with doing it, is that you might end up with one massive minified js file that can get as large as a few megs.

In order to solve this, require introduces the bundle feature, which allows you to pack your files in several bundles, and those would be loaded only when needed.

So, for example if you have a page with 'home' and 'about', you can create a bundle like:

bundles: {
        'home': ['home', 'util', 'text', 'text!home.html'],
        'about': ['text!about.html']
    }

and then the about page resources would only be served when you actually click the about page. That way you get lazy loading of resources.

For better explanation and example, watch this great video: http://vimeo.com/97519516

The relevant part is around the 39 min.