nojank

Jank refers to sluggishness in a user interface, usually caused by executing long tasks on the main thread, blocking rendering, or expending too much processor power on background processes.

nojank is the zero-dependency tool to help implement and maintain cooperative multitasking in single-threaded javascript applications. nojank warns you if your node or browser thread is blocking for too long without returning control to the event loop.

Installation

yarn add nojank

npm i nojank

Usage

import { nojank } from 'nojank'

nojank() // Start the watchdog

If the watchdog detects jank, it will produce output like this:

***WARNING JANK 642ms DETECTED, CHECK YOUR SYNCHRONOUS CODE NOW

Configuration

nojank accepts a config object.

import { Config } from 'nojank'

const config:Config = {
    checkInterval: 100,  // How often to check for jank. This should be at least 10ms less than `threshold` to avoid minor scheduler delays
    threshold: 150,      // Any blocking operation longer than this value will be reported as jank
    warn: console.warn,  // Any logging/output function you want (msg:string)=>void
}

nojank(config)

What to do about jank

nojank just detects the jank, it doesn't (currently) do anything about it. But there are things you can do about it on your own.

Strategy 1: Cooperative Multitasking

Cooperative multitasking means breaking jobs into smaller pieces and executing them bit by bit until everything is finished. You can use something like cooperative to help with this, or you can roll your own using setInterval. In future versions, we may explore implementing a cooperative worker.

Strategy 2: Offload to Webworker or separate process

This strategy is complex and specific to your use case. nojank is focused on cooperative multitasking.