Moon

A hobby web browser developed from scratch

What is this?

This is a web browser developed from scratch using Rust. I created this project to practice my Rust skills as well as to learn how the browser works.

To fit with the "make from scratch" spirit, I'll limit the use of external libraries as much as possible.

Current status

Currently, the browser is able to render block layout! I'm working on supporting other types of layout & text-rendering. Here's a comparison with Firefox rendering. (Moon is on the left, Firefox is on the right).

Wanna try it out?

Here are the steps to try it out if you are interested:

1. Clone the repository.
2. Run cargo make example and wait for the code to compile & execute.
3. Open image.png to see the output.

Refer to the Makefile.toml file for more info.

Requirement: Please refer to the proper Dockerfile in /docker for more information.

Tested on: Ubuntu 18.04

Features

Bold text is what I'm working on

• 🔌 DOM API
• 📝 HTML Parsing
  • HTML tokenizer
  • HTML dom tree builder (85% specs)
• 🔌 CSSOM API
• 📝 CSS Parsing
  • CSS tokenizer
  • CSSOM parser/tree builder
• 📐 Style
  • CSS cascade
  • Style computation
  • Render tree
  • Selector matching
• 🎴 Layout process
  • Box model
  • Box tree generation
  • Line fragmentation
  • Layouts
    • Flow (Block and inline)
    • Flex
    • Grid
• 🎨 Rendering
  • Display list
  • GPU rendering
  • Text rendering
• 🌎 Networking
  • URL parsing
  • DNS resolving
  • DNS caching
  • HTTP/HTTPS
• 🖼️ Media
  • 🖼️ Image rendering
    • JPG
    • PNG
    • GIF
  • 🎬 Video playing
    • MP4
    • WebM
  • 🔈 Audio playing
    • MP3
    • WAV
• JavaScript

Blog posts

I write about what I learn from this journey on my blog (order by latest):

Browser from Scratch: Layout

A quick look into how the browser layout process works. - Read more

Browser from Scratch: CSS parsing & processing

A brief history of CSS & how browser process CSS values - Read more

Browser from Scratch: HTML parsing

Since I have foolishly made a promise with the first three words in the name of this series, let's build an HTML parser from scratch. - Read more

Browser from Scratch: DOM API

One of the main building blocks of the HTML rendering process is the DOM API. Before a browser can render the HTML document, it needs to parse the document content into a tree structure called the DOM tree. In this post, I'll break down my experimentation in building a DOM API with Rust. - Read more

Browser from Scratch: Introduction

This is the start of Browser from Scratch series, created to help me (and probably you too) to learn more about how a browser works by building one! - Read more

Author

• Viet Hung Nguyen

License

• MIT