npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

load-queue

v1.1.0

Published

Designed to allow running task in a queue with parallel support. Can be used for image or file loading.

Downloads

155

Readme

Load queue

Designed to allow running task in a queue with parallel support. Can be used for image (package) or file loading.

  • Small library: 6kb minified.
  • Simple queue with custom task defined with simple function

Queues types:

  1. Queue - Standard load queue, the default export.
  2. CachedQueue -- Cached load queue - when adding already loaded url, it will not use queue and call success immediately (errors are not cached)

Install

npm install load-queue --save

Browser

Library is exported via UMD. From LoadQueue object you can access to default queue, Queue and CachedQueue.

<script src="./dist/load-queue.js" type="text/javascript"></script>

<script>
var queue = new LoadQueue.default(loaderTask)
var queue2 = new LoadQueue.Queue(loaderTask, 1)
var queue3 = new LoadQueue.CachedQueue(loaderTask, 4)
</script>

Import / Require

Default (Queue)

import Queue from 'load-queue'

var queue = new Queue(loaderTask)

Queue

import {Queue} from 'load-queue'

var queue = new Queue(loaderTask)

CachedQueue

import {CachedQueue} from 'load-queue'

var queue = new CachedQueue(loaderTask)

Usage

Before constructing queue, you must provide your own task implementation. The function will accept 3 arguments:

  1. entry - An QueueEntry with an url entry.url
  2. success - A callback that accepts any custom arguments that will be passed to your custom callback
  3. failure - A callback for failure that accepts an error Error object
/**
 * @param {QueueEntry} entry
 * @param {function} success
 * @param {function} failure
 */
var loaderTask = function (entry, success, failure) {
        // ... loading entry.url
        setTimeout(function () {
            if (entry.url === 'url1') {
                failure(new Error('Failed!'))
            } else {
                success('my custom var', 'custom var 2')
                // or just success()
            }
        }, 1000)
    }

Queue construct accepts:

  1. The task function.
  2. Number of concurrent jobs that can be ran (default 1).
  3. start timeout - defines if the start will use timeout function to throttle calls and give time for start -> cancel use case (when user scrolls in list and etc). Set null to turn it off. Default is 50ms (which is enough for fast scroll)
var queue = new Queue(loaderTask)
// or 
var queue = new Queue(loaderTask, 2)
// or
var queue = new CachedQueue(loaderTask)

To add a new url to load queue, just call add(url, success, error). The add method will return the QueueEntry that holds given url.

var entry = queue.add('url', function(url, customVar, customVar2) {
    console.log(url, customVar, customVar2)
}, function(error) {
  console.log(error)
})
console.log(entry.url)

// Or cancel the request
entry.cancel()

QueueEntry

You can access to url and the cancel method. For internal use you can access to running task entry.task and call success/error callbacks (the callbacks that that executes).

Cancelling

You can cancel given url from queue at any time (even when loading - the callbacks wont be called). There are 2 ways how to cancel request.

  1. Calling cancel(url) on queue object. Like queue.cancel('test.cz')
  2. Calling cancel() on QueueEntry from add function.

Task cancel

If your task implementation needs to handle the cancel (like cancel the http request) then the queue will use it's own logic and then call cancel on the task.

var loaderTask = function (entry, success, failure) {
        // ... loading entry.url
        var timeout = setTimeout(function () {
            if (entry.url === 'url1') {
                failure(new Error('Failed!'))
            } else {
                success('my custom var', 'custom var 2')
                // or just success()
            }
        }, 5000)
        
        // Cancel the timeout
        this.cancel = function () {
            clearTimeout(timeout)
        }
    }

Copyright and License

load-queue was written by Martin Kluska and is released under the MIT License.

Copyright (c) 2017 Martin Kluska