Estado em navegadores

Todo o HTML e o CSS que escrevemos ganha vida dentro dos navegadores utilizados por quem acessa nossas páginas e sites, por isso é bastante importante ter um bom entendimento de como eles funcionam e, principalmente, dos buracos no meio do caminho. Desde os tempos do Mosaic (que eventualmente se tornou o Netscape) e das primeiras versões do Internet Explorer em 1995 sempre enfrentamos uma guerra de incompatibilidade entre os navegadores e a necessidade de padrões para garantir a interoperabilidade da web entre clientes diferentes. Enquanto essa briga pode custar horas de desenvolvimento, ela também impulsiona a evolução das tecnologias que fazem os navegadores funcionar. O Google Chrome, por exemplo, mudou a perspectiva sobre o processo de atualização contínua, garantindo que a maioria dos seus usuários possua a última versão do navegador, o Firefox também começou a adotar um processo similar. E o componente de debug e inspeção do Firefox, o Firebug, definiu o modelo básico para que os outros navegadores implementassem ferramentas similares.

Atualmente, o Google Chrome costuma ser o campeão dos testes de compatibilidade com as últimas especificações, sempre seguido de perto das últimas versões do Firefox, Safari e Opera. Boa parte das inclusões do HTML5 e CSS3 já está disponível nesses navegadores por completo ou através de prefixos proprietários. O Internet Explorer, atualmente na versão 9, ainda se encontra bem atrás dos demais, mas as promessas para a sua próxima versão são interessantes.

Os perigos moram nos casos onde precisamos ir além das últimas versões e trabalhar com mais antigas, como versões do Firefox anteriores a 8 e os famigerados Internet Explorer 6 e 7. A diferença entre os navegadores e a performance do JavaScript em comparação com as suas últimas versões é assombrosa, mas em alguns casos a audiência desejada se mantém presa a esses navegadores, por complicações para se atualizar o navegador ou até o sistema operacional – As últimas versões do Internet Explorer não são compatíveis com o Windows XP por exemplo, o que atrapalha a atualização em alguns ambientes corporativos.

Por isso, é importante definir as fronteiras dos navegadores que você pretende trabalhar, e se aproveitar das técnicas adequadas ou das soluções existentes para problemas relacionados a eles.

Para quem está acompanhando a crista da onda, diversas propriedades e funcionalidades novas não se encontram completamente definidas e implementadas nos navegadores, mas isso não nos impede de utilizar versões “experimentais” delas. Para isso, cada navegador costuma expor essas novidades com prefixos específicos para diferenciar da implementação final. O que a princípio pode soar como uma ótima ideia, se tornou um fardo para todos os desenvolvedores: escrever as mesmas linhas de CSS (até) quatro vezes, assim:

.button {

/* Prefixo para o Firefox. */

-moz-transition: all 0.2s linear;

/* Prefixo para o Chrome, Safari, Safari Mobile e Android. */

-webkit-transition: all 0.2s linear;

/* Prefixo para o Opera. */

-o-transition: all 0.2s linear;

/* Versão final, ainda nao suportada em todos os browsers */

transition: all 0.2s linear;

}

Enquanto hacks como esse podem parecer desnecessários e culpados por sujar o código, é preciso entender a importância deles. Já estamos desfrutando e testando essas propriedades enquanto elas são definidas e refinadas. O objetivo é, eventualmente, não precisar mais das versões prefixadas e se utilizar apenas a versão canônica das propriedades.

Para isso, levam-se em consideração dois itens: Mantenha-se atualizado sobre o suporte dos navegadores para novas funcionalidades, que possui a relação de navegadores com suporte completo, parcial ou inexistente. Outro ponto importante é que você deve mitigar ou automatizar o ruído e retrabalho gerado pelo uso de prefixos, seja com soluções como pré-processadores ou ferramentas em JavaScript, e focar o seu trabalho no que é tido como padrão, pois em algum momento os prefixos não serão mais necessários.

1

Source: scriptcase / Estado em navegadores

Comments

comments

Greg

Old school developer with a passion for food, bikes and a whole lot of weird things.

Leave a Reply

Your email address will not be published.