A PureScript web micro-framework for apps that need to be fast.
- Verity Scheel's post on parsing implements a full-featured tweening engine to animate rule-based parsing steps.
- joyride.fm is a social rhythm game.
- Horizontal and Vertical Events is an article that explores some concepts central to Deku with many tryable & editable examples.
Here is a guide to building apps with Deku. The guide is written in Deku and its source code can be found here.
If you want to see a full-featured, highly-optimized Deku site with lots of event handlers, race conditions, asynchronous logic, etc, check out the wags documentation.
Deku aims to be:
- fast: it's up to 2x faster than Halogen for a simple Todo MVC app.
- small: the average Deku program tends to be less lines of code than its React or Halogen counterparts.
- ssr-friendly: Deku has out-of-the-box server-side rendering capabilities.
Deku started as an experiment taking purescript-wags
and replacing all the Web Audio stuff with DOM stuff. It turns out that the DOM and Web Audio are more alike than different, so the first draft took only a few hours. It uses the same file structure, naming conventions and core concepts as wags, making it ideal for performance-critical apps.
Here are some recent benchmarks from the test suite comparing Deku to Halogen and Halogen Hooks. The test suite is the same one that is used in halogen-hooks
.
Many effectful computations followed by a DOM modification.
{
"hookAverage": {
"totalTime": "171ms",
"scriptTime": "121ms",
"peakHeap": "2570kb",
"averageHeap": "1062kb",
"averageFPS": 15
},
"dekuAverage": {
"totalTime": "73ms",
"scriptTime": "18ms",
"peakHeap": "842kb",
"averageHeap": "378kb",
"averageFPS": 215
},
"componentAverage": {
"totalTime": "106ms",
"scriptTime": "56ms",
"peakHeap": "1288kb",
"averageHeap": "613kb",
"averageFPS": 35
}
}
A vanilla MVC Todo app.
{
"hookAverage": {
"totalTime": "567ms",
"scriptTime": "397ms",
"peakHeap": "13292kb",
"averageHeap": "6242kb",
"averageFPS": 18
},
"dekuAverage": {
"totalTime": "230ms",
"scriptTime": "67ms",
"peakHeap": "1768kb",
"averageHeap": "1136kb",
"averageFPS": 36
},
"componentAverage": {
"totalTime": "401ms",
"scriptTime": "206ms",
"peakHeap": "6835kb",
"averageHeap": "3844kb",
"averageFPS": 26
}
}
Here are some examples to get you started.
To see how to bundle this library on your site, please visit the examples directory.
To compile the JS for the hello world example, issue the following command:
npx spago -x examples.dhall bundle-app \
--main Deku.Example.HelloWorld \
--to examples/hello-world/index.js
Other examples will work the same way, with the directory and module name changing. Then, to access the example, you can run a http server from the directory and navigate to the url, ie cd examples/hello-world && python -m http.server
and then navigate to localhost:8000.
Deku is short for "DOMs Emitted as Kan-extended Universals." It is also the tree of Zelda lore and is a Japanese diminutive for a dullard or simpleton.