Middle
Como é que a renderização do site é feita para o utilizador?
sobes.tech IA
Resposta da IA
- O utilizador insere a URL no navegador. O navegador envia uma solicitação DNS para obter o endereço IP do servidor.
- O navegador estabelece uma conexão TCP com o servidor. Normalmente é utilizado o protocolo HTTP/S.
- O navegador envia uma solicitação HTTP ao servidor. São solicitados o documento HTML e outros recursos (CSS, JavaScript, imagens).
- O servidor processa a solicitação e envia uma resposta HTTP. A resposta contém os recursos solicitados e informações sobre o estado.
- O navegador recebe o documento HTML. Começa a análise do HTML.
- Cria-se o DOM (Document Object Model). Árvore de objetos que representa a estrutura do HTML.
- O navegador detecta links para recursos externos (CSS, JavaScript, imagens) no HTML. São feitas solicitações adicionais para obtê-los.
- O navegador recebe os estilos CSS. Começa a análise do CSS.
- Cria-se o CSSOM (CSS Object Model). Árvore de objetos que representa os estilos.
- Cria-se a Árvore de Renderização. União do DOM e CSSOM. Contém apenas os elementos visíveis e seus estilos.
- Layout (ou Reflow). São calculadas as dimensões geométricas e a posição de cada elemento na página.
- Paint (ou Repaint). Os elementos são desenhados na tela de acordo com seus estilos e posição.
- Composição. A página é composta camada por camada para exibição ao usuário.
- O navegador recebe os arquivos JavaScript. Começa a análise e execução do código. JavaScript pode modificar o DOM e CSSOM, levando a um recálculo de Layout e Paint.
- Exibição da página ao usuário. À medida que os recursos são recebidos e as etapas são concluídas, o usuário vê o conteúdo da página.