Network Idle

Detect when the browser has not made a network request within a specified amount of time. This implementation does not depend on a Service Worker and instead depends on a PerformanceObserver listening for resource entries.

Installation

``
npm i network-idle
`

Types

$3

`ts
type CallbackType = () => void
`

$3

`ts
interface IOptions {
filter?: string[]
}
`

- filter: Sometimes you may want to perform a request in your idle callback. To prevent that request from triggering another callback, add its URL to the filter string array. Works on both requestNetworkIdle and networkIdleCallback.

`js
requestNetworkIdle(() => {
fetch('https://foo.bar/baz/?qux=corge') // Won't trigger callback again
}, 1000, {
filter: [ 'https://foo.bar/baz/?qux=corge' ]
})
`

API

$3


Calls the callback when there has not been a network request in the last timeout milliseconds. The callback will be called every time the network has been idle for the specified amount of time.

#### Signature
`ts
requestNetworkIdle(callback: CallbackType, timeout: number, options: IOptions = {}): number
`

#### Arguments
- callback () => void: The function to call when the network is idle.
- timeout number: How long there should be no network requests for the browser to be considered idle.
- options IOptions: Additional configuration options.

#### Returns
- id number: Callback id

`js
import { requestNetworkIdle } from 'network-idle'

// No network requests in the last 500 milliseconds
requestNetworkIdle(() => {
// Called every time the network is idle
console.log('Network is idle!')
}, 500)
`

$3


Calls the callback when there has not been a network request in the last timeout milliseconds. Unlike requestNetworkIdle, this method will only be called the first time the idle condition is met.

#### Signature
`ts
networkIdleCallback(callback: CallbackType, timeout: number, options: IOptions = {}): number
`

#### Arguments
- callback () => void: The function to call when the network is idle.
- timeout number: How long there should be no network requests for the browser to be considered idle.
- options IOptions: Additional configuration options.

#### Returns
- id number: Callback id

`js
import { networkIdleCallback } from 'network-idle'

// No network requests in the last 500 milliseconds
networkIdleCallback(() => {
// Called the first time the network is idle
console.log('Network is idle!')
}, 500)
`

$3


Clears the network idle handler. This will clear both the requestNetworkIdle and networkIdleCallback events.

#### Signature
`ts
clearNetworkIdle(id: number): void
`

#### Arguments
- id number: The callback id returned by requestNetworkIdle or networkIdleCallback

#### Returns
- void

`js
import { requestNetworkIdle, clearNetworkIdle } from 'network-idle'

const id = requestNetworkIdle(() => {
console.log('Network is idle!')
}, 500)

clearNetworkIdle(id) // Observer disconnected and timeout cleared
`

`js
import { networkIdleCallback, clearNetworkIdle } from 'network-idle'

const id = networkIdleCallback(() => {
console.log('Network is idle!')
}, 500)

clearNetworkIdle(id) // Observer disconnected and timeout cleared
``