inspired by https://github.com/yosbelms/idley

on-idle-helpers.js

import { PromisePipeFactory } from './p-pipe'
import { isFunction, isArray } from 'lodash'
const w = window

/**
 * @type Function
 * @param {Function}
 * @returns {void}
 */
const subscribe = (() => {
  if (isFunction(w.requestIdleCallback)) {
    return w.requestIdleCallback.bind(w)
  }

  if (isFunction(w.requestAnimationFrame)) {
    return w.requestAnimationFrame.bind(w)
  }

  return function _setTimeout (fn) {
    return setTimeout(fn, 1)
  }
})()

/**
 * @param {Function} fn
 * @returns {Promise<any>}
 */
const onIdle = fn => {
  return new Promise(resolve => {
    subscribe(() => {
      resolve(fn())
    })
  })
}

class IdlePromise extends Promise {
  then (fn) {
    return super.then((...args) => {
      return onIdle(() => {
        return fn(...args)
      })
    })
  }
}

const pipeP = PromisePipeFactory(IdlePromise)
/**
 * @param  {Array<Function>} fns
 * @returns {Promise<Array<any>>}
 */
const serialOnIdle = async (...fns) => {
  if (isArray(fns[0])) {
    return serialOnIdle(...fns[0])
  }

  return pipeP(...fns)()
}

export { onIdle, subscribe, serialOnIdle, IdlePromise, pipeP }

on-idle-p-pipe.js

// https://github.com/JasonPollman/p-compose

const promiseReducer = (current, next) => current.then(next)
const hasNonFunction = fnArray => fnArray.some(fn => typeof fn !== 'function')

const PromisePipeFactory = Promise => (...fns) => {
  if (fns.length === 0) return () => Promise.resolve()
  if (hasNonFunction(fns)) throw new TypeError('Expected a function')

  const head = fns[0]
  const rest = fns.slice(1)

  return (...args) => rest.reduce(promiseReducer, Promise.resolve().then(() => head(...args)))
}

export { PromisePipeFactory }
export default PromisePipeFactory(Promise)

on-idle-vue-plugin.js

import { serialOnIdle } from './utils'

const install = Vue => {
  Object.defineProperty(Vue.prototype, '$onIdle', {
    value: serialOnIdle
  })
}

export { install }
export default { install }