Mithril.js – A modern client-side Javascript framework

📰 Hacker News · dammitfoo

Learn Mithril.js, a modern client-side JavaScript framework for building Single Page Applications, and get started with its key concepts and features.

beginner Published 17 Aug 2018
Action Steps
  1. Include Mithril.js from a CDN in an HTML file to get started.
  2. Follow the official tutorial to cover the majority of the API surface, including routing and XHR.
  3. Explore key concepts such as Vnodes, Components, Lifecycle methods, and Keys.
  4. Check out the framework comparison page to see how Mithril.js stacks up against other frameworks.
  5. Try building a simple application using Mithril.js to get hands-on experience.
Who Needs to Know This

Frontend developers and engineers can benefit from learning Mithril.js to build fast and efficient Single Page Applications. It's also useful for developers who want to explore alternative frameworks to React, Angular, or Vue.

Key Insight

💡 Mithril.js is a lightweight and fast framework that provides routing and XHR utilities out of the box, making it a great alternative to other popular frameworks.

Share This
🚀 Learn Mithril.js, a fast and efficient JavaScript framework for building Single Page Applications! #MithrilJS #JavaScript #FrontendDevelopment

Full Article

Title: Introduction - Mithril.js

URL Source: https://mithril.js.org/

Markdown Content:
[≡](javascript:;)
# ![Image 1](https://mithril.js.org/logo.svg)Mithril v2.3.6

[Guide](https://mithril.js.org/index.html)[API](https://mithril.js.org/api.html)[Chat](https://mithril.zulipchat.com/)[GitHub](https://github.com/MithrilJS/mithril.js)

# Introduction

* Getting Started
* **[Introduction](https://mithril.js.org/index.html)**
* [What is Mithril.js?](https://mithril.js.org/#what-is-mithriljs?)
* [Getting started](https://mithril.js.org/#getting-started)
* [Hello world](https://mithril.js.org/#hello-world)
* [DOM elements](https://mithril.js.org/#dom-elements)
* [Components](https://mithril.js.org/#components)
* [Routing](https://mithril.js.org/#routing)
* [XHR](https://mithril.js.org/#xhr)

* [Installation](https://mithril.js.org/installation.html)
* [Tutorial](https://mithril.js.org/simple-application.html)
* [Learning Resources](https://mithril.js.org/learning-mithril.html)
* [Getting Help](https://mithril.js.org/support.html)

* Resources
* [JSX](https://mithril.js.org/jsx.html)
* [ES6+ on legacy browsers](https://mithril.js.org/es6.html)
* [Animation](https://mithril.js.org/animation.html)
* [Testing](https://mithril.js.org/testing.html)
* [Examples](https://mithril.js.org/examples.html)
* [3rd Party Integration](https://mithril.js.org/integrating-libs.html)
* [Path Handling](https://mithril.js.org/paths.html)

* Key concepts
* [Vnodes](https://mithril.js.org/vnodes.html)
* [Components](https://mithril.js.org/components.html)
* [Lifecycle methods](https://mithril.js.org/lifecycle-methods.html)
* [Keys](https://mithril.js.org/keys.html)
* [Autoredraw system](https://mithril.js.org/autoredraw.html)

* Social
* [Mithril.js Jobs](https://github.com/MithrilJS/mithril.js/wiki/JOBS)
* [How to contribute](https://mithril.js.org/contributing.html)
* [Credits](https://mithril.js.org/credits.html)
* [Code of Conduct](https://mithril.js.org/code-of-conduct.html)

* Misc
* [Framework comparison](https://mithril.js.org/framework-comparison.html)
* [Releases and changelogs](https://github.com/MithrilJS/mithril.js/releases)
* [Legacy documentation](https://mithril.js.org/archives.html)

* * *

### [What is Mithril.js?](https://mithril.js.org/#what-is-mithriljs?)

Mithril.js is a modern client-side JavaScript framework for building Single Page Applications. It's small (8.8 KiB gzip), fast and provides routing and XHR utilities out of the box.

##### [Download size](https://mithril.js.org/#download-size)

Mithril.js (8.8 KiB)Vue + Vue-Router + Vuex + fetch (40 KiB)React + React-Router + Redux + fetch (64 KiB)Angular (135 KiB)

##### [Performance](https://mithril.js.org/#performance)

Mithril.js (6.4 ms)Vue (9.8 ms)React (12.1 ms)Angular (11.5 ms)

Mithril.js is used by companies like Vimeo and Nike, and open source platforms like Lichess.

If you are an experienced developer and want to know how Mithril.js compares to other frameworks, see the [framework comparison](https://mithril.js.org/framework-comparison.html) page.

Mithril.js supports IE11, Firefox ESR, and the last two versions of Firefox, Edge, Safari, and Chrome. No polyfills required.

_Looking for the v1 docs? [Click here](https://mithril.js.org/archive/v1.1.7/index.html)._

* * *

### [Getting started](https://mithril.js.org/#getting-started)

An easy way to try out Mithril.js is to include it from a CDN and follow this tutorial. It'll cover the majority of the API surface (including routing and XHR) but it'll only take 10 minutes.

Let's create an HTML file to follow along:

```html
<body>
<script src="https://unpkg.com/mithril/mithril.js"></script>
<script>
var root = document.body

// your code goes here!
</script>
</body>
```

To make things simpler you
Read full article → ← Back to Reads