0
29%
BSD-3-Clause
Callbag elements for declaredom

bs-callbag-element

Latest release License

Callbag elements for declaredom

Install

npm i --save @ristostevcev/bs-callbag-element

Usage

Callbag elements provide a way to create dynamically updated elements using callbags. This approach is declarative - it uses callbag streams and morphdom's virtual dom for fast and efficient updating.

The following example creates a clock by mapping a 1-second callbag interval to the current date:

let clock =
  let open CallbagBasics in
  interval 1000
  |> map (fun _ -> span [|text @@ Js.Date.toString (Js.Date.make ())|])
  |> CallbagElement.make

The advantage of this approach for frontend web app development is simplicity and interop since callbag elements are just plain DOM elements. And it gives devs the ability to further optimize by batching updates with requestAnimationFrame to avoid unnecessary repaints.

This element is a web component so make sure to include a webcomponents polyfill.

Example

See example.html

License

See LICENSE