Fork me on GitHub

combined Template

Universal combined Module optimization for Web, AMD & nodejs!

The combined build.template builds your bundle as a single .js file, ready to be deployed anywhere!

Its one of the most important features of uRequire, as the single .js file is a 3-fold build that runs as-is :

  • on Web/Script, via a simple <script> tag on HTML.

  • Web/AMD

  • nodejs

See combined deployment for details.

How it works

The combined template actually uses a tweaked optimization of r.js using almond to offer an AMD runtime independent (yet AMD runtime compatible) execution.

Globals/externals (like 'lodash' or 'Backbone') are not inlined, but are used either from window, the AMD config or nodejs require, depending on where its executing.

The combined script automagically detects at runtime where it is executing and chooses appropriately.

Bundle exported dependencies

All dependencies/variables declared in config's bundle.dependencies.exports.bundle are available through the bundle, and are normally injected in every module.

In combined template they are not injected in each module, to save on size/speed. Instead, they are available through the combined closure, to save from being define/require -ed in each module.

Merging Code

With combined template you can greatly reduce the size of the pre-minified code.

Most of this is automated, but you need to bear a few things in mind.

Merging pre-define IFI* statements

(* IFI = Immediate function invocation also known as Immediately Invoked Function Expression (IIFE))

When a Module is written in a coffeescript family language (Livescript, coco, iced etc) and is using the AMD define() format, all generated code like __extends, __slice or __curry$ goes outside the define() when compiled. For example:

define [.., ..], (.., ..)->
  class A extends B

will compile to something like

(function() {
    var __slice=..., __extends=..., __curry$ = ...; // these are the preDefineIFI statements

    define([.., ..], function(.., ..){...});    
}());

These generated code fragments are present in each module that uses them, wasting space: you 'll end up with delivered code that has many duplicate code, especially in coffee-* derivatives with complex generated code like iced or livescript.

The combined template in uRequire >= v0.6 recognises any pre-define IFI statement/declaration and merges them in one place, available through the closure for the whole combined bundle. This again saves on size/speed.

Ro take advantage of this:

  • Just author in AMD & compile without --bare (or dont compile your .coffee, let uRequire do it)

  • Use this super simple RC that wraps you node-js module and turns them into AMD BEFORE being compiled from .coffee to .js Resource Converters.

User defined common & merged code

First check bundle.commonCode, on how to inject common code in all you modules, but then are written only once on the combined.js.

Then check module.mergedCode which is similar, but can selectively omit injection in some files & require a ResourceConverter.