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

noverlap

v5.2.1

Published

dependency-less-ly prevent function invocations (both sync and async) from redundantly overlapping with each other

Downloads

43

Readme

noverlap

dependency-less-ly prevent function invocations (both sync and async) from redundantly overlapping with each other

usage

first import noverlap

yarn add noverlap
import noverlap from 'noverlap';

then instantiate a noverlap instance

const throttle = noverlap();

or instantiate noverlap with custom configurations:

  • hash: a function that generate a hash given the wrapped function's arguments

  • comparator: a function that determines whether or not a hash has already been added as a key when looking through the map's keys. useful for when you've lost the reference to certain keys (eg storing objects or arrays as keys). defaults to the sameValueZero algorithm which is used by Map.prototype.has

  • wait: the timer duration in milliseconds that will start on each execution of an async function and reset with every overlapping execution

  • start: a callback (provided with the wrapped function's arguments) that will be synchronously executed right before the wrapped function

  • queue: a callback that gets fired when a function execution has been added to the queue that will be eventually flushed

  • beforeFinish: a callback that gets fired right before the wrapped function finally gets called and the queue gets flushed

  • success: a callback that gets fired when the redundantly invoked function was resolved

  • fail: a callback that gets fired when the redundantly invoked function was rejected

  • finish: a callback (provided with the return value of the wrapped function) that will be fired after the wrapped function

the following are the default configurations:

const defaultThrottle = noverlap({
  /** the first parameter will be considered the hash of the function execution */
  hash: (...args) => args[0],

  /** find a direct reference to the hash that will be looked up as the key in map.get(key) */
  comparator: (hash, existingKey) => { /* 'SameValueZero' algorithm */ },

  /** wait 420ms to see if another execution of the async function is overlapping with an existing one */
  wait: 420,
})

the following are not included by default but can be added manually during noverlap instantiation (these manual additions get merged with the default configurations)

const customThrottle = noverlap({
  start(payload) { console.log('a function has just been hashed', payload) },
  beforeFinish(payload) { console.log('about to execute the function with a payload of', payload) },
  finish(returnValue) { console.log('the redundantly invoked function returned', returnValue) },
});

you can also use a function or promise that is provided with the wrapped function's parameters to construct a noverlap instance's configs

const throttle = noverlap((...args) => /* noverlap configs */);
const throttle = noverlap(async (...args) => /* noverlap configs */);

let's use this dummy async function that we pretend makes a fetch to a server. we do not want this fetcher to make the same call multiple times in a row when in fact we only need the data from the latest call, which should return the most up to date response

const dummyFetcher = payload => new Promise((resolve, reject) => setTimeout(() => resolve(payload)));

apply the noverlap instance to an async function by wrapping it

const throttle = noverlap();
const fetchSomeData = throttle(async payload => {
  const response = await dummyFetcher(payload);
  console.log('this async function will only be executed once even if it is called with the same payload multiple times within 420ms');
  return response;
});

now, using fetchSomeData like this:

const redundantAsyncExecution = async n => console.log(
  `result from execution #${n} with a redundantly repeated fetch using ${
    await fetchSomeData('this payload')
  } 🤯`
);
redundantAsyncExecution(1);
redundantAsyncExecution(2);
redundantAsyncExecution(3);

will log:

this async function will only be executed once even if it is called with the same payload multiple times within 420ms
result from execution #1 with a redundantly repeated fetch using this payload 🤯
result from execution #2 with a redundantly repeated fetch using this payload 🤯
result from execution #3 with a redundantly repeated fetch using this payload 🤯