Skip to main content

4 HTML5 & jQuery Preloading Plugins/Scripts

By Sam Deering

JavaScript

Share:

Free JavaScript Book!

Write powerful, clean and maintainable JavaScript.

RRP $11.95

Here are a few HTML5 & jQuery Preloading plugins/scripts to bring better user experience to your HTML5 web apps. The plugins/scripts load text content, images, backgrounds, video, audio etc… from your static assets and/or linked CSS stylesheets. Enjoy!

Related Posts:

1. jQuery.html5Loader

It can preload images, html5 video and audio sources, script and text files.

jQueryhtml5Loader-copy.jpg
SourceDemo

2. basket.js

It is a small JavaScript library supporting localStorage caching of scripts.

Example:
Single script

basket.require({ url: 'jquery.js' });

Multiplt scripts

basket.require(
    { url: 'jquery.js' },
    { url: 'underscore.js' },
    { url: 'backbone.js' }
);

Source

3. jquery-ajax-html5-cache

A cache for ajax request to reduce the requests.

$.ajax({
    url: 'test.json',
    dataType: 'json',
    localCache: true,       // enable localStorage
    forceCache: false,      // force to make an ajax request and cache it
    cacheKey: 'mydata',     // the item name in the localStorage
    cacheTTL: 3,            // the cache live for how long in seconds, default is 60 sec
    success: function(o){
        console.log(o); //see new ajax function .done()
    }
})

Source

4. CreateJS

A suite of Javascript libraries and tools for building rich, interactive experiences with HTML5.

PreloadJS example

var preload = new createjs.LoadQueue();
preload.addEventListener("fileload", handleFileComplete);
preload.loadFile('http://createjs.com/images/404/gBot-confused.jpg');
function handleFileComplete(event) {
    document.body.appendChild(event.result);
}

Source

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

New books out now!

Learn how Git works, and how to use it to streamline your workflow!


Google, Netflix and ILM are Python users. Maybe you should too?