It is divided into 4 steps:
1. When sending a URL request, whether the URL is a Web page URL or a URL for each resource on a Web page, the browser opens a thread to process the request and initiates a DNS query on the remote DNS server. This enables the browser to obtain the corresponding IP address of the request.
2. The browser establishes a TCP/IP connection with the remote WEB server through the TCP three handshake negotiation. The handshake consists of a synchronization message, a synchronous-response message, and a response message, which is passed between the browser and the server in three messages. The handshake is first attempted by the client to establish communication, then the server answers and accepts the client's request, and finally the client sends a message that the request has been accepted.
3. Once a TCP/IP connection is established, the browser sends a GET request for HTTP to the remote server through the connection. The remote server locates the resource and returns the resource using an HTTP response, and the HTTP response status of 200 indicates a correct response.
4. At this point, the WEB server provides the resource service and the client begins to download the resource.
When the request returns, it enters the front-end module that we care about
In short, the browser parses the HTML-generated DOM tree, followed by the CSS Rule tree based on the CSS, and JavaScript can manipulate the DOM based on the DOM API.
The process of how a browser generates a page after a Web page click link