Skip to main content

Command Palette

Search for a command to run...

Working of Browser>>

Updated
•2 min read•View as Markdown
Working of Browser>>

what is a browser?

a browser is a software application that fetches code from internet , understand the code and convert into a human readable page , on which you and me can interact

>>browser example >

  1. google chrome

  2. microsoft Edge

  3. mozilla firefox

Main parts of a browser.

  1. User interface

  2. browser engine (Ex chrome have v8 engine that turn programming language into human readable language)

  3. rendering engine

  4. networking

  5. JavaScript Engine

  6. data storage(Memory management)

Browser Engine vs Rendering Engine

Browser Engine>>

  1. connects ui and rendering engine

  2. control system and navigations

  3. manages high level logics

Rendering Engines>>

  1. Reads HTML

  2. Reads CSS

  3. Build page layout

  4. draw pixels

Networking: how a browser fetches HTML, CSS, JS

  1. Browser asks DNS → “What is the IP?”

  2. Connects to server

  3. Sends HTTP request

  4. Server responds with:

    • HTML

    • CSS

    • JS

Browser downloads everything

HTML parsing and DOM creation

Browser reads CSS and build CSS Object Model.

so it store everything in tree format

How DOM and CSSOM come together

DOM + CSSOM

To create: render tree

Render Tree = What actually needs to appear on screen.

It ignores:

  • Hidden elements

  • Meta tags

  • Script tags

i hope it will help : >