鐵人檔案
本系列文章將拆解 React 核心架構，從最根本的 JavaScript 必備觀念（Closure、Event Loop、Immutability）切入，一路向上推進至 React 的核心運作機制。不只教怎麼用 Hook，更要深入 Hook 的底層邏輯，解析 Fiber 架構與 Re-render 的觸發機制，幫你打破迷思，建立清晰且系統化的前端思維體系！
許多初學者在剛接觸 React 時，常會產生一種錯覺：「React 好難，框架語法好多、邏輯好複雜。」 但如果我們靜下心來將 React 剝開，就會發現：Rea...
我們建立了 UI = f(state) 的心智模型。但許多新手常遇到這個經典問題：「明明修改了 State 裡的物件，畫面為什麼完全沒更新？」答案不在 Reac...
在昨天我們搞懂了 JS 的記憶體模型與不可變性。今天我們要第二個 JS 觀念：閉包 (Closure)。 一、 什麼是閉包 (Closure)？ 簡單來說：「當...
我們已經理解了 React 的「不可變性」與「閉包」。今天我們要來看兩個在 React 中出現率高達 90% 的 ES6 語法：解構賦值 (Destructur...
我們已經學習了如何使用解構與展開運算子優化語法。今天我們要來看 React 開發中最常出現的三個 JavaScript 陣列高階函數：map、filter 與...
我們已經學習了陣列高階函數的轉換技巧。今天我們要進入前端開發中最關鍵的課題之一：非同步 (Asynchronous) 資料處理。 不論是呼叫 API 撈取資料、...
我們已經掌握了 Promise 與 Async/Await 的語法。今天我們要探討 JavaScript 底層執行核心——事件循環 (Event Loop)。...
在前面幾天，我們探討了記憶體、閉包、高階函數、非同步與 Event Loop。今天我們要來拆解 React 開發者每天都在寫、卻最容易被誤解的語法——JSX。...
今天我們要探討 React 最具革命性的核心技術：Virtual DOM（虛擬 DOM） 與 Reconciliation（協調算法）。 一、 真正的效能瓶頸：...
一、 Diffing 演算法的三大策略 React 的 Reconciliation 演算法能將樹比對的複雜度降至 O(n)，全靠以下三大策略： Tree D...
