import { ErrorCodes, callWithErrorHandling } from './errorHandling' import { isArray } from '@vue/shared' export interface SchedulerJob { (): void /** * unique job id, only present on raw effects, e.g. component render effect */ id?: number /** * Indicates this is a watch() callback and is allowed to trigger itself. * A watch callback doesn't track its dependencies so if it triggers itself * again, it's likely intentional and it is the user's responsibility to * perform recursive state mutation that eventually stabilizes. */ cb?: boolean } let isFlushing = false let isFlushPending = false const queue: (SchedulerJob | null)[] = [] let flushIndex = 0 const pendingPreFlushCbs: Function[] = [] let activePreFlushCbs: Function[] | null = null let preFlushIndex = 0 const pendingPostFlushCbs: Function[] = [] let activePostFlushCbs: Function[] | null = null let postFlushIndex = 0 const resolvedPromise: Promise = Promise.resolve() let currentFlushPromise: Promise | null = null let currentPreFlushParentJob: SchedulerJob | null = null const RECURSION_LIMIT = 100 type CountMap = Map export function nextTick(fn?: () => void): Promise { const p = currentFlushPromise || resolvedPromise return fn ? p.then(fn) : p } export function queueJob(job: SchedulerJob) { // the dedupe search uses the startIndex argument of Array.includes() // by default the search index includes the current job that is being run // so it cannot recursively trigger itself again. // if the job is a watch() callback, the search will start with a +1 index to // allow it recursively trigger itself - it is the user's responsibility to // ensure it doesn't end up in an infinite loop. if ( (!queue.length || !queue.includes( job, isFlushing && job.cb ? flushIndex + 1 : flushIndex )) && job !== currentPreFlushParentJob ) { queue.push(job) queueFlush() } } function queueFlush() { if (!isFlushing && !isFlushPending) { isFlushPending = true currentFlushPromise = resolvedPromise.then(flushJobs) } } export function invalidateJob(job: SchedulerJob) { const i = queue.indexOf(job) if (i > -1) { queue[i] = null } } function queueCb( cb: Function | Function[], activeQueue: Function[] | null, pendingQueue: Function[], index: number ) { if (!isArray(cb)) { if ( !activeQueue || !activeQueue.includes(cb, (cb as SchedulerJob).cb ? index + 1 : index) ) { pendingQueue.push(cb) } } else { // if cb is an array, it is a component lifecycle hook which can only be // triggered by a job, which is already deduped in the main queue, so // we can skip dupicate check here to improve perf pendingQueue.push(...cb) } queueFlush() } export function queuePreFlushCb(cb: Function) { queueCb(cb, activePreFlushCbs, pendingPreFlushCbs, preFlushIndex) } export function queuePostFlushCb(cb: Function | Function[]) { queueCb(cb, activePostFlushCbs, pendingPostFlushCbs, postFlushIndex) } export function flushPreFlushCbs( seen?: CountMap, parentJob: SchedulerJob | null = null ) { if (pendingPreFlushCbs.length) { currentPreFlushParentJob = parentJob activePreFlushCbs = [...new Set(pendingPreFlushCbs)] pendingPreFlushCbs.length = 0 if (__DEV__) { seen = seen || new Map() } for ( preFlushIndex = 0; preFlushIndex < activePreFlushCbs.length; preFlushIndex++ ) { if (__DEV__) { checkRecursiveUpdates(seen!, activePreFlushCbs[preFlushIndex]) } activePreFlushCbs[preFlushIndex]() } activePreFlushCbs = null preFlushIndex = 0 currentPreFlushParentJob = null // recursively flush until it drains flushPreFlushCbs(seen, parentJob) } } export function flushPostFlushCbs(seen?: CountMap) { if (pendingPostFlushCbs.length) { activePostFlushCbs = [...new Set(pendingPostFlushCbs)] pendingPostFlushCbs.length = 0 if (__DEV__) { seen = seen || new Map() } for ( postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++ ) { if (__DEV__) { checkRecursiveUpdates(seen!, activePostFlushCbs[postFlushIndex]) } activePostFlushCbs[postFlushIndex]() } activePostFlushCbs = null postFlushIndex = 0 } } const getId = (job: SchedulerJob) => (job.id == null ? Infinity : job.id) function flushJobs(seen?: CountMap) { isFlushPending = false isFlushing = true if (__DEV__) { seen = seen || new Map() } flushPreFlushCbs(seen) // Sort queue before flush. // This ensures that: // 1. Components are updated from parent to child. (because parent is always // created before the child so its render effect will have smaller // priority number) // 2. If a component is unmounted during a parent component's update, // its update can be skipped. // Jobs can never be null before flush starts, since they are only invalidated // during execution of another flushed job. queue.sort((a, b) => getId(a!) - getId(b!)) try { for (flushIndex = 0; flushIndex < queue.length; flushIndex++) { const job = queue[flushIndex] if (job) { if (__DEV__) { checkRecursiveUpdates(seen!, job) } callWithErrorHandling(job, null, ErrorCodes.SCHEDULER) } } } finally { flushIndex = 0 queue.length = 0 flushPostFlushCbs(seen) isFlushing = false currentFlushPromise = null // some postFlushCb queued jobs! // keep flushing until it drains. if (queue.length || pendingPostFlushCbs.length) { flushJobs(seen) } } } function checkRecursiveUpdates(seen: CountMap, fn: SchedulerJob | Function) { if (!seen.has(fn)) { seen.set(fn, 1) } else { const count = seen.get(fn)! if (count > RECURSION_LIMIT) { throw new Error( `Maximum recursive updates exceeded. ` + `This means you have a reactive effect that is mutating its own ` + `dependencies and thus recursively triggering itself. Possible sources ` + `include component template, render function, updated hook or ` + `watcher source function.` ) } else { seen.set(fn, count + 1) } } }