Modo de desenvolvedor developer-mode
Ao editar páginas em AEM, vários modos estão disponíveis, incluindo o modo Desenvolvedor . Isso abre um painel lateral com várias guias que fornecem ao desenvolvedor informações sobre a página atual. As três guias são:
- Componentes para exibir informações sobre estrutura e desempenho.
- Testes para executar testes e analisar os resultados.
- Erros para ver qualquer problema que esteja ocorrendo.
Isso ajuda um desenvolvedor a:
- Discover: quais páginas são compostas.
- Depuração: o que está acontecendo onde e quando, o que por sua vez ajuda a resolver os problemas.
- Teste: O aplicativo se comporta conforme esperado.
- Está disponível somente na interface habilitada para toque (ao editar páginas).
- Não está disponível em dispositivos móveis ou janelas pequenas no desktop (devido a restrições de espaço).
- Isso ocorre quando a largura é inferior a 1024px.
- Está disponível somente para usuários que são membros do
administratorsgrupo.
- em uma instância do autor usando nosamplecontent run-mode
- uma instância de publicação
- Artigo da Base de conhecimento, Solução de problemas AEM TouchUI, para obter mais dicas e ferramentas.
- Sessão AEM Gems sobre Modo de desenvolvedor do AEM 6.0.
Abrir o Modo de Desenvolvedor opening-developer-mode
O modo Desenvolvedor é implementado como um painel lateral para o editor de páginas. Para abrir o painel, selecione Desenvolvedor no seletor de modo na barra de ferramentas do editor de páginas:
O painel é dividido em duas guias:
-
Componentes - Mostra uma árvore de componentes, semelhante à árvore de conteúdo para autores
-
Erros - Quando ocorrem problemas, os detalhes são mostrados para cada componente.
Componentes components
Isso mostra uma árvore de componentes que:
-
Descreve a cadeia de componentes e modelos renderizados na página (SLY, JSP, etc.). A árvore pode ser expandida para mostrar o contexto na hierarquia.
-
Mostra o tempo computacional do lado do servidor necessário para renderizar o componente.
-
Permite expandir a árvore e selecionar componentes específicos dentro da árvore. A seleção fornece acesso aos detalhes do componente; como:
- Caminho do repositório
- Links para scripts (acessados no CRXDE Lite)
-
Os componentes selecionados (no fluxo de conteúdo, indicado por uma borda azul) serão realçados na árvore de conteúdo (e vice-versa).
Isso pode ajudar a:
- Determine e compare o tempo de renderização por componente.
- Consulte e entenda a hierarquia.
- Entenda e melhore o tempo de carregamento da página ao encontrar componentes lentos.
Cada entrada de componente pode mostrar (por exemplo):
-
Exibir detalhes: um link para uma lista que mostra:
- todos os scripts de componente usados para renderizar o componente.
- o caminho do conteúdo do repositório para esse componente específico.
-
Editar script: um link que:
- abre o script de componente no CRXDE Lite.
-
Expandir uma entrada de componente (cabeça de seta) também pode mostrar:
- A hierarquia no componente selecionado.
- Tempos de renderização do componente selecionado de forma isolada, quaisquer componentes individuais aninhados dentro dele e o total combinado.
/libs. No entanto, esses são apenas para referência, você não deve edite qualquer item em /libs, como qualquer alteração feita, pode ser perdida. Isso se deve ao fato de que essa ramificação está sujeita a alterações sempre que você atualiza ou aplica um hotfix/pacote de recursos. Quaisquer alterações necessárias devem ser feitas em /apps, consulte Sobreposições e substituições.Erros errors
Espero que a variável Erros sempre estará vazia (como acima), mas quando ocorrerem problemas, os seguintes detalhes serão mostrados para cada componente:
- Um aviso se o componente gravar uma entrada no log de erros, juntamente com detalhes do erro e links diretos para o código apropriado no CRXDE Lite.
- Um aviso se o componente abrir uma sessão de administrador.
Por exemplo, em uma situação em que um método indefinido é chamado, o erro resultante será mostrado na função Erros guia :
A entrada de componente na árvore da guia Componentes também será marcada com um indicador quando ocorrer um erro.