Como começar a construir um navegador da web? [fechadas]

88

Decidi me esforçar para criar um navegador da Web do zero. Quais são as funções, arquiteturas e recursos comuns dos navegadores da web modernos que devo saber antes de começar?

Quaisquer recomendações são muito apreciadas!

Galilyou
fonte
9
Sim, é um projeto insano, mas não precisamos fazer o mickey aqui - acho que é um ótimo ponto de discussão sobre como você faria isso :)
Ross
8
Lembro-me de um artigo há algum tempo em que alguém lamentou o fato de que ninguém mais tem coragem de construir novos motores de renderização. Novos navegadores são necessários, disse ele, porque os computadores de hoje são diferentes. Vários núcleos. A primeira etapa é o Chrome com 1 processo por guia. Vamos ver o que vem a seguir.
stesch
35
Cultive algumas bolas e faça o que quiser. Se funcionar, ótimo. Se não, continue tentando, do contrário você acabará como a outra metade da sociedade que diz "Não crie nada novo, apenas use a merda quebrada que já temos."
uSeRnAmEhAhAhAhAhA
7
Você precisa de um daqueles comprimidos que Bradley Cooper toma em Limitless . ;)
Ali Gajani,
3
Dê uma chance. Aposto que é muito mais fácil do que as pessoas aqui estão dizendo, especialmente se você conectar muitos componentes existentes. Quão difícil pode ser analisar algum texto e gerar algumas caixas coloridas com texto dentro delas?
Ian Warburton

Respostas:

125

Bem, quebre-o em pedaços. O que é um navegador da Web? O que isso faz? Isto:

  • Busca conteúdo externo. Portanto, você precisa de uma biblioteca HTTP ou (não recomendado) escreva isso você mesmo. Há muita complexidade / sutileza no protocolo HTTP, por exemplo, manipulação de cabeçalhos de expiração, versões diferentes (embora seja principalmente 1.1 atualmente), etc;
  • Lida com diferentes tipos de conteúdo. Existe um registro Windos para esse tipo de coisa que você pode pegar carona. Estou falando de interpretação de conteúdo com base no tipo MIME aqui;
  • Analisa HTML e XML : para criar um DOM (Document Object Model);
  • Analisa e aplica CSS : isso envolve a compreensão de todas as propriedades, todas as unidades de medida e todas as formas como os valores podem ser especificados (por exemplo, "borda: 1px preto sólido" vs as propriedades separadas da largura da borda, etc.);
  • Implementa o modelo visual W3C (e este é o verdadeiro kicker); e
  • Possui motor Javascript .

E isso é basicamente um navegador da Web em poucas palavras. Agora, algumas dessas tarefas são incrivelmente complexas. Mesmo os que parecem fáceis podem ser difíceis. Pegue a busca de conteúdo externo. Você precisa lidar com casos de uso como:

  • Quantas conexões simultâneas usar?
  • Relatório de erro para o usuário;
  • Proxies;
  • Opções do usuário;
  • etc.

A razão pela qual eu e outros estamos levantando nossas sobrancelhas coletivamente é que o mecanismo de renderização é difícil (e, como alguém observou, muitos anos se passaram para seu desenvolvimento). Os principais mecanismos de renderização são:

  • Trident: desenvolvido pela Microsoft para Internet Explorer;
  • Gecko: usado no Firefox;
  • Webkit: usado no Safari e Chrome 0-27;
  • KHTML: usado no ambiente de área de trabalho KDE. Webkit bifurcado de KHTML alguns anos atrás;
  • Elektra: usado no Opera 4-6;
  • Presto: usado no Opera 7-12;
  • Blink: usado no Chrome 28+, Opera 15+, webkit fork;

Os três primeiros devem ser considerados os principais motores de renderização usados ​​hoje.

Os motores Javascript também são difíceis. Existem vários deles que tendem a ser vinculados ao mecanismo de renderização específico:

  • SpiderMonkey: usado no Gecko / Firefox;
  • TraceMonkey: substituirá SpiderMonkey no Firefox 3.1 e introduz a compilação JIT (just-in-time);
  • KJS: usado pelo Konqueror, vinculado ao KHTML;
  • JScript: o motor Javascript do Trident, usado no Internet Explorer;
  • JavascriptCore: usado no Webkit pelo navegador Safari;
  • SquirrelFish: será usado no Webkit e adiciona JIT como TraceMonkey;
  • V8: motor Javascript do Google usado no Chrome e Opera;
  • Opera (12.X e menos) também usou seu próprio.

