✨ Retina - A Browser Engine Project 🔗

Retina is a fresh approach to web browser engines, written entirely in Rust. It aims to stay close to web standards and specifications, focusing on correctness, performance, and safety. This is a monorepo that contains the main binary retina, alongside several libraries that define different aspects of the browser's operations.

📦️ Components

• retina - The main application entry point.
• retina-common - Shared types and utilities used across other libraries.
• retina-compositor - Responsible for drawing the layout to the screen.
• retina-dom - Implements the Document Object Model, managing and manipulating the tree structure of the webpage.
• retina-fetch - Responsible for making HTTP requests to retrieve resources over the internet. This implements the Fetch API
• retina-gfx - Graphics subsystem for both the compositor and the GUI.
• retina-layout - Implements the CSS box model and layout algorithms.
• retina-page - Orchestrates the creation and management of web pages.
• retina-style - Implements the CSS representation.
• retina-style-computation - Computes the final style of the elements based on CSS rules.
• retina-style-parser - Parses CSS stylesheets and inline styles.
• retina-user-agent - Handles the behavior and identity of the web browser, and also specifies the browser/implementation-specific behavior.

🏃 Process Flow

This section describes the current process flow, which is currently simple but is crafted in such a way that a multi-page and multi-process architecture is eventually possible, without coupling these too much to the current single-page architecture.

1. retina starts up, creates a window and a page
2. retina-page resolves the URL and starts a page load
3. retina-fetch loads the HTML contents of the URL
4. retina-page invokes retina-dom
5. retina-dom parses the HTML and constructs a DOM tree
6. retina-page collects the stylesheets
7. retina-page invokes retina-style
8. retina-style_parser parses the CSS associated with these stylesheets
9. retina-page invokes retina-layout
10. retina-layout invokes retina-style-computation
11. retina-style-computation resolves and computes the style per element
12. retina-layout creates a CSS Box tree per element using the computed style
13. retina-page invokes retina-compositor
14. retina-compositor sends drawing commands to retina-gfx using the Box tree
15. retina-gfx translates the draw commands to wgpu-specific calls
16. retina-gfx executes these commands on the page surface
17. wgpu invokes the underlying graphics library (OpenGL, Vulkan, etc.)
18. retina-page sends a texture view of the page surface to the main process
19. retina calls retina-gfx to paint this texture view to the window surface

📚 Quick Links

• CSS 2.2
• CSS Cascading and Inheritance Level 4
• CSS Display Module Level 4
• CSS Indices
• CSS Selectors Module Level 4
• CSS Syntax Module Level 4
• CSS Values and Units Module Level 4
• DOM Standard
• Fetch Standard
• HTML Living Standard
• WebGPU

⚖️ License

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.