deku-raf
TypeScript icon, indicating that this package has built-in type declarations

1.0.1 • Public • Published

deku-raf

Build Status

Force deku(v2) to use requestAnimationFrame (raf).

This ensures calling render function once per frame.

Install

npm install --save deku-raf

Usage

Simple

/** @jsx element */
import { element } from 'deku'
 
import createApp from 'deku-raf'
 
const Component = ({ props }) => <div class={ props.class }></div>
 
const app = createApp(document.getElementById('view'))
 
const render = () => {
    app(<Component/>)
}
 
render()

Redux + deku + deku-raf

/** @jsx element */
import { element } from 'deku'
 
import createApp from 'deku-raf'
 
import store from './store'
 
import View from './view'
 
const app = createApp(document.getElementById('view'), store.dispatch)
 
const render = () => {
    app(<View state={ store.getState() }/>)
}
 
store.subscribe(render)
 
render()

Also, you can use it in TypeScript (make sure npm install --save @types/deku)

import { element } from 'deku'
 
import createApp from 'deku-raf'
 
import store from './store'
 
import view from './view'
 
const app: (el: deku.VirtualElement, context?: any) => void = createApp(document.getElementById('view'), store.dispatch)
 
function render(): void {
    app(element(view, store.getState()))
}
 
store.subscribe(render)
 
render()

Package Sidebar

Install

npm i deku-raf

Weekly Downloads

10

Version

1.0.1

License

MIT

Last publish

Collaborators

  • pockawoooh