E, claro, há todas as coisas da interface do usuário: navegação entre páginas, histórico de páginas, limpeza de arquivos temporários, digitação de uma URL, preenchimento automático de URLs e assim por diante.

Isso dá muito trabalho.

cletus
fonte
* Gecko :) Também concordo. As partes principais são o renderizador HTML e o mecanismo JavaScript.
abatishchev
1
Opera criou seu próprio. Presto é o atual e Electra era o anterior.
Tim Sullivan,
Ótima resposta detalhada - esqueci a análise de JavaScript todos juntos!
Ross
1
O mundo, entretanto, precisa de mais pessoas com coragem para construir navegadores. Cp eff.org/deeplinks/2016/04/save-firefox .
Pacerier 01 de
26

Parece um projeto realmente interessante, mas exigirá um enorme esforço.

Não é fácil, mas do ponto de vista acadêmico, você pode aprender muito com isso.

Alguns recursos que você pode verificar:

Mas, vendo de um ponto de vista realista , o enorme esforço necessário para codificá-lo do zero me lembrou esta história em quadrinhos:


(fonte: geekherocomic.com )

Boa sorte :-)

Christian C. Salvadó
fonte
Oh, o GHC continuou? Acho que cancelei a assinatura quando eles começaram a fazer aquela coisa do covil de Ross.
Ross
@Ross: Sim, eles ainda entregam os quadrinhos, aquele cara novo se chama Boris da Rússia, e ele é um "Super Hacker" LOL
Christian C. Salvadó
17

A maioria dos navegadores da web modernos são bestas gigantes e provavelmente foram mal projetados porque eles (e a própria web) evoluíram de forma um tanto desordenada.

Você precisa começar primeiro tornando os objetivos do seu projeto (e o que você espera alcançar) muito explícitos. É algo que você está fazendo apenas para se divertir ou espera que outras pessoas usem seu navegador? Se você espera que outros o usem, qual será o incentivo para eles? Não é realista esperar que você desenvolva um novo navegador do zero que todos possam usar como substituto do Chrome, Safari, Firefox, IE, Opera, etc. Todos esses projetos têm uma vantagem de 10-15 anos. você, e quando você alcançá-los, eles estarão outros 10-15 anos à sua frente. Além disso, eles têm muito mais mão de obra por trás deles e, portanto, se você quiser que seu projeto seja bem-sucedido, precisará dessa mão de obra em algum momento.

É por isso que Apple e Google, grandes empresas com muitos recursos, não começaram do zero. Nem mesmo a Microsoft começou do zero. O IE original foi baseado no Mosaic. Os únicos navegadores significativos que ainda hoje foram iniciados do zero são Opera , Konqueror e Lynx, que infelizmente todos têm uma participação de mercado minúscula. Vamos esquecer o Lynx por enquanto, já que ele é um navegador somente de texto e, presumivelmente, a única razão pela qual ele ainda está por aí é porque ele atende a esse nicho específico. O Opera é indiscutivelmente um dos melhores navegadores já feitos, mas nunca teve uma grande participação no mercado, então lembre-se de que sucesso e inovação não são a mesma coisa. KHTML é o motor por trás do Konqueror, que nunca teve muito sucesso, mas é a base do WebKit que a Apple e o Google usam. Eu acho que alguém poderia definitivamente argumentar que se o KHTML nunca tivesse sido feito, nem o Safari nem o Chrome existiriam. Curiosamente, tanto o KHTML quanto o Opera foram produzidos em grande parte por programadores noruegueses que trabalhavam no mesmo prédio em Oslo.

Você precisa olhar para construir um navegador da web como construir um sistema operacional, porque isso é essencialmente o que um navegador é - é um sistema operacional para executar aplicativos da web. E, como um sistema operacional, um navegador da Web é um software muito complexo, com muitos componentes. É claro que as pessoas tiveram sucesso na criação de novos sistemas operacionais do zero. Linus Torvalds vem à mente. Ele fez o Linux, um dos sistemas operacionais de maior sucesso de todos os tempos.

