WebSharper.UI.Next
UI.Next is a client-side library providing a novel, pragmatic and convenient approach to UI reactivity. It includes:
- A dataflow layer for expressing user inputs and values computed from them as time-varying values. This approach is related to Functional Reactive Programming (FRP), but differs from it in significant ways discussed here.
- A reactive DOM library for displaying these time-varying values in a functional way. If you are familiar with Facebook React, then you will find some similarities with this approach: instead of explicitly inserting, modifying and removing DOM nodes, you return a value that represents a DOM tree based on inputs. The main difference is that these inputs are nodes of the dataflow layer, rather than a single state value associated with the component.
- A declarative animation system for the DOM layer.
The tutorial goes over the basics of reactive variables and the DOM library.
For a more in-depth look, check the reference.
You can also check some examples here.
Availability
UI.Next is available for download on NuGet:
Documentation
These articles cover various design choices and aspects of the system:
- Dataflow - explains the dataflow system
- Leaks - explains how most memory leaks are avoided
- Sharing - helps understanding sharing and identity
- Monoids - explains use of monoids in the API
- EventStreams - provides a rationale for omitting event stream combinators
- FRP - discusses connections to Functional Reactive Programming
- Components - gives simple component design guidelines
- CML - discusses integrating Concurrent ML as a future direction
- DOM on the server side - using the HTML combinators and templates on the server side
Talks
- Video: Tackle UI with Reactive DOM in F# and WebSharper - in this Community for FSharp event, Anton Tayanovskyy presents the basics of the library and the motivations for the dataflow design