One-tab-one-module pattern in YUI

gistfile1.js

// example module
YUI.add('foo', function (Y) {
    
    // each of these modules must have a class named exactly like the module
    function Foo() {}
    // it's useful, in the case of tabs, 
    // for these classes to have a focus() method. Check below
    Foo.prototype.focus = function () {};
    
    Y.Foo = Foo;
});

YUI({
    modules: {
        foo: { fullpath: 'foo.js' },
        bar: { fullpath: 'bar.js' },
        baz: { fullpath: 'baz.js' }
    }
}).use('tabview', function (Y) {
    
    // The index of the item in the array matches the tab in the tabview
    var MODULE_IN_TAB = ['foo', 'bar', 'baz'];
    // Here we'll keep a reference to each module's main class
    var modules = {};
    
    function handleSelection(e) {
        // Get the name of the module from the index of the tab
        var required = MODULE_IN_TAB[e.child.get('index')];
        if (!modules[required]) {
            // set the module to true to avoid loading it more than once
            // (remember YUI().use() is async)
            modules[required] = true;
            // Call YUI().use reusing the configuration.
            // This sandboxes each module.
            // You can, if you want, do Y.use() instead
            YUI(Y.config).use(required, function (_Y) {
                // when the module loaded, keep a reference to the class
                modules[required] = new _Y[
                    required.charAt(0).toUpperCase() + required.substr(1)
                ]();
            });
        } else if (modules[required] !== true) {
            // let the class know the user clicked in the tab
            modules[required].focus();
        }
    }
    
    var tabview = new Y.TabView({
        children: [{
            label: 'foo'
        }, {
            label: 'bar'
        }, {
            label: 'baz'
        }],
        on: {
            selectionChange: handleSelection
        }
    });
    tabview.render();
    
});