Claro, você enfrenta um desafio adicional, que torna a construção de um novo navegador de sucesso mais difícil do que a construção de um novo sistema operacional de sucesso . Espera-se que os navegadores executem perfeitamente todo o código legado que circula na web. Agora suponha que Linus Torvalds foi informado de que seu novo sistema operacional não importaria, a menos que fosse perfeitamente compatível com UNIX ou algum sistema operacional existente. Duvido que ele se importasse, e o Linux provavelmente não existiria hoje. Realisticamente, é claro, a única razão pela qual o Linux se tornou popular foi porque foi bem projetado e o projeto GNU foi capaz de fazer ferramentas para portar grandes quantidades de código existente para o Linux. Sem o suporte ideológico do GNU para o Linux, ele nunca teria tido uma chance.

Então, supondo que você realmente seja ambicioso (ou temerário) o suficiente para tentar fazer um novo navegador de sucesso, você deve se concentrar em arquitetura e design . Não há razão prática para construir um novo navegador do zero, a menos que você tenha certeza de que pode melhorar o design dos navegadores existentes de alguma forma. Isso significa que você precisa se familiarizar o suficiente com o código do WebKit e do Gecko o suficiente para entender as decisões de design que eles tomaram, mas você não deve tentar copiar o design, caso contrário, você pode simplesmente usar o código deles.

Minha opinião pessoal (sem ter pesquisado o suficiente) é que os navegadores de hoje não são modulares o suficiente. Se eu fosse fazer um novo navegador, encontraria uma maneira de facilitar a troca de coisas dentro e fora (como substituir um mecanismo JavaScript por outro) e dar ao usuário muito mais controle do que eles têm atualmente com os navegadores existentes . Os navegadores modernos e os web designers tiraram quase todo o controle do usuário. Por que eu, o usuário, não posso dizer ao navegador da web como quero que ele renderize o conteúdo exibido em minha máquina? O HTML original apenas fornecia diretrizes sobre como estruturar o conteúdo e, com o tempo, os novos padrões se tornaram cada vez mais dogmáticos, a ponto de o usuário ficar à mercê total do web designer. O apelo do Linux era devolver o controle ao usuário, e que '

A outra coisa que eu gastaria meu tempo pesquisando, se fosse você, são os princípios de design de sistema operacional. Projetar um bom navegador deve, pelo menos em teoria, exigir os mesmos princípios que projetar um bom sistema operacional - especialmente no que diz respeito a processos simultâneos, modelos de segurança, etc.

Finalmente, depois de ter feito muitas pesquisas, é aqui que você deve começar a codificar, eu acho:

  1. Reengenharia do Mosaico, mas com suas próprias idéias de design. Isso também é o que eu sugeriria se você estiver fazendo isso apenas por diversão ou para seu próprio benefício educacional. Leia as especificações originais do HTML 1.0 e HTML 2.0, bem como as especificações HTTP 1.1 e as especificações URI atuais, e certifique-se de que seu navegador cumpra todas essas especificações. É claro que você pode baixar o software existente que já lida com os protocolos de transporte, convenções de URI, etc., mas se você leva a sério o projeto de seu próprio navegador, acho que é um bom exercício fazer essas coisas do zero também, então você começa uma boa noção de como todas as peças do quebra-cabeça se encaixam. No final da etapa 0, você deve ter um navegador que seja pelo menos comparável ao que era de última geração nos anos 90. Este é um bom primeiro marco. E você pode baixar o Mosaic original emftp://ftp.ncsa.uiuc.edu/Mosaic/ e veja como ele se compara ao seu navegador. Também é um bom exercício ver como os sites atuais são renderizados em um navegador antigo como o Mosaic.

  2. Adicione suporte para o DOM ao seu navegador. Concentre-se primeiro no W3C DOM Nível 1 e Nível 2, já que quase todos os navegadores atuais os suportam completamente. Em seguida, observe o Nível 3 e o Nível 4. O DOM é extremamente fundamental para a programação da web e, portanto, se você for realmente construir um navegador da web moderno, todo o design deve levar isso em consideração. Como você está escrevendo o navegador em C #, pode levar em consideração como pode aproveitar o modelo de objeto .NET existente a seu favor.

  3. Observe os mecanismos de script existentes e veja se você pode transferi-los para o seu projeto. Eu o desencorajaria a escrever seu próprio interpretador JavaScript, não apenas porque é um projeto muito grande em si, mas porque muito trabalho já foi colocado na otimização de compiladores JS (por exemplo, V8). Portanto, a menos que você seja um guru em design de compilador, seu interpretador JS feito à mão provavelmente será inferior ao que já existe, mesmo que siga as especificações do EMCAScript perfeitamente. Novamente, acho que o mecanismo de script deve ser algo completamente separado do navegador real de qualquer maneira, então acho que seria muito mais útil ter uma estrutura que permite substituir qualquer mecanismo de script, em vez de construir um mecanismo de script que só funciona com o seu navegador.

  4. Observe o código-fonte HTML / CSS / JS dos 10-20 principais sites da América do Norte (Google, Facebook, YouTube, Twitter, Wikipedia, Amazon, plataformas de blogs populares, etc.) e projete seu navegador para funcionar bem com esses sites . Este é um problema um pouco mais tratável de resolver do que fazer um navegador que adere a todos os padrões existentes (algo que os navegadores atuais ainda não fazem perfeitamente), muito menos fazer um navegador que renderize corretamente todos os sites da web (ninguém pode faça isso). As pessoas reclamarão que seu navegador quebra os padrões e assim por diante, mas isso não é um problema tão grande quanto as pessoas reclamando que não podem acessar o Google ou Facebook com seu navegador. Não consigo pensar em nenhum navegador que seguisse corretamente todos (ou mesmo a maioria) dos padrões em seu primeiro lançamento, então digo que nem se dê ao trabalho de tentar.

