Skip to content

A TypeScript implementation of Panchekha & Harrelson's model system of a browser — https://browser.engineering/

Notifications You must be signed in to change notification settings

Paganiniana/fp-browser

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

28 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

FP Browser

This is a project to recreate the browser from the browser.engineer project, by Pavel Panchekha & Chris Harrelson (2023). It uses Typescript instead of loosey-goosey Python, as a warm up for larger browser projects.

Outline

The plot of our browser is broken down into three acts:

I. Turning a URL into an HTTP request

II. Making that HTTP request, by whatever means necessary

III. Making heads/tails of the HTTP response

IV. Displaying said Response

Responses

This is not so much a climax as it is a never-ending sequel. Not so much Macbeth, as Henry the VI. We need to...

  1. Determine the type
  2. Display the type

In the event of an HTML response, we need to...

  1. Construct the DOM
  2. Start painting styles,
  3. Start running any JS we run into, which is a whole world unto itself.

Progress

These are the features included/recommended as part of Pavel & Harrelson (2023).

Chapter 1

  • Connecting to a server
  • Requesting Information
  • Request and Response
  • Display the HTML
  • Encrypted connections

Exercises:

  • HTTP/1.1
  • File URLs
  • data schemes
  • body tag
  • entities
  • view-source
  • compression (gzip)
  • Redirects
  • Caches

Chapter 2

  • Drawing to the Window
  • Laying out the text
  • Scrolling text
  • Reacting to the user
  • Faster Rendering

Exercises:

  • Line Breaks
  • Mouse Wheel
  • Emoji
  • Resizing
  • Zoom

Chapter 3

  • What is a font?
  • Measuring Text
  • Measure by word
  • Styling Text
  • A layout object
  • Text of different sizes
  • Faster text layout

Exercises

  • Centered Text
  • Superscripts
  • Soft Hyphens
  • Small caps
  • Preformatted text

Chapter 4

  • A tree of nodes
  • Constructing the tree
  • Debugging a parser
  • Self-closing tags
  • Using the node tree
  • Handling author errors

Exercises:

  • Comments
  • Paragraphs
  • Scripts
  • Quoted Attributes
  • Syntax Highlighting

Chapter 5

  • The layout tree
  • Block Layout
  • Size and position
  • Recursive painting
  • Backgrounds

Exercises:

  • Links Bar
  • Hidden Head
  • Bullets
  • Scrollbar
  • Table of Contents
  • Anonymous Black Boxes
  • Run Ins

References

Pavel, P., & Harrelson, C. (2023). Web Browser Engineering Browser.Engineering https://browser.engineering/index.html

About

A TypeScript implementation of Panchekha & Harrelson's model system of a browser — https://browser.engineering/

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published