A história dos desenvolvedores da Web vinculados ao desenvolvimento de navegadores

Os desenvolvedores da Web são os construtores de páginas da Web como esta. Considere como estamos colaborando aqui: você, do lado da leitura, e eu, nos tornando um escritor melhor com o apoio de um editor do HackerNoon.

Você vê os desenvolvedores? Provavelmente não, pois eles fizeram um bom trabalho. É provável que os encontremos lendo sobre o futuro do desenvolvimento web .

O que ofereço com este artigo, por outro lado, é uma oportunidade de fazer uma pausa e refletir sobre o surgimento de desenvolvedores da Web, como isso se relaciona com a história dos navegadores e como sua colaboração reacendeu a linha do tempo do desenvolvimento de navegadores.

Um novo tipo de engenheiro, para a web

Nos primórdios da web, muitos engenheiros de software não prestavam muita atenção ao desenvolvimento da web em termos de páginas da web. Por que eles, certo? Se você fosse um engenheiro, ficaria impressionado com o primeiro passageiro saindo da locomotiva ou com a própria locomotiva?

Jason Kottke , do Home of Fine HyperText Products , escreveu bem:

Usar o NCSA Mosaic para navegar na World Wide Web pela primeira vez no laboratório de física do porão da faculdade foi o mais próximo de uma experiência religiosa que já tive. Foi um raio que mudou completamente a minha vida.

Mas essa primeira impressão também permitiu que hackers (e pintores) abordassem o assunto a partir do aspecto da interface do usuário. Portanto, a invenção e a inovação do navegador Mosaic marcam o início das oportunidades com o desenvolvimento web:

No início de 1993, o Centro Nacional de Aplicações de Supercomputação (NCSA) da Universidade de Illinois lançou uma primeira versão de seu navegador Mosaic. Este software rodava no ambiente X Window System, popular na comunidade de pesquisa, e oferecia interação amigável baseada em janela. Pouco tempo depois, o NCSA lançou versões também para os ambientes PC e Macintosh. A existência de navegadores confiáveis e fáceis de usar nesses computadores populares teve um impacto imediato na disseminação da WWW.

Observe como o navegador, como ferramenta, começou a fazer muito sentido, pois a infraestrutura por trás mostrou o potencial:

Em 30 de abril de 1993, o CERN disponibilizou o código-fonte da WorldWideWeb sem royalties, tornando-o software livre. No final de 1993 havia mais de 500 servidores web conhecidos, e a WWW representava 1% do tráfego da internet, o que parecia muito naquela época (o resto era acesso remoto, e-mail e transferência de arquivos).

Foi uma experiência surreal por causa daquela interface amigável que mostrava o potencial de acesso ao conhecimento de qualquer lugar. Talvez não diferente de como me senti ao usar o ChatGPT como uma interface amigável que mostrava o potencial de acesso ao conhecimento de qualquer lugar. Considere ler sobre a história do mosaico e a invenção da Web no seguinte artigo:

View-source: Aprenda copiando exemplos

Mas as páginas da web eram bastante simples. Na época, nós - estudantes de ciência da computação - encontraríamos pessoas inteligentes pela forma como suas páginas eram simples, como esta de Dennis Ritchie no Bell Labs .

Como eu estava ali como um usuário curioso - não assistindo às aulas de informática e brincando com a web - também me deparei com uma opção de menu, incorporada ao navegador , que permitia visualizar o código-fonte das páginas da web. A propósito, quase da noite para o dia aquele navegador Mosaic se chamava Netscape.

Jim Nielsen refletiu em The Spirit of View-Source e identificou como o navegador Netscape permitiu uma oportunidade de aprendizado - instantaneamente - para cada página da web.

Em seu artigo, ele citou uma observação de Clive Thompson no livro Coders

Cada página da web que você visitou continha o código mostrando como foi criado. A internet inteira se tornou uma biblioteca de guias de instruções sobre programação.

Agora, tente imaginar “a web” como a coisa mais quente que existe e imagine quantos de nós estávamos verificando a fonte das páginas para copiar ideias de outras pessoas e tentar aprender eventualmente. Esses foram os “dias de visualização da fonte” em que pudemos ver a mágica.

Embora ainda tenhamos o “exibir fonte da página” no menu dos navegadores modernos, se você visualizar a fonte de uma página da web, provavelmente verá algo que parece misterioso:

JavaScript: controle e interação

