CODEWITHSUNDEEP
javascriptminify
LiamRyan
LiamRyan

Reputation: 1928

Developing javascript for minification

I've read several answers but I'm wondering the best way to achieve the following -

I have a commission to provide a widget-type javascript tool where my client will include the script, give a div an ID and the widget will take care of loading itself.

So far in development I've split the widget into multiple files for coherence (as the customer will want to be able to alter source code and re-minify). I use mechanisms such as $.load and callback methods attached to script tags to check if libraries are present and to include them if not.

How do I maintain this functionality and coherence while at the same time providing for minification? I assume that having 6 or 7 minified files defeats the purpose, but if my logic dictates including multiple libraries and linking to other source files then surely I can't just minify into one file?

Upvotes: 0

Views: 49

Answers (1)

Mark Robbins
Mark Robbins

Reputation: 2457

Your libs should all be minified already, or available like that, and your app should reside in a single object. Generally:

FILE-BOOTSTRAP

// Create Global "extend" method
var extend = function(obj, extObj) {
    if (arguments.length > 2) {
        for (var a = 1; a < arguments.length; a++) {
            extend(obj, arguments[a]);
        }
    } else {
        for (var i in extObj) {
            obj[i] = extObj[i];
        }
    }
    return obj;
};

FILE-A

window.APP=window.APP||{};

extend(window.APP,{
  //subsystem A functionality
  subsystemA:{
  }
});

FILE-B

window.APP=window.APP||{};

extend(window.APP,{
  //subsystem B functionality
  subsystemB:{
  }
});

FILE-Z

window.APP.boot();

So you just concat the files and minify. If you have a bunch of functions/classes in Global, you will have to have enclose your whole mess in a self-executing function before minification.

Upvotes: 1

Related Questions