user2188685
fonte
1
+1 para a maioria dos códigos de navegadores da web hoje é horrível com um monte de lixo legado desde a década de 1990 . O Google tentou resolver isso criando o Blink, que é basicamente um Webkit com 8,8 milhões de linhas de porcaria removidas, mas mesmo assim, ainda há um monte de porcaria entrincheirada irremovível presa dentro do Blink.
Pacerier
1
... Se o Google tivesse começado a construir um navegador hoje, com certeza o faria do zero , mas agora é muito caro para eles virar o Titanic porque todos os seus funcionários já conhecem o Blink. Uma nova startup com habilidades profundas e bem financiada com dinheiro para criar um sistema operacional de navegador concorrente pode definitivamente ter uma vantagem sobre o Chrome.
Pacerier 01 de
15

Você quer dizer escrever seu próprio mecanismo de renderização?

Só posso dizer boa sorte. Muitos homens-anos se passaram para a geração atual de vários navegadores. Se você quiser fazer melhor do que qualquer um deles, precisará de algumas habilidades sérias. Se você tiver que perguntar por onde começar, provavelmente terá mais do que alguns anos de estudo antes de fazer qualquer sentido tentar tal tarefa.

Dito isso, aqui estão algumas dicas (óbvias):

  1. escrever muitos códigos que fazem pequenas coisas, como resolver todos os problemas do projecteuler.net
  2. aprenda tudo que puder sobre seu kit de ferramentas e seus padrões de comunidade
  3. escrever muito mais código
  4. obter uma compreensão sólida e real de máquinas de estados finitos
  5. escreva ainda mais código
  6. aprenda tudo sobre a pilha tcp / ip e como ela é usada para http
  7. aprenda tudo que puder sobre http
  8. aprenda os padrões (html, xml, sgml, css)
  9. comemore seu 150º aniversário.
  10. comece no projeto do navegador real.

edite abaixo aqui

Eu não queria que fosse motivador ou desmotivador, apenas uma tentativa de mostrar a você que um navegador é um projeto realmente grande e que projetos realmente grandes requerem muito pensamento. Honestidade contundente salpicada de humor.

Tenho programado há mais de dois terços da minha vida e gosto de pensar que sou um programador bastante decente, mas seria tolice da minha parte pensar que teria meia chance de escrever um navegador decente do zero .

Claro, se é isso que você quer fazer, não deixe meu comentário atrapalhar seu caminho. Você provavelmente pode fazer melhor do que o Internet Explorer.

Kris
fonte
12
Eu deveria ter mencionado: se você deseja criar uma torta de maçã do zero, deve começar criando um universo.
Kris
@ Mk12: de fato, obrigado. Atualizada.
Kris
1
@Kris Como você cria um Universo quando não há nada com que criá-lo?
uSeRnAmEhAhAhAhAhA
1
@ user2645707: Não sei, estou apenas repetindo alguém mais inteligente do que eu. quotationspage.com/quote/26980.html
Kris
12
1 para "Você provavelmente pode fazer melhor do que o Internet Explorer."
Pulah Nandha
14

