Please note, this is a STATIC archive of website developer.mozilla.org from November 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Configurações do Desenvolvedor para Firefox OS

O painel do desenvolvedor fica dentro do aplicativo de configurações do Firefox OS. Este painel oferece uma série de opções que podem tornar a depuração de sua aplicação web no Firefox OS mais fácil. Este artigo aborda as opções disponíveis e como fazer uso deles.

O painel de configurações para as opções de desenvolvedor é intencionalmente "trancando a sete chaves" para evitar que os usuários finais que não têm necessidade de fazer uso dessas opções, inadvertidamente, realizem a ativação de opções que farão o dispositivo funcionar mais lentamente ou adicionar efeitos visuais estranhos as suas telas. O painel é algo como isto (o que se segue é uma captura de tela retirada de um Geeksphone Keon com Firefox OS 2.0 em abril de 2014, a sua versão pode apresentar algumas diferenças):

O painel de desenvolvedor é acessado da seguinte forma:

  • Em versões inferiores ao Firefox OS 1.4, você pode abrir o painel do desenvolvedor via Configurações > Informações do Dispositivo > Mais Informações > Desenvolvedor.
  • Em versões superiores ao Firefox 1.4, você pode abrir o painel do desenvolvedor via Configurações > Informações do Dispositivo > Mais Informações > Marque a caixa de menu desenvolvedor. Feito isso, você pode acessar o painel do desenvolvedor via Configurações > Desenvolvedor.

As seções a seguir abordam cada uma das opções presentes no painel do desenvolvedor. Explicando o que elas fazem e descrevendo suas utilidades.

Nota do tradutor: Nem todas as opções de configuração estão traduzidas na versão em Português-BR dos dispositivos. Os títulos das opções a seguir estão de acordo com os títulos encontrados no dispostivo.

Configurações das ferramentas de desenvolvimento

Depurando via USB

A opção "Depuração Remota" habilita o suporte para depurar remotamente seu dispositivo Firefox OS. Isso também habilitar os comandos ADB. Nas versões anteriores à 1.4 existe somente um checkbox, no Firefox 1.4 existem três opções disponíves em uma select box:

  • Desabilitado: Depuração remota desligada (padrão)
  • Somente ADB: Possibilita acesso ao dispositivo pelo ADB.
  • ADB e Devtools: Possibilita acesso ao dispositivo pelo ADB e pelas ferramentas de desenvolvimento do Firefox como o App Manager.

HUD (Head Up Display) do desenvolvedor

Disponível nas versões Firefox OS 1.4 e posteriores.

Existe um checkbox que você pode usar para habilitar ou desabilitar o HUD do Desenvolvedor (uma seção no tipo da Interface do Usuário do Firefox OS para mostrar informações para o desenvolvedor). São cinco checkboxes a serem habilitados ou desabilitados:

  • Log changes in adb: Habilita o log de alterações do dispositivo no adb logcat.
  • Warnings: Mostra avisos do console.
  • Errors: Mostra erros do console.
  • Security issues: Mostra potenciais falhas de segurança.
  • Reflows: Mostra refluxos quando ocorrem.
  • Jank/Jank threshold: Notifica o usuário sobre ocorrências de alto jank (demora visível na renderização) o valor indica o limiar para o qual pode ser customizado.
  • Frames per second: Mostra frames por segundo como explicado na seção Frames_per_second.
  • Time to load: Mostra o tempo para carregar a informação como explicado na seção Time_to_load.
  • App memory: Mostra o quanto de memória o aplicativo está utilizando, e possibilita habilitar ou desabilitar os diferentes fatores de uso da memória. Veja a seção App_memory para maiores detalhes.

Frames per second

Ao habilitar essa opção serão apresentados três números no canto superior esquerdo da tela do Firefox OX, os valores são a média dos últimos resultados dentro de uma janela de tempo, podem ser considerados valores instantâneos com uma boa margem de erro. 

  • O número da esquerda é a taxa de composição (composition rate): número estimado de vezes por segundo que o Firefox OS desenha frames no framebuffer do hardware. É uma estimativa da percepção do usuário do framerate, e somente uma estimativa. Por exemplo, o contador pode reportar 60 composições por segundo mesmo sem a tela ter sido alterada. Nesse caso a percepção do usuário poderia ser 0. Porem, quando utilizado com esta ressalva e corroborado com outras medidas, o monitor pode ser uma ferramenta útil e simples.
  • O número do meio é a taxa de transação da camada (layer transaction rate): número estimado de vezes por segundo que o processo monta a tela e notifica o compositor. Esse número é mais útil para os engenheiros da plataforma Gecko, e deve ser menor ou igual à taxa de composição apresentado à esquerda.
  • O número à direita é uma medida do número de pixels desenhados como um percentual do tamanho da tela. Por exemplo, o número 273 indica que a tela é escrita 2,73 vezes. Idealmente esse número deve estar o mais próximo de 100.

