miso

<p align="center">

<a href="https://haskell-miso.org">

<img width="15%" height="512" alt="Image" src="https://github.com/user-attachments/assets/384a1898-0aed-4662-9a03-8dbe5641228f" />
   </a>
<p align="center">:ramen: <a href="https://haskell-miso.org"><b>miso</b></a> | A library for building web and <a href="https://github.com/haskell-miso/miso-lynx">mobile</a> applications</p>
</p>

<p align="center"> 
  <a href="https://discord.gg/QVDtfYNSxq">
    <img src="https://img.shields.io/badge/discord-miso-5865F2.svg?style=for-the-badge&logo=discord&logoColor=white" alt="Discord">   
  </a>
  <a href="https://www.npmjs.com/package/haskell-miso">  
    <img src="https://img.shields.io/npm/v/haskell-miso?style=for-the-badge" />
  </a>  
  <a href="https://haskell-miso-cachix.cachix.org">
    <img src="https://img.shields.io/badge/build-cachix-yellow.svg?style=for-the-badge" alt="Cachix">
  </a>
  <a href="https://actions-badge.atrox.dev/dmjio/miso/goto?ref=master">
    <img alt="Build Status" src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2Fdmjio%2Fmiso%2Fbadge%3Fref%3Dmaster&style=for-the-badge" />
  </a>
  <a href="http://hackage.haskell.org/package/miso">
    <img src="https://img.shields.io/hackage/v/miso.svg?style=for-the-badge" alt="Hackage">
  </a>
</p>

<p align="center"> 
Inspired by <a href="http://elm-lang.org/">Elm</a> and <a href="http://react.dev/">React</a>. See the <a href="https://github.com/haskell-miso">GitHub</a> org. <a href="https://try.haskell-miso.org">Try it</a>. Read the <a href="https://haddocks.haskell-miso.org/miso/Miso.html">docs</a>.
</p>

## Key features

- [Virtual DOM](https://en.wikipedia.org/wiki/Virtual_DOM) with recursive diffing and patching algorithm
- Attribute and property normalization, event delegation, and event batching
- Model-View-Update paradigm
- Pure by default 
- SVG, 2D Canvas, and WebGL (via [three.js](https://threejs.org))
- [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API), [Server-Sent Events](https://github.com/haskell-miso/miso-sse), and [WebSocket](https://github.com/haskell-miso/miso-websocket) support
- Type-safe client-side routing
- An extensible subscription system for long-running effects and third-party library integration
- Lifecycle hooks (`onCreated`, `onDestroyed`, `mount`, `unmount`)
- [Component](https://react.dev/reference/react/Component), [Context](https://react.dev/learn/passing-data-deeply-with-context), [Fragment](https://react.dev/reference/react/Fragment) and [Props](https://react.dev/learn/passing-props-to-a-component) features.

It makes heavy use of the [GHC JavaScript FFI](https://ghc.gitlab.haskell.org/ghc/doc/users_guide/wasm.html#javascript-ffi-in-the-wasm-backend) and maintains minimal dependencies. It can be considered a shallow [embedded domain-specific language](https://wiki.haskell.org/Embedded_domain_specific_language) for modern web programming. Compilation targets include [JavaScript](https://ghc.gitl