Outro ponto de inflexão, bem percebido, surgiu quando o Netscape (novamente) habilitou o JavaScript - a linguagem de programação - que permitia aos desenvolvedores web criar scripts para controlar certos aspectos das páginas web e ter controle sobre a interação.

Brendan Eic h, o inventor do JavaScript e agora CEO da Brave Software, The Browser That Cares about your Privacy , nos deu um slide que resume a jornada do herói do JavaScript na terra da Web. Seus pontos nos ajudam a ver que o JavaScript nem sempre foi visto como elegante, mas estava sendo muito usado no final do dia - e continuou a melhorar.

A captura de tela a seguir mostra uma caixa de alerta invocada a partir da interface do navegador Netscape 2. Os desenvolvedores da Web usaram JavaScript para lançar alertas visuais (para depurar seu código) e fazer coisas impossíveis, como controlar formulários da Web, validar o valor de um formulário de entrada e outros casos de uso.

Desnecessário dizer que um usuário curioso pode aprender sobre JavaScript em uma página por meio de “visualizar código-fonte”. A página HTML era o envelope que transmitia uma grande quantidade de apresentação e estrutura lógica sobre sites por meio de seus elementos HTML, hiperlinks, imagens, estilo e código JavaScript.

HTML dinâmico: personalizações de layout e animação

E outra oportunidade foi habilitada através de uma nova tag em HTML chamada <layer> . Naquela época, por volta de 1997, a Netscape lançou o Netscape Communicator Preview Release com novas APIs para desenvolvedores. De acordo com um comunicado à imprensa, “o HTML dinâmico é um marco significativo para o HTML, fornecendo aos designers mais flexibilidade e controle sobre o layout da página da Web, ao mesmo tempo em que oferece aos usuários um maior grau de interatividade. ”

Mais tarde, a tag <layer /> tornou-se <div />. A inovação técnica da época tinha a ver com a capacidade de posicionar uma peça visual de HTML, um elemento, em cima de outro, como mostra a ilustração 3D a seguir de uma das primeiras notas técnicas de DHTML .

Por enquanto, você não poderá experimentar a seguinte demonstração de 1997, mas tente imaginar aquele trem (que era apenas uma imagem) se movendo como se estivesse vindo em sua direção.

O truque consistia em usar JavaScript para alternar a visibilidade de imagens de tamanhos diferentes, criando a ilusão de uma animação. A página também lançou o som de uma locomotiva usando alguns outros métodos.

Nesse ponto, a guerra dos navegadores no auge, desenvolvedores que começaram a escrever páginas para o Netscape, como eu, começaram a produzir páginas para o Internet Explorer, ao contrário de mim. Essas diferenças - e as habilidades exigidas - contribuíram como motivos para os desenvolvedores serem contratados como desenvolvedores web. A magnitude e a complexidade do movimento DHTML se correlacionam com o conteúdo escrito por este livro popular de mais de 1.000 páginas .

Padrões da Web

Um resultado importante da guerra dos navegadores é que o Netscape lançou seu código-fonte como código-fonte aberto. É aqui que o nome Mozilla aparece, conforme documentado no Project Code Rush . Esse processo era estratégico, complexo e arriscado. Foi uma jogada ousada, conforme reconhecido pelo então CEO Jim Barksdale:

“Bem, certamente espero que a enorme quantidade de novas pessoas que nenhuma empresa poderia pagar para trabalhar em qualquer produto - agora contribuindo para o Netscape Navigator Communicator - faça uma diferença significativa na melhoria do produto. Como isso funciona contra qualquer concorrente, resta saber.” Jim Barksdale @ Code Rush 2013

Além da base de código aberto, uma estratégia chave da Mozilla chamou a atenção dos desenvolvedores da web - seu suporte a padrões da web. Para ajudar com isso, a Netscape montou uma nova equipe de evangelistas de tecnologia. Entre eles, Eric Meyer , o guru do CSS que alcançou o status de celebridade entre os desenvolvedores. Sua causa ressoou com as necessidades dos desenvolvedores da web - acabar com as diferenças proprietárias e ter um terreno comum para implementar páginas que funcionem com todos os navegadores. Eric comemorou nossa luta:

“Então, um brinde a Bob Clary, Marcio Galli, Katsuhiko Momoi, Chris Nalls, Tristan Nitot, Arun Ranganathan, Doron Rosenberg e Susie Wyshak. Lutamos pela boa luta e criamos muito material excelente, incluindo informações sobre o redesenho do próprio DevEdge. “