A screenshot of Firefox OS, showing three numbers in the top left hand corner that are measurements of app framerate.

Time to load

Firefox OS também tem uma ferramenta que ajuda a medir o tempo de inicialização, especificamente o tempo do "first paint". O valor apresentado pela ferramenta — no canto superior direito da tela do Firefox OS — é o tempo decorrido (em milisegundos) entre o lançamento da aplicação mais recente e o momento estimado de quando a aplicação foi desenhada na Interface do Usuário. Esse número é aproximado ao real tempo de "first paint", e é particularmente subestimada. Porem, ao baixar este número quase sempre indica no tempo de inicialização real, por isso pode ser útil para medir melhorias na otimização.

A screenshot of Firefox OS, showing a number in the top right hand corner that is a measurement of the current app startup time, in milliseconds.

App memory

Mostra o quanto de memória o aplicativo está usando e possibilita habilitar ou desabilitar os diferentes itens que usam memória para mostrar o quanto de memória cada item desses usa no aplicativo corrente. Por exemplo, de acordo com a configuração apresentada na tela abaixo só será mostrado o uso de memória por objetos JS. O número no canto inferior direito indica que o aplicativo de configuração está usando 414.778KB para objetos JS.

Piscar área desenhada

Nesse modo, toda vez que uma região da tela é desenhada pelo Gecko, acontece uma piscada de uma cor randômica translúcida sobre a região desenhada. Idealmente, somente as partes da tela que mudaram visualmente piscarão com a nova cor. Mas algumas vezes uma área maior é necessária ser redesenhada, causando uma piscada em áreas maiores. Esse sintoma pode indicar que o código da aplicação está forçando uma atualização da tela maior que o necessário. Isso também pode indicar um bug no próprio Gecko.

A screenshot of Firefox OS with a number of transparent overlays, showing the parts of the screen repainted with each new animation frame.

Configurações gráficas

Habilitar APZ para todo conteúdo (era Async Pan/Zoom)

Quando habilitado, o módulo Async Pan/Zoom permite pan e zoom assíncrono, em outra thread, com algumas diferenças perceptíveis no comportamento de renderização. Para saber mais, leia o artigo MozillaWiki APZ.

Tiling (era Layers: Enable tiles)

Introduzido no Firefox OS 1.4, esse recurso possibilita o desenho do conteúdo na tela em pedaços pequenos ("tiles") ao invés de desenhar a tela inteira de uma vez. Isso é útil para a área de QA (Quality Assurance) da plataforma envolvendo a redução de checkerboarding e encontrando janalas de regressão.

Simple tiling (era Layers: Simple tiles)

Inverte entre as duas implementações diferentes do desenho de conteúdo descritos na seção acima.

Hardware composer (era Enable hardware compositing)

Quando habilitado, faz o dispositivo usar o Hardware Composer para compor elementos visuais (superfícies) na tela.

Draw tile borders (era Layers: Draw tile borders)

Muito similar à opção Draw layer borders, a diferença é que nessa opção são desenhadas bordas para os "tiles" individuais bem como as bordas ao redor das camadas.

Mostrar layers

Desenha uma borda brilhande e colorida ao redor das diferentes camadas desenhadas na tela — bom para diagnosticar problemas de layout.

A screenshot from Firefox OS showing an opened select form with the draw layers borders option enabled, resulting in colored borders being drawn on all the different rendered layers.

Dump layers tree

Essa opção faz uma cópia da árvore de camadas do compositor a ser enviado para o logcat a cada camada (layer) composto na tela. Isso é útil para verificar a performance gráfica da plataforma.

Cards View: Cópia de tela

Quando habilitado, cópias de tela serão feitas quando o usuário entrar na visão de cartões para visualizar os aplicativos abertos. Se desabilitado, ícones das aplicações serão mostrados no centro de cartões em branco durante a visão de cartões.

