Skip to content

nihil-pro/kr-observable

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Adds reactivity power for your JavaScript 😎

npm coverage size-esm size-cjs

  1. Easy to use and provides a great developer experience;
  2. Supports classes and plain objects;
  3. Supports subclassing;
  4. Works in all runtimes (Node.js, Web, e.t.c);
  5. Well typed;
  6. Framework-agnostic.
  7. Bindings for React, Preact and Vue

Docs – observable.ru

Example with React

import { makeObservable } from 'kr-observable'
import { observer } from 'kr-observable/react'

const state = makeObservable({ count: 0 })

function App() {
  return (
    <div>
      <button onClick={() => --state.count}>-</button>
      <div>{state.count}</div>
      <button onClick={() => ++state.count}>+</button>
    </div>
  )
}
export default observer(App)

More example and full docs on observable.ru

Performance and memory usage benchmark

js-framework-benchmark

Reactivity benchmark

mol.hyoo.ru

About

Adds reactivity to your JavaScript

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •