No post anterior eu comentei sobre os benefícios da utilização do server push, recurso que foi disponibilizado a partir do HTTP/2. Lá mencionei sobre a melhor reutilização da conexão TCP quando ela é estabelecida para extrair algum recurso que desejamos solicitar, como por exemplo, uma página HTML.
É comum qualquer página HTML depender de recursos extras, tais como arquivos de scripts, estilos (CSS) e imagens. Considere o exemplo abaixo, que é uma página extremamente simples que referencia cinco arquivos de estilos.
<html>
<head>
<link href=”Estilos1.css” rel=”stylesheet” type=”text/css” />
<link href=”Estilos2.css” rel=”stylesheet” type=”text/css” />
<link href=”Estilos3.css” rel=”stylesheet” type=”text/css” />
<link href=”Estilos4.css” rel=”stylesheet” type=”text/css” />
<link href=”Estilos5.css” rel=”stylesheet” type=”text/css” />
</head>
<body>
Testando
</body>
</htm>
Quando fazemos a requisição para esta página HTML, é possível notar no log abaixo uma barra cinza em cada linha de acesso para os arquivos *.css. Essa cor indica o período de tempo em que o navegador fica aguardando para iniciar a requisição para o respectivo recurso. É importante notar que neste exemplo estamos utilizando o HTTP 1.1.
Já agora se fizermos a requisição utilizando o HTTP/2, podemos perceber que não existe mais a barra cinza, ou seja, isso indica que os recursos são carregados de forma concorrente, sem a necessidade de ter um delay. Isso tudo é possível perceber na imagem abaixo.
Israel Aece 
Muito interessante, obrigado por compartilhar. 🙂