Configurações do gerenciamento de janelas

Botão Home por Software

Essa opção cria um botão Home por software que possui a mesma funcionalidade que o seu equivalente externo. A intenção é o uso em dispositivo que provavelmente não venham com botões externos, como em tablets.

Gesto para tela de início ativado

Ao habilitar essa opção o usuário pode arrastar o dedo do centro para fora da tela para abrir a tela de início. Isso fornece a mesma funcionalidade que o botão externo caso ele não esteja disponível.

Gesto de canto

Ao habilitar essa opção o usuário pode arrastar o dedo para esquerda ou direita a partir dos cantos para o centro para navegar entre as páginas (como acontece nas páginas do seu navegador, ou visões dentro de um aplicativo). Basicamente funciona como a barra de navegacão do Firefox.

Continuous transition

Possibilita você decidir se o teclado abra imediatamente ou continuamente (com uma transição). Desabilitar os efeitos da transição é útil para equipamentos low-end uma vez que pode degradar a performance.

App transition

Habilita ou desabilita transições ao iniciar ou encerrar um aplicativo. Sem a transição os aplicativos serão apresentados imediatamente sem uma animação suave bem como o teclado. Assim como o item anterior, ao desabilitar os dispositivos low-end terão uma performance melhor.

App suspending

Se habilitado, quando um aplicativo for encerrado em segundo plano, ele permanecerá no histórico e será reaberto quando você abrí-lo na tela inicial ou visão de cartões. Se desabilitado os aplicativos não serão mantidos no histórico ou na visão de cartões.

Configuração de depuração

Reg. animaçõe lentas

Essa ferramenta tenta ajudar aos desenvolvedores entenderem porque as animações não são transferidas ao compositos para serem executadas o mais eficientemente possível. Registra "bugs" como tentar animar elementos que são muito grandes, ou tentar animar propriedades CSS que ão podem ser transferidas. As mensagens que você receberá no dispositivo são semelhantes a essas:

I/Gecko   ( 5644): Performance warning: Async animation disabled because frame size (1280, 410) is bigger than the viewport (360, 518) [div with id 'views']

Saída Wi-Fi para adb

Ao habilitar essa opção informações sobre Wi-Fi são incluídas nos logs do adb (logs de erro podem ser acessados pelo console usando adb logcat | grep "Error")

Bluetooth output in adb

Ao habilitar essa opção informações sobre Bluetooth são incluídas nos logs do adb (logs de erro podem ser acessados pelo console usando adb logcat | grep "Error")

Console ativado

Quando habilitado, essa opção permite usar o Web Console no Firefox para acessa remotamente o console do dispositivo, sem essa opção habilitada, a função console.log() não faz nada.

Gaia debug traces

Isso habilita diretamente DEBUG traces no Gaia; veja bug 881672 para mais detalhes.

Note: Infelizmente, nem todo aplicativo suporta esse mecanismo para gravar seu log de depuração. Ao invés disso, eles controlam a opção "DEBUG" diretamente no código, assm, ao habilitar essa opção não há como garantir que serão gerados todos os logs de depuração.

Show accessibility settings

Habilitar o menu de configurações de acessibilidade, que poderá ser acessado em Configurações > Accessibilidade. As opções são as seguintes:

Leitor de Tela

Essa opção transforma o Firefox OS em um leitor de tela. Atualmente em um estágio inicial ele altera o modo que os eventos de toque funcionam. Quando o leitor de tela está habilitado você pode interagir com a tela das seguintes maneiras:

  • Toque em qualquer lugar para transferir o foco para o aplicativo e seja avisado do que ele é. A notificação é feita tanto sonramente como por um retângulo ao redor do item selecionado. Um duplo toque em qualquer lugar da tela (dois toques numa rápida sucessão) ativa o ítem rodeado pelo retângulo.
  • Arraste o dedo da esquerda para a direita sequencialmente através dos itens na tela faz com que sejam movidos da esquerda para a direita, se for de cima para baixo, inclui um scroll vertical is houver mais itens a serem mostrados, e você será alertado do nome de cada item sonoramente e pelo retângulo. Da direita para a esquerda move os itens na ordem reversa. Novamente um toque duplo executa o item selecionado.
  • Arraste com dois dedos — esquerda, direita, para cima ou para baixo — para rolar a tela na direção desejada. Isso é equivalente a arrastar um dedo através da tela quando o leitor de tela não está ativo. Por exemplo, um arrasto com dois dedos para esquerda na tela inicial leva para a segunda tela, o mesmo movimento para cima rolará a tela para mostrar mais conteúdo.

