鐵人檔案
這是一個以 Vue 3 響應式系統為核心的學習與探索紀錄的系列文章。
我嘗試從零開始，重現 Vue 3 的響應式機制，並在過程中分享自己的思考與整理過程。希望能藉由這個系列，讓自己更深入掌握 Vue 3 的底層原理。
今天我們要在保持既有鏈表架構不變的前提下，來實作 computed 的惰性計算 + 快取（dirty 旗標）與調度邏輯。 範例演示 <!DOCTYPE...
在上一篇文章中，我們提到將透過「緩存」的機制來解決 computed 在訪問時重複執行的問題。 在 Vue 3 的原始碼裡，computed 是靠一個「髒值標...
watch 是 Vue 非常重要的一個 API，它允許開發者在響應式資料發生變化時，執行特定的副作用（side effects）。這些副作用可以是異步行為，像...
Watch Options 我們常用的選項： immediate：初始化馬上執行一次 deep：深層監聽 once：只執行一次，就停止監聽 我們先寫...
watch 的一個核心用途是在響應式資料發生改變時，執行 Side Effect。 然而，當 Side Effect 是非同步或需要手動清理時，就會出現一個常見...
在我們建構響應式系統的過程中，雖然對於原生 JavaScript 物件的處理已經算蠻完善，但陣列 (Array) 與普通物件的屬性不同，陣列的 length...
響應式系統之中reactive 能夠將一個物件轉換為深層的響應式物件，但是在開發過程中我們時常會需要用到解構賦值，這時候會導致響應性遺失。 問題解析 <...
ref 與 reactive 都屬於深層響應的 API 。它們會遞迴地將內部所有巢狀物件都轉換為響應式代理 。多數情況下非常方便，但當處理大型資料結構時，這種...
在開始 readonly 之前，我們先講一下 Proxy 的補充知識： Proxy Proxy 是實現 reactive、readonly 等功能的核心。它會...
我們回顧一下這三十天所學習到的： 目錄 環境 Day 2 - 基礎建設： Monorepo 與 pnpm Workspace 環境搭建 響應式基礎 Day 3...
