Recoil:面向React的新的狀態管理庫

Recoil是Facebook推出的一個全新的、實驗性的JavaScript狀態管理庫,它解決了使用現有Context API在構建較大應用時所面臨的很多問題。

因爲React主要是一個UI庫,開發人員通常會在使用React的同時使用一個狀態管理方案以簡化數據的處理。

很多現有的狀態管理方案都是基於React在2014年引入的Flux架構的。然而,儘管像Redux和MobX這樣的庫能夠確保應用的狀態保持一致,但是對於很多應用來講,它們所帶來的開銷是難以估量的。

爲了解決這個問題,React引入了一個簡單的替代方案Context API,它允許開發人員通過組件樹共享數據,而不必在每個級別手動傳遞屬性。

Recoil爲開發人員提供了另外一個解決方案,這些開發人員可能想要避免使用那些已經成熟的狀態管理系統,但是又覺得Context API太具侷限性。

如官方文檔所述,Recoil通過解決Context API的三個問題實現了這一點。

  1. 組件狀態只能通過往上推送至公共祖先來進行共享,這可能包含一個巨大的樹,隨後這個樹需要重新渲染。
  2. Context只能存儲一個值,而不能存儲一組不確定的值,讓每個值都有自己的消費者。
  3. 以上兩點使得將樹的頂部(狀態必須要存在的地方)與樹的葉子(狀態被使用的地方)進行代碼分離變得非常困難。

Recoil使用Atom和Selector來管理應用的數據。每個Atom包含一個唯一的鍵和一段它將要管理的數據,而每個Selector代表一個衍生狀態,該衍生狀態可以是基於多個Atom的。

關於如何組合這兩者,有一個非常棒的樣例,那就是流行的todo應用,它包含了兩個Atom和一個Selector。

爲了管理應用的數據,我們創建了兩個Atom。第一個包括原始的列表項,而第二個包含了過濾器(“已完成”、“未完成”和“全部”等)。

爲了展現這個todo列表,我們使用Selector基於選中的過濾器來過濾todo項。

關於完整的todo教程和良好的入門指南,請訪問官方文檔

Recoil基於MIT許可證發佈,可以通過GitHub獲取。

請注意,Recoil只是一個實驗性的解決方案,還不能在生產環境的應用中使用。

原文鏈接:
Recoil - a New State Management Library for React

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章