Nota: Se o leitor de tela estiver funcionando e você deseja desabilitá-lo, você deve navegar até as configurações através desses novos gestos e dar um toque duplo no checkbox uma vez para desligá-lo. O que vai restaurar o comportamento da tela sensível ao toque ao seu comportamento padrão.

Nota: No Firefox 1.4 e superior, existe uma maneira rápida para ligar e desligar o leitor de tela. Ele o instruirá para que seja executada a mesma ação novamente (botões volume: cima, baixo, cima, baixo, cima, baixo) para ligar ou desligar.Assim, você pode testar sua aplicação web para acessibilidade sem ter que navegar no menu de preferências a cada vez que quiser alterá-la.

Speech volume

Controle deslizante do volume da voz.

Speech rate

Controle deslizante da velocidade da voz.

Abrir a primeira utilização

Executa o programa de primeira configuração, que nada mais é que conduz o usuário à configurar as opções básicas e um tutorial. É útil quando você quer testar esse processo, ou se você quer reconfigurar seu dispositivo.

Configurações obsoletas

Essa seção apresenta as configurações que não estão mais disponíveis, ou são apresentadas de uma forma diferente, mas pode ser interessante se estiver executando uma versão antiga do Firefox OS.

Accessibilidade

Nas versões anteriores à 1.4, essa opção apresentava as configurações explicadas na seção Show_accessibility_settings.

Grid

Quando habilitada, a tela do Firefox era sobreposta por um grid padrão que ajudava o posicionamento e alinhamento dos itens. Abaixo um exemplo da tela com o grid ativado.

As linhas mais largas são separadas por 32 pixels, tanto horizontal quanto verticalmente.

Show frames per second

Nas versões anteriores à 1.4 ao  habilitar essa opção mostrava os frames por segundo como explicado na seção Frames_per_second.

Show time to load

Nas versões anteriores à 1.4 ao  habilitar essa opção mostrava o tempo para carregar a informação como explicado na seção Time_to_load .

Rocketbar enabled

Nas versões anteriores à 1.4, essa opção habilita o novo Firefox Rocketbar no seu dispositivo, que fornece uma nova forma de trocar entre aplicativos, procurar e mais. Você pode encontrar um ícono no canto superior esquerdo do dispositivo e o RocketBar pode executá-lo arrastando do canto superior esquerdo para o canto inferior esquerdo.

Nota: Nas novas versões do Firefox OS, Rocketbar é habilitado automaticamente e não pode ser desabilitado.

Contacts debugging output in adb

Ao habilitar essa opção informações sobre contatos são adicionadas ao log do adb (logs de erro podem ser acessados digitando adb logcat | grep "Error" no terminal.)

Progressive paint (era Layers: Progressive paint)

Essa opção foi introduzida para ajudar a depuração do módulo Async Panning/Zoom module (APZ) durante sua implementação. Agora que a implementação está pronta, essa opção está obsoleta e será removida das próximas versões (veja bug 1003228).

Displayport Heuristics

  • Default
  • Center displayport
  • Assume perfect paints
  • Taller displayport
  • Faster paints
  • No checkerboarding

Essas opções foram introduzidas para ajudar a depuração do Async Panning/Zoom module (APZ) durante sua implementação especificamente para possibilitar a equipe de QA testar diferentes heurísticas para verificar qual resultado era o melhor. gora que a implementação está pronta, essa opção está obsoleta e será removida das próximas versões (veja bug 1003228).

Keyboard layouts

Adicionalmente às opções específicas para desenvolvedores as versões anteriores à 1.4 apresentava opções de teclado. Isso permitia a realização de testes dos métodos de entrada do idioma chinês:

No Firefox 1.4, essas opções foram removidas. Isso é porque a implementação de layout de teclados chineses (zhuyin and pinyin) não terminaram.

Note: Para outros layoutes de teclado que ainda estão em desenvolvimento, como o japonês por exemplo, existe uma opção em tempo de compilação para incluí-los na imagem.

 

Etiquetas do documento e colaboradores

 Colaboradores desta página: jwhitlock, rbrandao, IvomarS
 Última atualização por: jwhitlock,