Nowadays web applications are increasingly Javascript dependent and often load these files requires a waste of resources and a considerable slowdown of the system. For this reason it’s highly recommended to use a Javascript loader instead.

A Javascript loader consists of a set of tools that allows you to load Javascript scripts just when you need them. In this way you don’t need to include all files when the page is loaded but you will be able to call the scripts only when they need to be loaded.

In this post we have collected 12 Javascript libraries that helps you in creating light and fast web applications by allowing you to loading scripts asynchronously.

Comparison Table

In the following table we have resumed some of the most important features contained into the libraries:

• Latest Version
• Size (minified version)
• License
• If the library contains documentation or wiki
• The plugins support
• If the library allows callbacks
• If the library allows twice calls to the same script
• If the library avoids twice calls to the same script
• If the library provides a callback when a 404/500 error occurs
• If the library allows priorities in scripts queue
• If the library allows to use dependencies in scripts queue

Library	Version	Size (Min)	License	Doc	Samples	Plugins	Callback	Twice Calls	Avoid Twice Calls	404 / 500 CB	Priorities	Dependencies
LABjs	2.0.3	4.7 KB	MIT	Yes	Yes	No	Yes	Yes	Yes	No	No	No
HEADjs	0.96	6 KB	MIT	Yes	Yes	No	Yes	No	Yes	No	No	No
JSL	1.1.0	2 KB	MIT	Yes	No	No	Yes	Yes	Yes	No	Yes	No
JSLoad	0.9	8.4 KB	LGPL	No	Yes	No	Yes	No	Yes			Yes
NBL	2.0	0.9 KB	MIT	Yes	Yes	No	Yes	Yes	Yes	Yes	Yes	Yes
RequireJS	0.27.1	12 KB	MIT	Yes	Yes	Yes	Yes			Yes	Yes	Yes
curl.js	0.5.3	3 KB	MIT	Yes	Yes	Yes	Yes	Yes	Yes	Yes	Yes	Yes
YepNope	1.0.2	3 KB	WTFPL	Yes	Yes	Yes	Yes	Yes	Yes	Yes	No	No
Pinf	0.2.21	22 KB	MIT	Yes	Yes	No	Yes	No	Yes	No	Yes	Yes
ControlJS		3 KB	Apache 2.0	Yes	Yes	No	Yes	No	Yes	No	No	No
$script.js		2.5 KB	CC	Yes	Yes	No	Yes			Yes	No	No
Bootstrap	1.0	1 KB	Apache 2.0	No	Yes	No	Yes		Yes	No	No	No

Javascript loader libraries

LABjs

LABjs (Loading And Blocking JavaScript) is an open-source (MIT license) project supported by Getify Solutions. The core purpose of LABjs is to be an all-purpose, on-demand JavaScript loader, capable of loading any JavaScript resource, from any location, into any page, at any time. Loading your scripts with LABjs reduces resource blocking during page-load, which is an easy and effective way to optimize your site’s performance.

Link: http://labjs.com/

HEADjs

With Head JS your scripts load like images – completely separated from the page rendering process. The page is ready sooner. This is guaranteed even with a single combined JavaScript file. Head JS loads scripts in parallel no matter how many of them and what the browser is. The speed difference can be dramatic especially on the initial page load when the scripts are not yet in cache. It’s your crucial first impression.

Link: http://headjs.com

JSL

JSL is a Javascript loader libraries that comes out with the following features:

• On-Demand JavaScript Loading new
• Browser Cacheable new
• Dynamic Asynchronous JavaScript Loading
• Lazy Loading
• Ordered Loading
• Duplicate Source Prevention updated
• Ultra Fast and Lightweight
• Use DOM or Script Tag writing
• Cross-browser
• Cross Domain ready new
• Works with other JavaScript Libraries
• Works with Inline Script Dependencies
• Flexible License

Link: http://www.andresvidal.com/jsl

JSLoad

