Title: Mithril JS Report for Client-Side Scripting

Name: Bartosz Wicha

T-Number: T00223773

Date: 21/11/2023
Contents
1. Introduction...................................................................................................................... 2

2. Main Body......................................................................................................................... 2

2.1 Features.......................................................................................................................... 2

2.2 Advantages and Disadvantages......................................................................................2

2.3 Usage.............................................................................................................................. 2

3. Conclusion.........................................................................................................................2

4. Bibliography...................................................................................................................... 2

1. Introduction

This report aims to provide a general understanding of Mithril.js. To provide this

information, this report will focus on the background and the functionality of Mithril.
Before getting to the specifics of Mithril, first we need to understand the concept of a
framework. Frameworks are sets of tools that provide additional features to assist in
creating software applications. They allow users to develop projects faster and easier
with the use of these tools. Mithril was introduced by Leo Horie in 2014, (LinkedIn,
2023) since then it has gained attention for its speed, versatility, and simplicity. Mithril
is a client-side lightweight JavaScript framework that is designed to assist in
developing Single Page Applications (SPA), with companies such as Nike and Vimeo
(Mithril GitHub 2023) having found success in using Mithril.

2. Main Body
2.1 Features

Mithril provides useful APIs to create Single Page Applications, based around key
concepts such as Components, Virtual Document Object Model, Routing System and
XHR. (Mithril.Js.Org 2023)

Components: Components are the key building block for mithril and are used to
define the structure and behaviour for specific sections of a website. Thus,
Components allow developers to create reusable code, in turn, providing for modular
websites. (Mithril.js.org Components 2023)

Document Object Model (DOM): The DOM consists of nodes. Nodes are individual
pieces of content such as elements, text, or attributes in a HTML document. However,
Mithril does not directly interact with the Real DOM, instead it utilizes a Virtual DOM
to identify changes. When there is a change to the Virtual Dom, Mithril checks for
changes between the old and updated Virtual DOM to identify what changes need to
be made in the real DOM. In short, when nodes are altered, Mithril only modifies the
altered nodes in the Real DOM. (Mithril.js.org Virtual DOM 2023)

Routing: Mithril’s routing system enables client-side navigation within a single web
page. This is done by defining routes, which act as addons to URLs. Once a route is
defined components can then be assigned to it using a function. When the URL to a
route is clicked, instead of loading a new page it updates the components of the
current page based on the components of the associated route. (Mithril.js.org Routing
2023)

XHR: XHR stands for XMLHttpRequest, and it is used to enable client-side

communication with servers. XHR allows for asynchronous data fetching between your
client and server. Asynchronous means that code can keep executing while fetching
data and will update the contents once the data has been received. XHR is a widely
used feature in modern day websites such as emails, or websites like Instagram,
where content needs to update on the go. (Mithril.Js. Org XHR 2023)
2.2 Advantages and Disadvantages

Advantages:
Performance: Thanks to the availability of certain features such as the Virtual DOM
and client-side routing mithrils performance is very streamlined.

Minimalistic: While Mithril has limited functions, it is outstanding at performing its

function. Additionally, it is not overloaded with many features, clouding the
framework.

Easy to Learn: Mithril’s small size makes it easier to learn as it reduces the number of
new concepts and features to grasp.

No Dependencies: Mithril is not dependent on other libraries.

Bandwidth Optimisation: Mithril has less code in its library, resulting in less
bandwidth needed on initial load of a webpage.

Disadvantages:
Small Community: Compared to larger frameworks, Mithril has a smaller community;
leading to scarcity of information.

Scalability: Mithril’s small number of features may be helpful for small projects.
However, depending on the scale of your project it may not be sustainable.

Low Market Adoption: Mithril is less popular than other frameworks; meaning there
is less demand for Mithril-skills in the workplace.
 2.3 Usage

While Mithril is a lesser-used framework, it is still used in many professional websites.

Companies like Narrafirma (Narrafirma GitHub 2023) use it for interface building. VHX,
a subsidiary of Vimeo utilizes mithril.js for its web application. (Mithril GitHub 2023)
Additionally, Mithril has been studied as a tool to create educational portals for
students. (Szepes 2015) It is unpopular, so usage, while versatile, is uncommon.

3. Conclusion

Mithril is a convenient and utilitarian tool, useful for developing single web
applications. This lightweight framework makes Single Page Application development
easier. Mithril has been employed in many different places, from Large Ion Collider
experiments (Teitsma et al., 2020) to Nike storefronts, (Mithril GitHub 2023)
confirming its versatility. However, it has a low demand from employers, making it
harder to rely on in the workplace. I would recommend Mithril for developers that
are new to using frameworks, and for smaller projects. For newer developers, it is a
simple framework, assisted by lots of helpful documentation on its workings. For
smaller projects, because Mithril has less features, 3rd party tools or libraries may be
needed. However, Mithrils small user base results in the absence of these needed
tools. In summary, Mithril is a small but powerful framework, better suited towards
simpler projects. Reviewing the GitHub forks (a metric identifying how many copies of
the repository has been made) shows Mithril’s unpopularity, with only one thousand
forks compared to Reacts forty-five thousand. This report has taught me the
fundamentals of Mithril.
4. Bibliography

Leo Horie - Staff Software Engineer - uber | LinkedIn. Available at:

https://www.linkedin.com/in/leo-horie-84b19054/ (Accessed: 19 November 2023).

Mithril.Js. Org, Routing. Available at: https://mithril.js.org/index.html#routing

(Accessed: 19 November 2023).

Mithril.Js. Org, XHR. Available at: https://mithril.js.org/index.html#xhr (Accessed: 19

November 2023).

Mithril.js.org. Virtual DOM Nodes. Available at: https://mithril.js.org/vnodes.html.

(Accessed: 19 November 2023).

Mithril.js (2023) Who Uses Mithril, GitHub. Available at

https://github.com/MithrilJS/mithril.js/wiki/Who-Uses-Mithril (Accessed: 19
November 2023).

Szepes, N. (2015) Design and Implementation of an Educational Support System.

thesis. (Accessed: 19 November 2023).
https://www.szepesnora.com/assets/files/diploma.pdf

Teitsma, M. et al. (2020) ‘Jiskefet, a bookkeeping application for Alice’, EPJ Web of
Conferences, 245, p. 04023. doi:10.1051/epjconf/202024504023.

Pdfernhout/narrafirma: Single-page Web App for Participatory Narrative Inquiry

(PNI), GitHub. Available at: https://github.com/pdfernhout/narrafirma (Accessed: 20
November 2023).