From d0431c7f81e20dfb77a6fe154292d6b06f433984 Mon Sep 17 00:00:00 2001
From: Joris
Date: Tue, 7 Feb 2023 18:38:44 +0100
Subject: Init version

---
 README.md | 85 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 85 insertions(+)
 create mode 100644 README.md

(limited to 'README.md')

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..f878b62
--- /dev/null
+++ b/README.md
@@ -0,0 +1,85 @@
+# Rx
+
+3.4kb unzipped DOM binding library which:
+
+- composes updatable values, `Rx`, with `map` and `flatMap`,
+- re-render DOM portions under `Rx` values.
+
+Limitations:
+
+- whenever a DOM portion relies on a `Rx`, and the `Rx` value is updated, the
+  complete portions is removed and re-created, no matter if the DOM portion is
+  almost equal to the portion it replaced,
+- no serious performance tests, I only noticed that it was faster than
+  `monadic-html` to create and update lots of rows, and slower than
+  Vanilla JS.
+
+## Usage
+
+### Hello world
+
+```typescript
+import { h, mount } from 'rx'
+
+mount(h('div', 'Hello World!'))
+```
+
+### Attributes
+
+```typescript
+import { h, mount } from 'rx'
+
+mount(h('button', 
+  { className: 'g-Button',
+    color: 'green',
+    onclick: () => console.log('Clicked!')
+  },
+  'Click!'))
+```
+
+### State
+
+Counter with `-` and `+` buttons:
+
+```typescript
+import { h, withVar, mount } from 'rx'
+
+mount(
+  withVar(0, (value, update) => [
+    value,
+    h('button', { onclick: () => update(n => n - 1) }, '-'),
+    h('button', { onclick: () => update(n => n + 1) }, '+')]))
+```
+
+### Subscriptions
+
+Chronometer updating every second:
+
+```typescript
+import { h, withVar, mount } from 'rx'
+
+mount(
+  withVar(0, (value, update) => {
+    const interval = window.setInterval(() => update(n => n + 1), 1000)
+    return h('div',
+      { onunmount: () => clearInterval(interval) }, 
+      value
+    )
+  }))
+```
+
+`onunmount` is a special attribute to keep track of the component lifecycle.
+`onmount` is available as well. Those functions can take the `element` as an
+argument.
+
+## Ideas
+
+- API: 
+  - Rx debounce, filter,
+  - Routeur with sub-page support.
+- Optimization: store intermediate rx instead of recomputing each time for multiple subscribers?
+
+## Inspiration
+
+- https://github.com/OlivierBlanvillain/monadic-html
+- https://www.solidjs.com
-- 
cgit v1.2.3