https://github.com/ivan-kleshnin/dataflows
Web app dataflows
https://github.com/ivan-kleshnin/dataflows
angular backbone comparison data-flow frp jquery react reactive reactivity
Last synced: 7 months ago
JSON representation
Web app dataflows
- Host: GitHub
- URL: https://github.com/ivan-kleshnin/dataflows
- Owner: ivan-kleshnin
- Created: 2015-03-16T16:25:51.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2016-03-24T12:38:20.000Z (over 9 years ago)
- Last Synced: 2025-03-28T15:11:18.240Z (7 months ago)
- Topics: angular, backbone, comparison, data-flow, frp, jquery, react, reactive, reactivity
- Language: JavaScript
- Homepage:
- Size: 12.7 KB
- Stars: 39
- Watchers: 4
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Dataflows
> `active => passive`
> `emitter <- reactive`
Time flows from left to right.
Arrows point from dependent to dependency.
Active "thing" requires passive "thing" and invokes it's behavior.
Reactive "thing" requires emitter "thing" and subscribes to it's events.
## Generation One
Manual DOM mutations
#### jQuery
`DOM <- EventHandler => DOM`
#### Backbone / Ampersand
`DOM <- View => Model <- View => DOM`
## Generation Two
Automatic DOM mutations
#### Knockout
`[DOM <-] View (handlers) => ViewModel <- View (bindings) [=> DOM]`
With Model
`[DOM <-] View (handlers) => ViewModel <- Model <- ViewModel <- View (bindings) [=> DOM]`
#### Angular
TODO
## Generation Three
Virtual DOM
#### React
`[DOM <-] Component (handler) => Component (state) <- Component (VDOM) [=> DOM]`
#### Flux / Flummox / ...
`[DOM <-] Component (handler) => Action => Dispatcher <- Store <- Store (agg.) <- Component (VDOM) [=> DOM]`
Also includes **React** scheme.
`agg.` means `aggregate`
#### Reflux
`[DOM <-] Component (handler) => Action <- Store <- Store (agg.) <- Component (VDOM) [=> DOM]`
Also includes **React** scheme.
`agg.` means `aggregate`
#### Baobab
Including **React** scheme...
`[DOM <-] Component (handler) => Action => State <- Facets <- Component (VDOM) [=> DOM]`
#### Cycle
Basic
`[DOM <-] Computer (VDOM) [=> DOM]`
Advanced
`[DOM <-] Intent <- Model <- View (VDOM) [=> DOM]`
## Links
[reactive-polyglot](https://github.com/ivan-kleshnin/reactive-polyglot) – FRP libraries / langs compared