Académique Documents
Professionnel Documents
Culture Documents
O browser ao receber o arquivo HTML ele irá fazer outras chamadas HTTP para os outros
assets, sejam arquivos CSS e JS externos, imagens, entre outros. Após isso ele irá parsear
os arquivos HTML, CSS e JS.
Quando o browser faz o parsing do HTML ele constrói uma árvore de markup HTML e com
isso ele constrói o Document Object Model (DOM) que é a representação do documento
HTML para elementos externos como o Javascript.
Da mesma forma o CSS também é parseado para um Stylesheet Object, em que cada
objeto contém regras CSS com seletores correspondentes a gramática CSS.
Após a fase de parsing, o browser faz a renderização passando pelos nós do DOM e
calculando o estilo CSS para cada nó, esse processo é chamado de painting.
Toda vez que alguma mudança acontece seja mudando o estilo ou posição de um
componente acontecerá um repaint daquele elemento e de seus descendentes (dependo do
tipo de mudança), já acionar um novo elemento no DOM irá gerar um novo processo de
layout e repaint desse nó. Mudanças maiores, podem gerar um relayout e repaint da página
inteira.
A maioria dos browsers funciona com uma única thread tanto para executar o código
javascript da página como para e evento de layout e paint. Essa thread é chamada de Event
Loop, ela fica rodando infinitamente executando esperando e executando esses eventos. Já
operações de I/O, setTimeout, são feitas através de outras threads webAPIs.
Sites dinâmicos usam Javascript e bibliotecas escritas na mesma: JQuery, React, Angular,
etc, para ir mudando dinamicamente o conteúdo de uma página. Normalmente páginas
webs que não sejam estáticas fazem requests para servidores externos usando Ajax, Fetch
ou alguma outra biblioteca que permita a página fazer HTTP requests (como explicado
acima) e quando este obtiver a resposta ele pode ter uma callback para alterar o conteúdo
da página com o resultado do request. Além disso é possível mandar dados para o servidor
gravar, por exemplo através de um POST, ou fazer um update através de um PUT, embora
POST também possa ser usado para fazer updates.