CPU, GPU, memória e arquitetura de vários processos
Nesta série de blogs em quatro partes, examinaremos o navegador Chrome, desde a arquitetura de alto nível até as especificidades do pipeline de renderização. Se você já se perguntou como o navegador transforma seu código em um site funcional ou não sabe por que uma técnica específica foi sugerida para melhorar o desempenho, esta série é para você.
Na primeira parte desta série, analisaremos a terminologia básica de computação e a arquitetura de vários processos do Chrome.
No centro do computador estão a CPU e a GPU
Para entender o ambiente em que o navegador está sendo executado, precisamos entender algumas partes do computador e o que elas fazem.
CPU
A primeira é a Unit Central, ou CPU,. A CPU pode ser considerada o cérebro do seu computador. O núcleo da CPU, retratado aqui como um funcionário de escritório, pode processar diversas tarefas uma a uma à medida que entram. Ele pode lidar com tudo, desde matemática até arte, e saber responder a uma ligação de um cliente. No passado, a maioria das CPUs era um único chip. Um núcleo é como outra CPU no mesmo chip. Em hardwares modernos, geralmente há mais de um núcleo, proporcionando mais capacidade de computação para smartphones e laptops.
GPU
A gráfica tocessando Unit, ou GPU, é outra parte do computador. Ao contrário da CPU, a GPU é boa para lidar com tarefas simples, mas em vários núcleos ao mesmo tempo. Como o nome sugere, ele foi desenvolvido inicialmente para lidar com gráficos. É por isso que, no contexto de gráficos, "que usam GPU" ou "com suporte de GPU" está associado à renderização rápida e à interação suave. Nos últimos anos, com a computação acelerada por GPU, cada vez mais computação é possível usar apenas a GPU.
Quando você inicia um aplicativo no computador ou smartphone, ele é alimentado pela CPU e GPU. Normalmente, os aplicativos são executados na CPU e na GPU usando mecanismos fornecidos pelo sistema operacional.
Executar programa em Process e Thread
Outro conceito a ser compreendido antes de mergulhar na arquitetura do navegador é o processo e o Thread. Um processo pode ser descrito como o programa em execução de um aplicativo. Uma linha de execução é aquela que está dentro do processo e executa qualquer parte dele.
Quando você inicia um aplicativo, um processo é criado. O programa pode criar linhas de execução para ajudar a funcionar, mas isso é opcional. O sistema operacional fornece ao processo uma "fração" de memória para trabalhar, e todo o estado do aplicativo é mantido nesse espaço de memória particular. Quando você fecha o aplicativo, o processo também desaparece e o sistema operacional libera a memória.
Um processo pode solicitar que o sistema operacional inicie outro processo para executar tarefas diferentes. Quando isso acontece, diferentes partes da memória são alocadas para o novo processo. Se dois processos precisarem conversar, use a Inter Rocesso Comunicação (IPC). Muitos aplicativos são projetados para funcionar dessa maneira. Assim, se um processo de worker não responder, ele poderá ser reiniciado sem interromper outros processos que executam partes diferentes do aplicativo.
Arquitetura do navegador
Como um navegador da Web é criado usando processos e encadeamentos? Bem, pode ser um processo com muitas linhas de execução diferentes ou muitos processos distintos em que algumas linhas de execução se comunicam por IPC.
O importante aqui é notar que essas diferentes arquiteturas são detalhes de implementação. Não há especificações padrão sobre como se pode criar um navegador da Web. A abordagem de um navegador pode ser completamente diferente da outra.
Para esta série de blogs, estamos usando a arquitetura recente do Chrome, descrita na Figura 8.
Na parte de cima está o processo do navegador em conjunto com outros processos que cuidam de diferentes partes do aplicativo. Para o processo do renderizador, vários processos são criados e atribuídos a cada guia. Até recentemente, o Chrome dava um processo para cada guia quando possível. Agora, ele tenta dar um processo próprio a cada site, incluindo iframes. Consulte Isolamento de sites.
Qual processo controla o quê?
A tabela a seguir descreve cada processo do Chrome e o que ele controla:
Processo e o que ele controla | |
---|---|
Navegador |
Controla a parte "cromada" do aplicativo, incluindo a barra de endereço, favoritos e os botões "Voltar" e
"Avançar". Também processa as partes invisíveis e privilegiadas de um navegador da Web, como solicitações de rede e acesso a arquivos. |
Renderizador | Controla tudo dentro da guia em que um site é exibido. |
Plug-in | Controla todos os plug-ins usados pelo site, por exemplo, o Flash. |
GPU | Processa tarefas da GPU isoladamente de outros processos. Eles são separados em processos diferentes, porque as GPUs lidam com solicitações de vários apps e as desenham na mesma superfície. |
Existem ainda mais processos, como a extensão e os utilitários. Se você quiser ver quantos processos estão em execução no Chrome, clique no ícone do menu de opções
no canto superior direito, selecione "Mais ferramentas" e, depois, "Gerenciador de tarefas". Isso abre uma janela com uma lista dos processos em execução no momento e a quantidade de CPU/memória usada por eles.Os benefícios da arquitetura de vários processos no Chrome
Anteriormente, mencionei que o Chrome usa vários processos de renderizador. No caso mais simples, imaginamos que cada guia tem o próprio processo de renderização. Digamos que você tenha três guias abertas e que cada uma seja executada por um processo de renderizador independente.
Se uma guia deixa de responder, você pode fechá-la e seguir em frente enquanto mantém as outras guias ativas. Se todas as guias estiverem em execução em um processo, quando uma delas parar de responder, todas as guias não vão responder. Que pena.
Outro benefício de separar o trabalho do navegador em vários processos é a segurança e o sandbox. Como os sistemas operacionais oferecem uma forma de restringir os privilégios de processos, o navegador pode colocar alguns processos no sandbox de recursos. Por exemplo, o navegador Chrome restringe o acesso arbitrário a arquivos para processos que lidam com entradas arbitrárias do usuário, como o processo do renderizador.
Como os processos têm o próprio espaço de memória particular, eles geralmente contêm cópias da infraestrutura comum (como o V8, que é o mecanismo JavaScript do Chrome). Isso significa mais uso da memória, já que elas não podem ser compartilhadas da forma como seriam se fossem linhas de execução dentro do mesmo processo. Para economizar memória, o Chrome limita o número de processos que ele pode ativar. O limite varia de acordo com a quantidade de memória e de CPU do dispositivo. No entanto, quando o Chrome atinge o limite, ele começa a executar várias guias do mesmo site em um processo.
Economia de mais memória: serviço no Chrome
A mesma abordagem é aplicada ao processo do navegador. A arquitetura do Chrome está passando por mudanças para executar cada parte do programa navegador como um serviço, permitindo a divisão em diferentes processos ou agregada em um.
A ideia geral é que, quando o Chrome é executado com um hardware potente, ele pode dividir cada serviço em processos diferentes, proporcionando mais estabilidade. No entanto, se estiver em um dispositivo com restrição de recursos, o Chrome consolida os serviços em um único processo que economiza memória. Uma abordagem semelhante de consolidação para menos uso de memória tem sido usada em plataformas como o Android antes dessa mudança.
Processos de renderizador por frame: isolamento de sites
O isolamento de sites é um recurso introduzido recentemente no Chrome, que executa um processo de renderizador separado para cada iframe entre sites. Falamos sobre um processo de renderizador por modelo de guia que permitia que iframes entre sites fossem executados em um único processo de renderizador com compartilhamento de espaço de memória entre diferentes sites. Executar a.com e b.com no mesmo processo de renderizador pode parecer aceitável. A política de mesma origem é o modelo de segurança principal da Web. Ela garante que um site não possa acessar dados de outros sites sem consentimento. Ignorar essa política é o principal objetivo dos ataques de segurança. O isolamento de processos é a maneira mais eficaz de separar sites. Com o Meltdown e Spectre, ficou ainda mais evidente que precisamos separar sites usando processos. Com o isolamento de sites ativado em computadores por padrão desde o Chrome 67, cada iframe entre sites em uma guia recebe um processo de renderizador separado.
Habilitar o isolamento de sites tem sido um esforço de engenharia de vários anos. O isolamento de sites não é tão simples quanto atribuir diferentes processos de renderizador. Ele muda fundamentalmente a forma como os iframes se comunicam. Ao abrir o DevTools em uma página com iframes em execução em diferentes processos, o DevTools precisou implementar trabalhos nos bastidores para fazer com que pareça simples. Até mesmo executar um simples Ctrl+F para encontrar uma palavra em uma página significa pesquisar em diferentes processos de renderizador. Você pode entender por que os engenheiros do navegador falam sobre o lançamento do isolamento de sites como um marco importante.
Conclusão
Nesta postagem, abordamos uma visão de alto nível da arquitetura do navegador e abordamos os benefícios de uma arquitetura de vários processos. Também falamos sobre a servicização e o isolamento de sites no Chrome, que está intimamente relacionado à arquitetura de vários processos. Na próxima postagem, veremos o que acontece entre esses processos e linhas de execução para exibir um site.
Você gostou da postagem? Se você tiver dúvidas ou sugestões para a próxima postagem, entre em contato comigo pelo e-mail @kosamari no Twitter.