State Management & Unidirectional Data Flow
1 like927 views
The document discusses state management and unidirectional data flow in applications. It describes some issues with the traditional MVC pattern for state management. The main concepts of unidirectional data flow are then introduced, including the store, actions, and reducers. An example is provided of how application state can be updated in response to actions via a reducer function. Resources for further learning about unidirectional data flow approaches like Flux and Redux are also listed.
![Application State? 🤔
@nikolasburkState Management & Unidirectional Data Flow
conferences = [
Conference(
name: "AppDevcon",
city: "Amsterdam",
year: "2017",
attending: true
),
Conference(
name: "UIKonf",
city: "Berlin",
year: "2017",
attending: false
),
Conference(
name: "WWDC",
city: "San Jose",
year: "2017",
attending: true
)
]](https://image.slidesharecdn.com/slides16-9-170804132617/85/State-Management-Unidirectional-Data-Flow-13-320.jpg)
![Application State? 🤔
@nikolasburkState Management & Unidirectional Data Flow
conferences = [
Conference(
name: "AppDevcon",
city: "Amsterdam",
year: "2017",
attending: true
),
Conference(
name: "UIKonf",
city: "Berlin",
year: "2017",
attending: false
),
Conference(
name: "WWDC",
city: "San Jose",
year: "2017",
attending: true
)
]
selectedIndex = 0](https://image.slidesharecdn.com/slides16-9-170804132617/85/State-Management-Unidirectional-Data-Flow-14-320.jpg)
![Application State? 🤔
@nikolasburkState Management & Unidirectional Data Flow
conferences = [
Conference(
name: "AppDevcon",
city: "Amsterdam",
year: "2017",
attending: true
),
Conference(
name: "UIKonf",
city: "Berlin",
year: "2017",
attending: false
),
Conference(
name: "WWDC",
city: "San Jose",
year: "2017",
attending: true
)
]
selectedIndex = nil](https://image.slidesharecdn.com/slides16-9-170804132617/85/State-Management-Unidirectional-Data-Flow-15-320.jpg)
State Management & Unidirectional Data Flow
- 1. @nikolasburkState Management & Unidirectional Data Flow State Management & Unidirectional Data Flow “Where is truth in your application?” Andy Matuschak, WWDC 2014
- 2. Nikolas Burk @nikolasburk • Developer at Graphcool • Experienced with iOS • Passionate about programming paradigms and architecture
- 3. 1. State Management 2. Unidirectional Data Flow & ReSwift @nikolasburkState Management & Unidirectional Data Flow Goals 🎯
- 4. State Management …and why it matters to you
- 5. @nikolasburkState Management & Unidirectional Data Flow
- 6. @nikolasburkState Management & Unidirectional Data Flow An Application is more than the Happy Path “In the context of software or information modeling, a happy path is a default scenario featuring no exceptional or error conditions.” Wikipedia 😏
- 7. @nikolasburkState Management & Unidirectional Data Flow Decision process for Slack Notifications
- 8. The application state represents the information that is kept in memory of a running application and is the basis for the generation of a user interface. Application State? 🤔 @nikolasburkState Management & Unidirectional Data Flow
- 9. The application state represents the information that is kept in memory of a running application and is the basis for the generation of a user interface. Application State? 🤔 @nikolasburkState Management & Unidirectional Data Flow
- 10. The application state represents the information that is kept in memory of a running application and is the basis for the generation of a user interface. Application State? 🤔 @nikolasburkState Management & Unidirectional Data Flow
- 11. @nikolasburkState Management & Unidirectional Data Flow The main responsibility of an app is to transform an application state into a user interface. (AppState) -> UI
- 12. Example: Conference Planner App 🗓 @nikolasburkState Management & Unidirectional Data Flow struct Conference { let name: String let city: String let year: String var attending: Bool }
- 13. Application State? 🤔 @nikolasburkState Management & Unidirectional Data Flow conferences = [ Conference( name: "AppDevcon", city: "Amsterdam", year: "2017", attending: true ), Conference( name: "UIKonf", city: "Berlin", year: "2017", attending: false ), Conference( name: "WWDC", city: "San Jose", year: "2017", attending: true ) ]
- 14. Application State? 🤔 @nikolasburkState Management & Unidirectional Data Flow conferences = [ Conference( name: "AppDevcon", city: "Amsterdam", year: "2017", attending: true ), Conference( name: "UIKonf", city: "Berlin", year: "2017", attending: false ), Conference( name: "WWDC", city: "San Jose", year: "2017", attending: true ) ] selectedIndex = 0
- 15. Application State? 🤔 @nikolasburkState Management & Unidirectional Data Flow conferences = [ Conference( name: "AppDevcon", city: "Amsterdam", year: "2017", attending: true ), Conference( name: "UIKonf", city: "Berlin", year: "2017", attending: false ), Conference( name: "WWDC", city: "San Jose", year: "2017", attending: true ) ] selectedIndex = nil
- 16. @nikolasburkState Management & Unidirectional Data Flow 1. Where should the state live? 2. Who is allowed to change the state? 3. How does the state get changed? 3 Golden Questions of State Management 👑 An architectural pattern should be able to answer these questions!
- 17. @nikolasburkState Management & Unidirectional Data Flow Model View Controller
- 18. @nikolasburkState Management & Unidirectional Data Flow Where should state live? 1 👑
- 19. @nikolasburkState Management & Unidirectional Data Flow Who is allowed to change the state? 2 👑
- 20. @nikolasburkState Management & Unidirectional Data Flow How does the state get changed? KVO & Property Observers Delegates Callbacks NSNotificationCenter Target-Action 3 👑
- 21. @nikolasburkState Management & Unidirectional Data Flow UIViewController What’s wrong with MVC? Persistence Networking Navigation Domain Logic User Interface Concurrency
- 22. @nikolasburkState Management & Unidirectional Data Flow State Management is hard and MVC is not a solution, thanks Apple 😑
- 23. Unidirectional Data Flow … and controlling your application state with ReSwift
- 24. @nikolasburkState Management & Unidirectional Data Flow • 3 Principles • Single source of truth • State is read-only • Changes with pure functions http://redux.js.org/docs/introduction/ThreePrinciples.html
- 25. @nikolasburkState Management & Unidirectional Data Flow Main Concepts Store: … manages the application state … informs subscribers about changes Actions: … describe an intent to change the state Reducer: … pure functions that generate a new application state based on actions
- 26. Example Flow @nikolasburkState Management & Unidirectional Data Flow
- 27. Application State (Old) AppDevcon UIKonf WWDC Reducer add Swift Summit to list and return new application state Action “Swift Summit” “San Francisco” “2017” Application State (New) AppDevcon UIKonf WWDC Swift Summit
- 28. @nikolasburkState Management & Unidirectional Data Flow Helpful Resources 📚 • Unidirectional Data Flow in Swift: An Alternative to Massive View Controllers (Video) (https://realm.io/news/benji-encz- unidirectional-data-flow-swift/) • Real World Flux Architecture on iOS (http://blog.benjamin- encz.de/post/real-world-flux-ios/) • Redux Documentation (http://redux.js.org/) • Advanced iOS Application Architecture and Patterns, Andy Matuschak WWDC 2014 (Video) (http://asciiwwdc.com/2014/ sessions/229)