Observação
O acesso a essa página exige autorização. Você pode tentar entrar ou alterar diretórios.
O acesso a essa página exige autorização. Você pode tentar alterar os diretórios.
Esses são os recursos mais recentes na versão estável do Microsoft Edge DevTools.
Vídeo: Novidades no DevTools 112
A ferramenta Desempenho desativa a minimização do JavaScript em execução em iframes fora do processo
Em versões anteriores do Microsoft Edge, a execução do JavaScript em um iframe fora do processo (OOPIF) era isolada do DevTools. Como resultado, a ferramenta Desempenho não foi capaz de aplicar sourcemaps a eventos de desempenho que são de um OOPIF. Ao gravar um perfil na ferramenta Desempenho , a ferramenta só pode exibir os nomes de arquivo e função minificados no gráfico de degradê, não os nomes não minificados:
No Microsoft Edge 112, a ferramenta Desempenho agora carrega mapas de origem e os aplica aos eventos de desempenho rastreados em OOPIFs. Como resultado, depois de gravar um perfil na ferramenta Desempenho , agora você pode ver nomes de arquivo e função não minificados para a execução JavaScript que ocorre dentro de um OOPIF:
Veja também:
- A ferramenta Desempenho desminifica nomes de arquivos e funções ao criar o perfil do código de produção em Novidades do DevTools (Microsoft Edge 111).
- Depurar com segurança o código original publicando mapas de origem para o servidor de símbolos do Azure Artifacts
- Depurar com segurança o código original usando mapas de origem do servidor de símbolos do Azure Artifacts
- Registrar o desempenho na referência de recursos de desempenho.
A ferramenta de visão geral do CSS exibe seletores não simples para ganhos rápidos de desempenho
A ferramenta de visão geral do CSS tem uma nova seção Seletores não simples, que exibe uma lista de seletores CSS não simples quando você tira um snapshot de visão geral do CSS da sua página da Web. Esta lista de seletores CSS não simples na ferramenta de visão geral do CSS fornece uma maneira rápida de identificar culpados comuns que podem estar causando eventos de Recalcular Estilos de longa duração:
Esta é uma lista de seletores que podem reduzir o desempenho. Para determinar se esses seletores estão realmente reduzindo o desempenho, use o recurso Estatísticas do seletor na ferramenta Desempenho .
Você pode tentar alterar esses seletores para que eles sejam mais específicos e correspondam a menos elementos, reduzindo o tempo que o navegador leva para calcular estilos nos seguintes casos:
- Quando elementos são adicionados ou removidos do DOM.
- Quando os atributos de um elemento são alterados, como
classouid. - Quando ocorre uma entrada do usuário, como um movimento do mouse ou uma mudança de foco, o que pode afetar
:hoveras regras.
Para analisar o desempenho individual do seletor CSS e analisar o impacto de suas alterações, use o recurso Estatísticas do seletor na ferramenta Desempenho .
Veja também:
- Otimizar estilos CSS com a ferramenta de visão geral do CSS
- Analise o desempenho do seletor CSS durante os eventos Recalcular Estilo
O Visualizador JSON no Microsoft Edge dá suporte ao dobramento de código
A partir do Microsoft Edge 110, você tem acesso a um recurso experimental para exibir JSON diretamente no navegador: o Visualizador JSON. Anteriormente, você pode ter usado extensões de navegador ou editores de texto para exibir JSON, mas agora você pode inspecionar cargas JSON diretamente no Microsoft Edge, seja o JSON da rede ou do disco.
A partir do Microsoft Edge 112, o Visualizador JSON agora dá suporte ao dobramento de código. O Visualizador JSON é um recurso experimental. Para ativar o Visualizador JSON e a dobra de código de acesso:
Saiba mais em
edge://flags.No campo de texto Sinalizadores de pesquisa , comece a digitar Visualizador JSON.
No menu suspenso Visualizador JSON , selecione Habilitado. Um botão Reiniciar aparece no canto inferior direito.
Clique no botão Reiniciar .
Vá para um arquivo JSON, como https://microsoftedge.github.io/Demos/json-dummy-data/256KB.json. Os números de linha aparecem à esquerda.
Clique no ícone de engrenagem (
) no canto superior direito e marque a caixa de seleção Dobramento de código .
Com o dobramento de código ativado, agora você pode expandir e recolher objetos e matrizes dentro do JSON que está inspecionando:
Envie-nos seus comentários!
Veja também:
Melhorias no Modo de Foco
O Modo de Foco é uma nova interface de usuário experimental para DevTools. O Modo de Foco simplifica e otimiza a interface do usuário do DevTools, fornecendo personalização máxima sem comprometer o conjunto robusto de recursos das ferramentas. No Microsoft Edge 112, o Modo de Foco recebeu as seguintes melhorias:
Pressionar Esc mostra ou oculta totalmente a Exibição Rápida
Nas versões anteriores do Microsoft Edge, no Modo de Foco, o painel Visualização Rápida era sempre exibido, como recolhido ou expandido. Pressionar Esc expandia o painel Visualização rápida se ele estivesse recolhido e vice-versa. No entanto, quando a ferramenta Console foi selecionada na Barra de atividades, pressionar Esc quando o painel Visualização rápida foi recolhido exibiu uma exibição em branco. No Microsoft Edge 112, esse problema foi corrigido.
Pressionar Esc agora mostra ou oculta totalmente o painel Visualização rápida . Se o painel Visualização rápida estiver oculto no momento, pressionar Esc mostrará o painel Visualização rápida , expandido:
Se a barra de ferramentas Visualização rápida estiver exibida no momento (se o painel Visualização rápida estiver recolhido ou expandido), pressionar Esc ocultará totalmente a barra de ferramentas e o painel Visualização rápida :
O ícone do Nó para DevTools dedicado não se sobrepõe mais ao primeiro ícone na Barra de Atividades
No Modo de Foco, quando o DevTools detecta que um servidor Node.js está em execução, o ícone Nó é exibido. Clicar nesse ícone abre o DevTools para Node dedicado.
Atualizar: A Barra de Atividades vertical não é mais suportada, no Microsoft Edge 144 e em versões futuras.
Antes do Microsoft Edge 112, o ícone de Nó se sobrepõe ao primeiro ícone de ferramenta quando a Barra de Atividades está na orientação vertical, dificultando a seleção da primeira ferramenta. Esse problema agora foi corrigido; não há sobreposição do ícone de Nó e do primeiro ícone de ferramenta quando a Barra de Atividades está na vertical:
Com a Barra de Atividades vertical, apenas um rótulo é mostrado para cada ícone de ferramenta ao passar o mouse
Atualizar: A Barra de Atividades vertical não é mais suportada, no Microsoft Edge 144 e em versões futuras.
No Modo de Foco, quando a Barra de Atividades está na orientação vertical, um rótulo de nome de ferramenta é exibido quando você passa o mouse sobre um ícone ou seleciona um ícone com o teclado. Esses rótulos ajudam você a aprender o ícone de cada ferramenta na Barra de Atividades.
Anteriormente, selecionar um ícone com o teclado ou passar o mouse sobre um ícone exibia dois rótulos simultaneamente. Esse problema agora foi corrigido; Apenas um rótulo é exibido:
Anúncios do projeto Chromium
O Microsoft Edge 112 também inclui as seguintes atualizações do projeto Chromium:
- Atualizações de Estilos de Elementos >
- Marcação de pontos de log e pontos de interrupção condicionais no Console
- Ignorar scripts irrelevantes durante a depuração
- Preterimento do JavaScript Profiler iniciado
- Emular contraste reduzido
- Farol 10