Analisar a capacidade de resposta da interface de usuário em aplicativos da Store (XAML)

Applies to Windows and Windows Phone

Use o criador de perfil Capacidade de Resposta da Interface de Usuário XAML para aplicativos da Store para localizar e corrigir problemas de desempenho relacionados à renderização e processamento de XAML. Tempos de inicialização e de navegação longos, movimento panorâmico e rolagem desiguais e atrasos no processamento de entrada do usuário são alguns dos problemas que a ferramenta pode ajudá-lo a analisar.

Dica

Você pode coletar e analisar os dados de uso da CPU e de consumo de energia junto com dados da capacidade de resposta da interface de usuário XAML. Consulte Executar ferramentas de análise na página Desempenho e Diagnóstico

Conteúdo

Identificar cenários com marcas de usuário

Coletar dados de capacidade de resposta da interface do usuário para seu aplicativo

Coletar dados de capacidade de resposta da interface do usuário para um aplicativo instalado

Analisar dados de capacidade de resposta de interface do usuário

Otimizar a capacidade de resposta de XAML

Identificar cenários com marcas de usuário

Você também pode adicionar marcas do usuário aos seus dados de perfil para ajudar a identificar áreas na régua da linha do tempo.

User marks in the timeline

A marca aparece como um triângulo laranja na linha de tempo no momento em que o método é executado. A mensagem e a hora são exibidas como uma dica de ferramenta quando você passa o cursor do mouse sobre a marca. Se duas ou mais marcas de usuário ficarem próximas, elas serão mescladas e os dados de dica de ferramenta serão combinados. Você pode aplicar zoom na linha de tempo para separar as marcas.

Para adicionar uma marca de usuário ao código C#, Visual Basic e C++, crie primeiro um objeto Windows.Foundation.Diagnostics LoggingChannel. Em seguida, insira chamadas para os métodos LoggingChannel.LogMessage nos pontos do código que você deseja marcar. Use LoggingLevel.Information nas chamadas.

Quando o método é executado, uma marca de usuário é adicionada aos dados de criação de perfil com uma mensagem.

