The definitive source of the best
JavaScript libraries, frameworks, and plugins.

  • ×


    :zap: A very easy-to-use, blazing fast asset-loader using promises. Support older-browsers and preload images, audios and videos.
    Filed under 

    • 🔾20%Overall
    • 127
    • 21.9 days
    • 🕩4
    • 👥5

    Build Status license license license

    A very easy-to-use asset-loader using promises. Supports images, audio and video. Fully documented for a perfect usage in your TypeScript projects.


    Install using yarn or npm:

    • yarn add loaderz
    • npm install loaderz --save


    // Default export of Loaderz is the Loader.
    import Loader from 'loaderz';
    // A list of heavy images to load, it could be art-assets for your HTML5 game
    const images = [
    // Some audio elements to spice-up your HTML5 game
    const audios = [
    // Instanciate the loader, you can easily implement it anywhere in your project
    const loader = new Loader();
    // Queue all our different resources (we can chain since queue returns the
    // instance of loader)
      .queue('image', images)
      .queue('audio', audios);
    // Start loading the resources and have a full control of the global loading
    // state using a promise and return a response with all elements loaded
      .then(response => console.log('All urls have been loaded, do whatever you want here:', response));


    • Loader#queue(type: string, src: string | string[]): accepts 3 different types of medias (audio, image, video).
    • Loader#start(): used to load all the queued resources. Returns a global promise of the resources loading.

    • Loader#queuedImages: an array of URLs of images queued to load.

    • Loader#queuedMedias: an array of MediaData elements queued to load.


    All the code is written in TypeScript. Feel free to contribute by creating issues, PRs or suggesting new features:

    1. Fork and clone the repo:
    2. Install all dev-deps: yarn install or npm install
    3. Run the demo: yarn demo (localhost:8080)
    4. Edit some files
    5. Run tests: yarn test or npm test
      • (optional) run yarn lint or npm run lint to automatically lint the files
    6. Commit and push your edits on a separate branch
    7. Create a PR which points on the develop branch


    Under MIT license, view the license file for more informations.

    Show All