Test frequently--what happens when a browser enters a URL and clicks enter

1. resolve URL : The browser first identifies the URL that was received and extracts the Domain name field.
2. DNS resolution :

   Query Browser cache (The browser caches the DNS 2-30 minutes previously received), if not found,

   Checks the system cache, checks the Hosts file, which holds the domain name and IP data of some previously visited websites. It's like a local database. If you find it, you can get the IP address of the target host directly. If not found, you need

   Check the router cache , the router has its own DNS cache, which may include the contents of the query, if not, to

   query the ISP DNS cache: ISP DNS Cache ( local server cache ) there may be relevant content, if not yet, need,

   recursive query : From the root domain server to the top-level domain server and then to the limit domain name server, search for the IP of the target domain name.

3. A TCP link between the browser and the website (three handshake):

   First handshake: The client sends a request to the server (syn=1) to wait for the server to confirm;

   Second handshake: The server receives the request and confirms that it replies with an instruction (syn=1,ack=1);

   Third handshake: The client receives the server's reply instruction and returns an acknowledgement (Ack=1). The

   has a three-time handshake that establishes a connection between the client and the server and can now request and transfer data.

4. request and transfer data

The destination file on the server can be transferred to the browser for rendering by the GET request and the server's response.

5. Browser Rendering page

The client gets the server-side file, finds the HTML and MIME files, and, through the MIME file, the browser knows to use the page rendering engine to process the HTML file.

A. The browser parses the HTML source code and then creates a DOM tree.

In the DOM tree, each HTML tag has a corresponding node, and each text will have a corresponding text node.

B. The browser parses the CSS code, calculates the final style data, and forms the CSS object model Cssom.

The illegal CSS code is ignored first and then rendered in the order of the style in the browser's default settings-user settings-outer chain style-inline style--html.

C. Use the DOM and Cssom to build a rendering tree (rendering trees).
The render tree and the DOM tree are a bit like, but there are differences.

The DOM tree corresponds completely to the HTML tag one by one, but the render tree ignores elements that do not need to be rendered, such as head, Display:none elements, and so on.

And each line in a large piece of text is a separate node in the render tree.
Each node in the render tree is stored with the corresponding CSS property.

D. The browser draws the page directly to the screen based on the render tree.

Test frequently-what happens when the browser enters a URL and clicks enter