É um projeto extremamente ambicioso (especialmente para um único desenvolvedor), mas algo que eu adoraria fazer algum dia - você poderia aprender muito com ele.

Não sei muito sobre como os protocolos funcionam (algo que você definitivamente precisa pesquisar) ou muito sobre o que acontece em um navegador, mas um ótimo lugar para começar seria a fonte dos navegadores de código aberto, principalmente Chrome e Raposa de fogo. O Chrome é um projeto especialmente bom para se olhar, pois eles só fazem o que eu esperava que você fizesse no início: o cromo e o backend do navegador. Esqueça a criação de um mecanismo de renderização no início - use Webkit ou Gekko.

Ross
fonte
8

Como todo mundo já disse, um navegador da web é um projeto enorme. Você precisa se preocupar com tcp / ip & sockets, renderização de html, usar css, criar um modelo DOM, executar javascript, lidar com marcação e código malformados e lidar com todos os tipos de arquivos antes mesmo de pensar em tudo o que as pessoas esperam um navegador (ou seja, favoritos, histórico, navegação privada, segurança, etc.) É um projeto enorme.

Dito isso, isso pode ser feito. Minha sugestão seria dar uma olhada na fonte do Firefox. Eu sei que você disse que deseja construir um navegador do zero, mas seria muito útil aprender com um projeto de código aberto, primeiro.

Gostaria de baixar o código-fonte do Firefox e lentamente retirá-lo. Em outras palavras, eu pegaria a fonte e removeria todas as funcionalidades de favoritos. Então, eu removeria a capacidade de lidar com addons. Então, eu excluiria todo o código relacionado ao salvamento de arquivos. Eu continuaria esse processo até obter um navegador da web muito básico. Eu examinaria esse código.

Então, eu começaria a construir o meu próprio. Eu pegaria o conhecimento que ganhei desmontando o Firefox e o aplicaria na construção de um novo navegador.

Um lote inteiro de sorte para você!

Stalepretzel
fonte
Você pode fornecer alguma indicação de como desintegrar o Firefox? Quer dizer, recebo um exearquivo e, ao instalar, recebo uma pasta de origem com vários dllarquivos. Como estudo o código real que fez isso e a lógica que está por trás disso?
SexyBeast de
Esse comentário está atrasado para a festa, mas enfim. Os arquivos .EXE e .DLL são o resultado de uma etapa de compilação e você não pode esperar entendê-la muito. Você precisaria do código-fonte (algum C ++ e outras linguagens em arquivos diferentes) para entender o programa. Os programadores precisam entender seu próprio programa, então eles tendem a separar e documentar as várias partes funcionais do código.
Roy Prins
4

Você pode começar com um XHTML válido e bem formado, o que deve ser mais fácil do que a sopa de tags que seu navegador encontrará na "vida" real.

Em seguida, você deve encontrar uma maneira de adaptar o HTML real da web às suas necessidades.

Mas não se iluda: um navegador não é um projeto pequeno.

stesch
fonte
3

... então comece a se preocupar com a segurança

(preocupações não funcionais e transversais devem ser geralmente consideradas desde o início :))

Matt
fonte
1

projeto muito ambicioso, mas um desenvolvedor não pode fazer isso sozinho, você precisa de uma equipe (gerente de projeto, testadores ...) e talvez você deva revisar sua escolha de linguagem c # funciona apenas no Windows (eu sei mono no Linux, mas não é o mesmo) de qualquer maneira, desejo-lhe boa sorte e ficarei feliz em usar seu navegador: D

Hannoun Yassir
fonte
0

Você realmente tem muito tempo livre nas mãos, não é? AFAIK, a maioria dos navegadores foi escrita em C ++, nem todos os usuários têm o .NET framework instalado em seus computadores e se eles tiverem, pode não ser a versão de que você precisa.

Isso pode levar anos, mas, de qualquer forma, existem muitos navegadores de código aberto, FireFox, Google Chrome .. etc, você pode começar dando uma olhada no código, boa sorte com isso :)

Waleed Eissa
fonte
1
O Chrome não é um código aberto; Mas a maior parte de seu código-fonte pode ser encontrado no projeto chromium
Anonymous