架構概觀
核心組成
| 元件 | 角色 |
|---|---|
CompositionWidget | 對外公開的 widget (Stateless)，開發者在 setup() 中宣告狀態並回傳 builder。 |
_CompositionElement | 自定義 Element (StatelessElement)，取代 State 物件，負責呼叫 setup()、管理 reactive builder 與生命週期。 |
SetupContextImpl | 儲存 ref、computed、生命週期掛勾與 provide/inject 內容的內部容器。 |
alien_signals | 支援細粒度 reactivity 的訊號系統。 |
生命週期流程
mount：建立SetupContext，執行setup()，取得 builder。didChangeDependencies：觸發依賴更新通知。build：初始化或執行 effect，回傳快取的 widget，當依賴變化時直接標記 dirty。unmount：呼叫onUnmounted、釋放 effect 與控制器。
為何需要這一層 Runtime？
- 組合式 API：讓 Flutter 開發者擁有類似 Vue Composition API 的開發體驗。
- 細粒度更新：只有讀取變動 ref 的 builder 才會重新執行。
- 自動清理：
useScrollController、useAnimationController等 helper 會自動釋放資源。
整合重點
- 生命週期掛勾（
onMounted、onUnmounted、onBuild）對應到 Flutter 的生命週期方法。 - 依賴注入 (
provide/inject) 透過_SetupContext的 parent chain 進行傳遞。 - Composable 會透過 runtime 建立 refs 並註冊清理邏輯，確保資源釋放。