Tenha em mente que o acima é um pequeno pedaço de uma foto maior. Outra parte disso foram os esforços de documentação da Mozilla, que cresceu mais tarde como Mozilla Developer Network.

Aplicativos de página única e o modo AJAX

À medida que os desenvolvedores se ajudavam a corrigir as páginas da Web de maneira compatível com os padrões, eles também levavam as páginas ao limite. Esses foram os dias em que casos de uso como o Gmail surgiram e iniciativas como os serviços da Web nos permitiram considerar a ideia de aplicativos de página única - e se uma página da Web pudesse funcionar como aplicativos de software? Os seguintes artigos mostram o que os evangelistas estavam escrevendo na época:

• Acessando serviços da Web no Netscape 7.1/Mozilla 1.4 usando proxy WSDL (06 de junho de 2003)
• Widget de índice recolhível baseado em padrões (CTOCWidget) (20 de maio de 2003)
• Inner-Browsing: Extending Web Browsing the Navigation Paradigm (16 de maio de 2003)

Apesar desses esforços, um ponto de inflexão veio também do velho oeste. Em 2005, Jesse James Garrett, de São Francisco, escreveu um artigo seminal intitulado " Ajax: uma nova abordagem para aplicativos da Web", Jesse foi um designer de experiência do usuário que impactou o desenvolvimento da Web em todo o mundo. AJAX tornou-se um termo popular usado por desenvolvedores para transmitir a intenção de adicionar interatividade e criar o comportamento de aplicativos da web.

Se você fosse contratar alguém para criar um aplicativo de página única, teria que contratar um desenvolvedor web que conhecesse AJAX:

O melhor amigo do desenvolvedor - ferramentas complementares do desenvolvedor e inspeção de página

O projeto Mozilla continuou a saga, agora com o Firefox. O Firefox carregou os produtos da Mozilla e alcançou um nível de prontidão em termos de desempenho, segurança e suporte a padrões. Mas o ponto decisivo foi que ele ganhou a confiança dos desenvolvedores não justificada pela participação no mercado, mas por causa das ferramentas integradas que os ajudaram a testar e solucionar problemas de páginas.

Os gerentes de produto nas organizações reconheceram que garantir a compatibilidade com o Firefox (Padrões) era a maneira mais rápida de fornecer páginas ao Internet Explorer.

O Firefox como ferramenta para ajudar a construir páginas - usado por desenvolvedores web - foi um fenômeno mundial, melhor compreendido se você olhar para uma apresentação de 2008 dos contribuidores da Mozilla, Clauber e Mario, intitulada Firefox - Developer's Best Friend.

Em um slide importante, eles declararam a importância de usar o Firefox como uma estrutura de desenvolvimento devido ao seu suporte padrão da Web e complementos de desenvolvimento para depuração de JavaScript e muito mais.

O resto é história - bibliotecas JS e estruturas

Agora, estou louco para falar sobre o que vem a seguir?

Sem chance. Se você é um desenvolvedor web, pode estar sentindo o calor e a complexidade do que sabe que aconteceu. Vamos encerrar essa festa aqui com: Os navegadores evoluíram, as páginas evoluíram, os desenvolvedores também. E dizer que todos os jogadores estão igualmente a contribuir a um ritmo acelerado - demasiado rápido - ao ponto de preferir olhar para o passado e festejar.

Algumas notas são importantes. Uma é que não mencionei os aspectos em termos de servidor. Seria difícil incorporar essa reflexão com estrutura, embora eu reconheça que os desenvolvedores web se ramificaram como front-end, back-end ou fullstack.

Outra é que o momento apontado como “Firefox como o melhor amigo do desenvolvedor” veio em sincronia com o surgimento de bibliotecas que acompanham as páginas da web. Um bom exemplo é a biblioteca jQuery . Portanto, os dias "jQuery + Firefox como os melhores amigos do desenvolvedor" foram realmente um fenômeno em que o código das páginas começou a ficar complexo e exigiu mais papel de engenharia envolvido - mais bugs no lado do cliente das páginas.

Essa observação abriria as portas para considerar o surgimento de bibliotecas como React e, entre outros assuntos, o mundo complexo indicado por The Great Gaslighting of the JavaScript Era.

A imagem principal deste artigo foi gerada peloAI Image Generator do HackerNoon através do prompt "early internet browser".