Browsers — qual você deve utilizar?
Chrome, Firefox, Safari, IE (?) … São várias opções — qual delas você deve escolher?
Se você é um usuário comum, geralmente sua escolha estará baseada no browser que melhor se adapta a sua navegação e que tenha um visual atraente; se você é um desenvolvedor web (principalmente um front-end), sua escolha deveria ser: todos!
Sim, todos! Afinal de contas, seu usuário pode utilizar mais de um browser — por exemplo, o Firefox no computador e o Safari no iPhone; e a renderização dos seus códigos CSS e JS são, muitas vezes, beeeeeem distintas. Então, como desenvolvedor, você precisa estar preparado para todas as possibilidades que dizem respeito a browsers!
Quando eu comecei no mundo do desenvolvimento web — cerca de uns 5 anos atrás, eu utilizava muito o Firefox, tanto para desenvolvimento como para meu uso normal. Naquela época, o Chrome não era tão bom para desenvolvimento e o Firebug era o que existia de melhor para debugar código e inspecionar elementos.
Mas recentemente, o console do Chrome (chamado de DevTools) evoluiu muito e até deixou o Firefox um pouco para trás.
Inclusive, o Firefox ficou tão para trás que a Mozilla refez toda a parte de desenvolvimento do Firefox e hoje ele compete de igual para igual. Você consegue se virar bem utilizando o Firefox para desenvolver sem precisar utilizar mais o Firebug.
Outro ponto muito interessante para se observar, são os “browsers beta", também chamados de developers' edition. É o caso do Canary (Chrome), Firefox Quantum, Safari Technology Preview…
Esses browsers recebem muito mais atualizações, comparado as edições "regulares", então eles conseguem dar suporte para novas specs de CSS e JS muito antes delas estarem presentes nas versões estáveis.
É claro, esses browsers também apresentam uma quantidade um pouco maior de bugs, por conta do número de atualizações; porém, se você quer experimentar coisas recém lançadas, eles são a melhor escolha!
Existem ainda os "browsers menores", que não são tão conhecidos e que utilizam os motores de renderização dos gigantes (a maioria é baseada no Chromium), porém possuem tamanhos e consumo de memória otimizados. Podemos citar aqui o Brave, Spark…
O Brave, inclusive, foi criado Brendan Eich — nada menos do que o criador do JavaScript e co-fundador da Mozilla!
Para a web moderna, é impossível você criar um site ou sistema web testando apenas em um browser, ou em uma versão. Hoje, em muitos sites, os acessos realizados por mobile devices é, por incrível que pareça, maior do que os acessos realizados por computadores desktop.
Você não pode ficar preso a versão xyz do navegador específico. Aliás, se você faz isso, não pode se considerar um desenvolvedor moderno! Porém, isso vai depender também do suporte que você quer/precisa dar no seu projeto.
Ferramentas como o Google Analytics podem te ajudar muito na descoberta e análise das taxas de conversão e acesso, dividindo em categorias como tipo de device, sistema operacional, versão do browser, localização…
Vou deixar aqui uma breve lista com alguns browsers e suas melhores características. Vale a pena dar uma olhada:
1 — Chrome
Talvez o browser mais conhecido, é multi-plataforma e utiliza o melhor engine para JS disponível, a V8. Possui diversos plug-ins, extensões e temas para deixar a sua experiência ainda mais confortável.
Em questões de desenvolvimento, possui um dos melhores consoles disponíveis e também disponibiliza uma versão beta, o Canary.
2 — Firefox
O primeiro browser de muitos developers, utiliza menos memória que o Chrome e é tão bom quanto. Sua navegação privativa é muito aprimorada e também possui várias extensões, plug-ins e temas para customização.
Para os devs, disponibiliza a edição Firefox Quantum.
3 — Opera
Um navegador alternativo que se tornou muito popular, o Opera também utiliza o Blink e o V8 e é multi-plataforma. Agora, ofere um serviço de VPN gratuito e um ad-blocker embutido. Possui também um excelente serviço de conversão de moedas on-the-fly.
Para os devs, oferece o Dragonfly como dev tools.
4 — Safari
O browser oficial da Apple. Multi-plataforma, é absurdamente mais rápido em devices da Apple (comparado com outros browsers). Também possui diversas extensões para customizar sua experiência de navegação.
Para os devs, oferece a versão Technology Preview.
5 — Brave
Encabeçado por Brendan Eich, também é multi-plataforma e extremamente focado em performance e segurança. O seu ad-blocker embutido possui um diferencial — ele apenas remove os anúncios de sites que espionam o comportamento e o histórico do usuário. É basado no Chromium.
6 — Spark
O browser da Baidu, possui algumas funcionalidades que são acessadas apenas com movimentos do mouse, sem a necessidade de cliques. Possui sincronização de dados com a sua conta Google e também diversas customizações por temas e plug-ins.
7 — Midori
Outro browser extremamente focado em performance, utiliza o WebKit e é totalmente open-source. Também possui grandes níveis de customização e um otimizador para downloads (isso dependerá muito também da sua conexão).
8 — IceDragon
Outro browser focado em performance e de fácil uso. Criado pela Comodo, é baseado no Firefox e possui diversas integrações com os plug-ins e extensões da raposa. Utiliza pouca memória da máquina e possui diversos widgets focados em segurança.
9 — Vivaldi
Focado também em performance e extremamente leve, o Vivaldi possui vários widgets como notas, dashboards, speed dial, pilhas, aliases para marcadores…
Sua interface é altamente customizável, tanto por temas quanto por você poder escolher quais elementos e onde eles estarão posicionados.
Menções Honrosas
Aqui vai um compilado de vários browsers secundários, que você deve conhecer (pelo menos):
- Min
Browser open-source e feito com JavaScript, conta com um design minimalista e conta com algumas opções bem interessantes de ad-blocker e privacidade — obrigado Lucas Saliés Brum pela menção! - Opera GX
Browser focado para jogos, altamente customizável e conta com controladores de RAM e CPU; alem de uma integração direta com o Twitch e um ad-blocker nativo (sem precisar de nenhuma extensão) — obrigado Lucas Saliés Brum pela menção!
Internet Explorer
Nessa publicação, não citei o IE nem o Edge porque, na minha opinião, eles não fazem parte da web moderna e, infelizmente, estão caminhando para a irrelevância — o tempo é para todos.
Segundo uma pesquisa feita em março do ano dessa publicação (2018), apenas 15,4% dos computadores no mundo ainda utilizam o IE, e cerca de 10% utilizam o Edge.
Navegadores da Microsoft podem estar caminhando para a irrelevância — http://idgnow.com.br/internet/2018/03/02/navegadores-da-microsoft-caminham-para-a-irrelevancia/
Mas, mesmo assim, ainda tem gente que utiliza esses browsers, então se você precisa dar suporte para legacy browsers, fique atento para os vendor prefixes e polyfills.
Outra excelente referência que você pode (e deve) utilizar durante o desenvolvimento é o Can I Use, que contém informações sobre o suporte de diversas specs de elementos/atributos HTML, propriedades CSS e funcionalidades/APIs do JavaScript.
Você também pode utilizar ferramentas para testes em múltiplos browsers e plataformas, como o BrowserStack e o Browsersync.
A web é um imenso oceano azul de oportunidades, e como está escrito na imagem dessa publicação — explore!
