Tag

nextTick

1 views collected around this technical thread.

Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jan 12, 2025 · Frontend Development

Understanding and Implementing Vue's nextTick Mechanism

This article explains the inner workings of Vue's nextTick function, detailing its callback queue, flushing logic, timer selection across environments, Promise‑based return, and provides a step‑by‑step JavaScript implementation with test cases and the full Vue source code.

AsyncJavaScriptMicrotasks
0 likes · 10 min read
Understanding and Implementing Vue's nextTick Mechanism
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jan 9, 2025 · Frontend Development

Understanding Vue.js nextTick: Mechanism, Usage, and Custom Implementation

This article explains the Vue.js nextTick API, why scrolling to newly added list items may stop prematurely, demonstrates proper usage with scrollIntoView, and provides a hand‑written implementation using MutationObserver to ensure DOM updates complete before executing callbacks.

DOMJavaScriptMutationObserver
0 likes · 6 min read
Understanding Vue.js nextTick: Mechanism, Usage, and Custom Implementation
Tencent Cloud Developer
Tencent Cloud Developer
May 31, 2021 · Frontend Development

Understanding Vue.nextTick and the JavaScript Event Loop

Vue.nextTick schedules callbacks using a graceful‑degradation chain (Promise, MutationObserver, setImmediate, setTimeout) that leverages the JavaScript event‑loop’s micro‑task queue, ensuring DOM mutations are applied instantly but rendered after microtasks and before macrotasks, while the browser’s multi‑threaded architecture coordinates rendering, timers, and network work.

Event LoopJavaScriptMicrotasks
0 likes · 12 min read
Understanding Vue.nextTick and the JavaScript Event Loop