A inicialização do DevTools agora está cerca de 13% mais rápida 🎉 (de 11,2 segundos para 10 segundos)
Texto longo, leia o resumo: o resultado é alcançado com a remoção de uma serialização redundante.
Visão geral
Enquanto o DevTools está inicializando, ele precisa fazer algumas chamadas para o mecanismo JavaScript V8.
O mecanismo que o Chromium usa para enviar comandos do DevTools para o V8 (e para a IPC em geral) é chamado de mojo. Meus colegas de equipe Benedikt Meurer e Sigurd Schneider descobriram uma ineficiência ao trabalhar em outra tarefa e tiveram uma ideia para melhorar o processo removendo duas etapas redundantes na forma como essas mensagens são enviadas e recebidas.
Vamos conferir em detalhes como o mecanismo mojo funciona.
Mecanismos mojo
Há um comando mojo EvaluateScript que executa o comando JS. Ela serializa todo o comando JS, incluindo arguments, em uma string de código-fonte JavaScript que pode ser eval(). Como você pode imaginar, essas strings podem ficar muito longas e caras. Depois que o comando é recebido pelo V8, essas strings de código JavaScript são desserializadas antes da execução. Esse processo de serialização e desserialização de cada mensagem cria uma sobrecarga significativa.
Benedikt Meurer percebeu que a serialização e desserialização do arguments são caras e que as etapas "Serialize JS command to JS string" e "Deserialize JS string" são redundantes e podem ser ignoradas.
Detalhes técnicos: RenderFrameHostImpl::ExecuteJavaScript
Como melhoramos
Apresentamos outro método da API mojo, que permite transmitir diretamente o nome do objeto, o método a ser chamado e a lista de argumentos, sem precisar criar a string do código-fonte em JavaScript. Com isso, é possível pular a serialização e desserialização e eliminar a necessidade de analisar o código JavaScript.
Para detalhes técnicos sobre como implementamos essa otimização, consulte estes dois patches:
- CL 2431864: [ DevTools] reduzir a sobrecarga de desempenho do envio de mensagens no front-end
- CL 2442012: [ DevTools] usar o
ExecuteJavaScriptMethodno DevTools
Impacto
Para avaliar a eficácia da mudança, fizemos algumas comparações comparando as revisões do Chromium cb971089a058 e 4f213b39d581 (antes e depois da mudança).
Em ambas as revisões, executamos o seguinte cenário cinco vezes:
- Gravar rastro usando
chrome://tracing - Abrir DevTools-on-DevTools
- Acesse o trace
CrRendererMaingravado e compare as métricas específicas do V8.
Com base nesses experimentos, o DevTools abre aproximadamente 13% mais rápido (de 11,2 segundos para 10 segundos) com a otimização.
Destaques, durações de CPU
| Nome do método | Não otimizado (ms) | Otimizado (ms) | Diferenças (ms) | Melhoria da velocidade (%) |
| Total | 11.213,19 | 9.953,99 | -1.259,20 | 12,65% |
| v8.run | 499,67 | 3.61 | -496,06 | 12,65% |
| V8.Execute | 1.654,87 | 1.349,61 | -305,25 | 3,07% |
| v8.callFunction | 1.171,84 | 1.339,77 | 167,94 | -1,69% |
| v8.compile | 133,93 | 3,56 | -130,37 | 1,31% |
Tabela completa de comparação de métricas de rastreamento
Como resultado, ele abre e funciona mais rapidamente com menos uso da CPU. 🎉
Fazer o download dos canais de visualização
Use o Chrome Canary, Dev ou Beta como seu navegador de desenvolvimento padrão. Esses canais de pré-visualização dão acesso aos recursos mais recentes do DevTools, testam APIs modernas da plataforma Web e encontram problemas no seu site antes que os usuários o façam!
Entrar em contato com a equipe do Chrome DevTools
Use as opções a seguir para discutir os novos recursos e mudanças na postagem ou qualquer outro assunto relacionado ao DevTools.
- Envie uma sugestão ou feedback pelo site crbug.com.
- Para informar um problema do DevTools, use Mais opções
> Ajuda > Informar problemas do DevTools no DevTools. - Tuíte em @ChromeDevTools.
- Deixe comentários nos vídeos do YouTube sobre as novidades do DevTools ou nos vídeos do YouTube com dicas sobre o DevTools.