Dica

  • Windows.Foundation.Diagnostics LoggingChannel implementa a interface Windows.Foundation.IClosable (projetada como System.IDisposable em C# e VB). Para evitar o vazamento de recursos do sistema operacional, chame Dispose() quando você terminar o trabalho com o canal de registro em log.

  • Cada canal de registro em log aberto deve ter um nome exclusivo. Tentar criar um novo canal de registro em log com o mesmo nome de um canal não descartado gera uma exceção.

Consulte a amostra de SDK do Windows LoggingSession Sample para obter mais exemplos.

Coletar dados de capacidade de resposta da interface de usuário para seu aplicativo

Você pode criar um perfil da capacidade de resposta do seu aplicativo no dispositivo ou no simulador/emuladores do Visual Studio ou em um dispositivo remoto. Consulte Executar aplicativos da Store pelo Visual Studio. Veja a seguir as etapas básicas:

  1. Escolha onde você deseja executar o aplicativo na lista suspensa ao lado do botão Iniciar Depuração na barra de ferramentas Padrão do depurador.

    Running in the Simulator

  2. Quando você estiver criando um perfil em um tablet ou computador diferente do computador do Visual Studio, configure seu projeto para a criação remota de perfil. Consulte Executar aplicativos da Windows Store em um computador remoto

  3. No menu Depurar, escolha Iniciar Diagnóstico Sem Depurar.

    Choose XAML Profiler in the Diagnostic Hub

  4. Selecione Capacidade de resposta da interface de usuário XAML e Iniciar.

    Dica

    Ao iniciar o criador de perfil Capacidade de resposta da interface de usuário XAML, talvez você veja a janela Controle de Conta de Usuário solicitando sua permissão para executar o arquivo VsEtwCollector.exe. Selecione Sim.

  5. Execute seu aplicativo para coletar dados.

    Dica

    Execute o aplicativo diretamente no dispositivo. O desempenho do aplicativo observado no simulador ou por uma conexão de área de trabalho remota pode não ser indicativo do desempenho real do dispositivo.

  6. Para interromper a criação do perfil, retorne ao Visual Studio (Alt + Tab) e selecione Parar de coletar na página Desempenho e Diagnóstico.

    Stop collecting data

    O Visual Studio analisa os dados coletados e exibe os resultados.

    The XAML UI Responsive report page

Coletar dados de capacidade de resposta da interface de usuário para um aplicativo instalado

O criador de perfil Capacidade de resposta da interface de usuário XAML só pode ser executado nos aplicativos da Windows Store 8.1 que são iniciados em uma solução do Visual Studio ou são instalados por meio da Windows Store. Quando uma solução é aberta no Visual Studio, o destino padrão é Projeto de Inicialização. Você pode analisar a capacidade de resposta XAML para um aplicativo instalado no local ou em um dispositivo remoto sem uma solução aberta.

Para almejar um aplicativo instalado:

  1. Escolha Alterar Destino e escolha Aplicativo Instalado.

    Change Target list

  2. Criação remota de perfil. Para executar o criador de perfil de capacidade de resposta XAML em um dispositivo remoto, as Ferramentas Remotas do Visual Studio devem ser instaladas e estar em execução no dispositivo. Consulte Executar aplicativos da Windows Store em um computador remoto.

    Na caixa de diálogo Selecionar pacote do aplicativo instalados, escolha Máquina Remota e, em seguida, especifique o dispositivo remoto.

    Select Installed App Package for a remote device

  3. Na lista Pacotes de aplicativos instalados para a sessão atual, escolha o aplicativo de destino.

    Select Installed App Package dialog box

  4. Escolha Capacidade de Resposta da Interface de Usuário XAML na página Desempenho e Diagnóstico.

  5. Escolha Iniciar para iniciar a criação de perfil.

Para interromper a criação do perfil, retorne ao Visual Studio (Alt + Tab) e selecione Parar a coleta na página Hub de diagnóstico.

Analisar dados de capacidade de resposta da interface de usuário

Linha do tempo de sessão de diagnóstico | Utilização do thread da interface do usuário | Taxa de transferência visual (FPS) | Exibição de análise | Exibição de elementos importantes

Após coletar os dados de criação de perfil, você pode seguir estas etapas para iniciar sua análise:

  1. Examine as informações nos gráficos Utilização de thread de interface de usuário e Taxa de transferência visual (FPS) e use as barras de navegação da linha do tempo para selecionar o intervalo de tempo que deseja analisar.

  2. Usando as informações nos gráficos Utilização de thread de interface de usuário ou Taxa de transferência visual (FPS), examine os detalhes nas exibições Análise ou Principais Elementos para descobrir as possíveis causas de qualquer ausência aparente de capacidade de resposta.

Dn263059.collapse_all(pt-br,VS.140).gifLinha do tempo da sessão de diagnóstico

Performance and Diagnostics timeline

A régua na parte superior da página Desempenho e Diagnóstico mostra a linha do tempo para informações analisadas. Essa linha do tempo se aplica aos gráficos Utilização de thread de interface de usuário e Taxa de Transferência visual. Você pode restringir o escopo do relatório arrastando as barras de navegação na linha do tempo para selecionar um segmento da linha do tempo.

A linha do tempo também exibe todas as marcas de usuário inseridas e os eventos de ciclo de vida de ativação do aplicativo.

Dn263059.collapse_all(pt-br,VS.140).gifUtilização de thread de interface de usuário

UI thread CPU utilization graph

O gráfico Utilização de thread de interface do usuário (%) exibe a quantidade relativa de tempo gasto no thread de interface de usuário para estas categorias:

Análise

Indica o tempo gasto no thread da interface de usuário analisando o XAML e recuperando recursos do aplicativo.

Layout

Indica o tempo gasto no thread da interface de usuário definindo o layout dos elementos XAML.

Código do Aplicativo

Indica o tempo gasto no thread de interface de usuário que executa o código do aplicativo (usuário) que não está relacionado à análise nem ao layout.

Outro XAML

Indica o tempo gasto no thread da interface de usuário executando o código de tempo de execução XAML.

Dn263059.collapse_all(pt-br,VS.140).gifTaxa de transferência visual (FPS)

Visual throughput line graph

O gráfico de linhas Taxa de transferência visual (FPS) mostra os quadros por segundo (FPS) na interface de usuário e no thread de composição do aplicativo. Os valores são o que você veria no cromo de um aplicativo quando EnableFrameRateCounter está habilitado.

Dn263059.collapse_all(pt-br,VS.140).gifModo de exibição Análise

Parsing window

O modo de exibição Análise contém um gráfico de barras horizontais dos arquivos XAML carregados e processados na parte selecionada da linha do tempo. Os filhos de um nó de arquivos XAML são arquivos incluídos pelo arquivo do nó. Nós são listados na ordem em que foram carregados. O painel de detalhes exibe esses valores para um arquivo selecionado.

Incluindo e excluindo valores

Duração Exclusiva

O tempo gasto para processar os elementos definidos explicitamente nesse nó.

Duração Inclusiva

O tempo gasto para processar os elementos definidos nesse nó e em todos os nós filho.

Elementos da Interface de Usuário (Exclusivos)

O número de elementos definidos explicitamente nesse nó.

Elementos da Interface de Usuário (Inclusivos)

O número de elementos definidos explicitamente nesse nó e em todos os nós filho.

Dn263059.collapse_all(pt-br,VS.140).gifModo de exibição Principais Elementos

Hot Elements window

O modo de exibição Principais Elementos contém um gráfico de barras horizontais que representa todos os elementos que participam do layout da parte selecionada na linha de tempo. Os elementos são agrupados por modelo e classificados em ordem decrescente pelo tempo que levaram para apresentar o layout.

Os filhos de um nó do elemento são os elementos contidos no elemento do nó pai. Os nós filho também são ordenados pelo momento de layout. A exibição de detalhes exibe os valores de nome e tempo para o elemento selecionado.

Otimizar a capacidade de resposta do XAML

Um dos melhores locais para obter informações sobre como otimizar o desempenho do aplicativo são os tópicos em Práticas recomendadas para aplicativos da Windows Store usando C++, C# e Visual Basic.

Aqui estão algumas ideias sobre como otimizar o desempenho de XAML:

Otimizar a inicialização e a navegação na página

Você pode acelerar a inicialização e a navegação na página do aplicativo examinando com cuidado os arquivos XAML, de recursos e de dados carregados pelas suas páginas. Seu aplicativo pode parecer lento se os arquivos XAML criarem ou referenciarem uma grande quantidade de elementos de interface de usuário desnecessários quando a página for carregada pela primeira vez, se forem carregados arquivos de recursos que referenciem modelos e estilos não aplicáveis à página atual ou se o mesmo arquivo XAML ou de recursos for carregado mais de uma vez. Consulte as técnicas para corrigir esses problemas em um destes tópicos:

Otimizar movimento panorâmico e rolagem

Os problemas de desempenho de movimento panorâmico e rolagem podem ser causados por não usar um contêiner de virtualização, modelos que sejam grandes e complexos ou algoritmos ineficientes em métodos personalizados de retorno de chamada por quadro. Consulte as técnicas para corrigir esses problemas em um destes tópicos:

Otimizar a capacidade de resposta de entrada

Para técnicas para tratar desses problemas, consulte Manter o thread da interface do usuário responsivo (aplicativos da Windows Store usando C#/VB/C++ e XAML)