Curious case of library lazy loading

Lets say that you have a performance budget and you have a thumb gallery on your web app. You want light-box library resources to be lazy loaded (JS and CSS) after user clicked on thumb. If we assume that you have an implementation of resource loader your application code might end up looking like this:


    var $items = $('.gallery a');

    $items.on('click', function(e) {
        resourceLoader.makeSureIsLoaded('$.SimpleLightbox', function() {
            SimpleLightbox.open({
                $items: $items,
                startAt: $items.index($(e.target)),
                bindToItems: false
            });
        });
    });