鐵人檔案
這是一個以 Vue 3 響應式系統為核心的學習與探索紀錄的系列文章。
我嘗試從零開始，重現 Vue 3 的響應式機制，並在過程中分享自己的思考與整理過程。希望能藉由這個系列，讓自己更深入掌握 Vue 3 的底層原理。
昨天我們發現了 Effect 的問題：當 effect 被重複觸發時，它會不斷重新收集依賴，導致依賴鏈表指數級增長。 要讓 effect 記住它「訂閱過誰」，...
昨天我們解決了單一依賴所導致的指數增長問題。然而，在真實的開發場景中，一個 effect 函式往往需要依賴多個響應式變數，現在我們試著新增多個依賴，在範例中加...
昨天，我們知道當 effect 函式依賴多個響應式變數時，會觸發指數級更新。 觀察我們之前的做法： run() 函式首先會將 depsTail 設為 un...
在解決了鏈表節點指數增長的問題後，我們還需要注意依賴的有效性。 effect 的執行路徑可能因為條件判斷或程式邏輯不同而改變，導致這次執行中不再需要某些依賴。...
在實際狀況，effect 函式內部的依賴，常因為條件分支（像是 if...else）而發生變化，這種情況稱為「動態依賴」。 動態依賴會帶來一個問題：在某次執行中...
昨天，我們完成了「依賴清理」機制，讓 effect 能夠正確處理動態變化的依賴關係。然而，這也帶來了一個新的效能問題：當依賴頻繁變化時，系統需要不斷地建立和刪除...
打造響應式系統時，容易遇到的狀況，就是 effect 在執行期間同時「讀取」又「寫入」同一個依賴，這會造成自我觸發（self-trigger）。 effect...
在之前的文章中，我們已經完成了 ref 實作，它能將原始值包裝成響應式物件。現在，我們要接續完成另一部分的響應式系統核心：reactive 函式。我們的目標是...
上一次我們提到： 每個物件的每個屬性都需要自己的 Dep。 如何建立 target.a → Dep 的對應關係？ 如何在不污染原始物件的情況下儲存這個關係？...
我們完成 reactive 的基本實踐後，接下來有幾個有可能會發生的情況： 原始物件傳入 Reactive 物件 Reactive 物件傳入 Reactiv...