JSLoad is a Javascript file loader. You give it a set of dependencies and groupings, and it loads the files you need, when your executing code needs them. JSLoad is released under the LGPL. JSLoad does the basics: you tell it that file 1 depends on file 2, so it loads file 1 first, then file 2. Throw any number of other dependencies into the mix, and JSload figures out the dependency chain and loads the files in the right order.

Link: http://code.google.com/p/jsload/

NBL

NBL.js is a tiny script that will make your HTML pages load faster by loading all your JavaScript files asynchronously (in parallel) with the rest of your page. Normally if you include two or three scripts in your page, the browser will wait for them to be executed before your page is shown.

Link: http://berklee.github.com/nbl/

RequireJS

RequireJS is a JavaScript file and module loader. It is optimized for in-browser use, but it can be used in other JavaScript environments, like Rhino and Node. Using a modular script loader like RequireJS will improve the speed and quality of your code.

Link: http://requirejs.org

curl.js

curl.js is a small and very fast AMD-compliant asynchronous loader.

If you’d like to use curl.js for non-AMD modules (ordinary javascript files), you’ll want to use a version with the js! plugin built in. You may also want to build-in the domReady module. The combined curl+js+domReady loader is only 6.5KB (3KB gzipped).

Link: https://github.com/unscriptable/curl

YepNope

yepnope is an asynchronous conditional resource loader that’s super-fast, and allows you to load only the scripts that your users need. Some of its features are:

• yepnope.js is only 1.6kb – smaller than most and certainly a good size for its functionality set.
• yepnope.js is called a “resource loader” because it can work with both JavaScript and CSS.
• yepnope.js has a full test suite in QUnit that you can run in your set of supported browsers to make sure it works. (We run it via TestSwarm in every browser we can get our hands on)
• yepnope.js fully decouples preloading from execution. This means that you have ultimate control of when your resource is executed and you can change that order on the fly.
• The yepnope.js api is friendly and encourages logical grouping of resources.
• yepnope.js is modular. It has a whole system for adding your own functionality and a couple examples of how you might do that. (Prefixes and filters).
• The yepnope.js api encourages you to only load the resources that you need. This means that even when it’s slower than another script loader, it still can come out on top, because you could avoid an entire resource.
• yepnope.js is integrated into Modernizr.
• yepnope.js always executes things in the order they are listed. This is a pro for some, and a con for others. We think it’s a friendly default.

Link: http://yepnopejs.com/

Pinf

The PINF JavaScript Loader asynchronously combines what you would traditionally call a package installer and class loader and is intended to be used as the core to all your JavaScript applications no matter what platform they run on.

The loader allows for bootstrapping a state-of-the-art, consistent and portable CommonJS environment for any supported platform (on servers, in browsers, desktop applications, secure sandboxes, and embedded) and thus is ideally suited to be used as the target for the commonjs command (currently being standardized) and the development of cross-platform JavaScript applications and libraries that may be shared with the CommonJS ecosystem.

Link: https://github.com/pinf/loader-js

ControlJS

ControlJS is a JavaScript module for making scripts load faster. Its main features are:

• downloads scripts asynchronously
• handles both inline scripts and external scripts
• delays script execution until after the page has rendered
• allows for scripts to be downloaded and not executed
• integrates with simple changes to HTML . no code changes
• solves some document.write async use cases
• control.js itself is loaded asynchronously

Link: http://stevesouders.com/controljs/

$script.js

$script.js: an asynchronous JavaScript loader and dependency manager with an astonishingly impressive lightweight footprint of only 643 bytes. Like many other script loaders, $script.js allows you to load script resources on-demand from any URL and not block other resources from loading (like CSS and images). Furthermore, it’s unique interface allows developers to work easily with even the most complicated dependencies, which can often be the case for large, complex web applications.

Link: http://www.dustindiaz.com/scriptjs/

Bootstrap

Bootstrap is a small library for dynamically loading JavaScript files. It’s primary use case is for using in your JS code to load JS files only when they are used.

Link: https://bitbucket.org/scott_koon/bootstrap