Come iniziare a creare un browser web? [chiuso]


89

Ho deciso di impegnarmi per creare un browser web da zero. Quali sono le funzioni, le architetture e le caratteristiche comuni dei browser Web moderni che dovrei conoscere prima di iniziare?

Tutti i consigli sono molto apprezzati!


9
Sì, è un progetto folle ma non abbiamo bisogno di prendere il topolino qui - Penso che sia un ottimo punto di discussione su come andresti in giro per questo :)
Ross

8
Ricordo un articolo di qualche tempo fa in cui qualcuno si lamentava del fatto che nessuno avesse più il coraggio di costruire nuovi motori di rendering. Sono necessari nuovi browser, ha detto, perché i computer di oggi sono diversi. Core multipli. Il primo passaggio è Chrome con 1 processo per scheda. Vediamo cosa succederà dopo.
stesch

36
Coltiva delle palle e fai quello che vuoi. Se funziona, bene. Altrimenti, continua a provare, altrimenti finirai come l'altra metà della società che dice "Non creare nulla di nuovo, usa solo la merda rotta che abbiamo già".
uSeRnAmEhAhAhAhAhA

7
Hai bisogno di una di quelle pillole che Bradley Cooper prende in Limitless . ;)
Ali Gajani

3
Provaci. Scommetto che è molto più facile di quanto dicono le persone qui, soprattutto se si collegano molti componenti esistenti. Quanto può essere difficile analizzare del testo e produrre alcune caselle colorate con del testo al loro interno?
Ian Warburton

Risposte:


131

Bene, suddividilo in pezzi. Cos'è un browser Web? Che cosa fa? Esso:

  • Recupera contenuto esterno. Quindi hai bisogno di una libreria HTTP o (non consigliato) scrivila tu stesso. C'è molta complessità / sottigliezza nel protocollo HTTP, ad esempio la gestione delle intestazioni delle scadenze, versioni diverse (anche se oggigiorno è principalmente 1.1), ecc;
  • Gestisce diversi tipi di contenuto. C'è un registro Windos per questo genere di cose che puoi portare sulle spalle. Sto parlando dell'interpretazione dei contenuti in base al tipo MIME qui;
  • Analizza HTML e XML : per creare un DOM (Document Object Model);
  • Analizza e applica i CSS : ciò implica la comprensione di tutte le proprietà, tutte le unità di misura e tutti i modi in cui i valori possono essere specificati (es. "Border: 1px solid black" vs le proprietà separate border-width, ecc.);
  • Implementa il modello visivo W3C (e questo è il vero kicker); e
  • Ha un motore Javascript .

E questo è fondamentalmente un browser Web in poche parole. Ora alcune di queste attività sono incredibilmente complesse. Anche quelli che suonano facilmente possono essere difficili. Prendi il recupero di contenuti esterni. Devi affrontare casi d'uso come:

  • Quante connessioni simultanee usare?
  • Segnalazione di errori all'utente;
  • Proxy;
  • Opzioni utente;
  • eccetera.

Il motivo per cui io e altri stiamo alzando le sopracciglia in modo collettivo è che il motore di rendering è difficile (e, come qualcuno ha notato, sono passati anni nel loro sviluppo). I principali motori di rendering in circolazione sono:

  • Trident: sviluppato da Microsoft per Internet Explorer;
  • Gecko: utilizzato in Firefox;
  • Webkit: utilizzato in Safari e Chrome 0-27;
  • KHTML: utilizzato nell'ambiente desktop KDE. Webkit è stato biforcato da KHTML alcuni anni fa;
  • Elektra: utilizzato in Opera 4-6;
  • Presto: utilizzato in Opera 7-12;
  • Blink: utilizzato in Chrome 28+, Opera 15+, fork webkit;

I primi tre sono da considerare i principali motori di rendering utilizzati oggi.

Anche i motori Javascript sono difficili. Ce ne sono molti che tendono ad essere legati al particolare motore di rendering:

  • SpiderMonkey: utilizzato in Gecko / Firefox;
  • TraceMonkey: sostituirà SpiderMonkey in Firefox 3.1 e introduce la compilazione JIT (just-in-time);
  • KJS: usato da Konqueror, legato a KHTML;
  • JScript: il motore Javascript di Trident, utilizzato in Internet Explorer;
  • JavascriptCore: utilizzato in Webkit dal browser Safari;
  • SquirrelFish: verrà utilizzato in Webkit e aggiunge JIT come TraceMonkey;
  • V8: motore Javascript di Google utilizzato in Chrome e Opera;
  • Anche Opera (12.X e meno) usava il proprio.

E ovviamente ci sono tutte le cose dell'interfaccia utente: navigazione tra le pagine, cronologia delle pagine, cancellazione dei file temporanei, digitazione di un URL, completamento automatico degli URL e così via.

Questo è un sacco di lavoro.


* Gecko :) Anche d'accordo. Le parti principali sono renderer HTML e motore JavaScript.
abatishchev

1
Opera ha creato il proprio. Presto è quello attuale, e l'Electra era il loro precedente.
Tim Sullivan

Ottima risposta approfondita: ho dimenticato di analizzare JavaScript tutto insieme!
Ross

1
Il mondo, però, ha bisogno di più persone che abbiano le palle per costruire browser. Cp eff.org/deeplinks/2016/04/save-firefox .
Pacerier

28

Sembra un progetto davvero interessante, ma richiederà uno sforzo enorme.

Non è una cosa facile, ma da un punto di vista accademico potresti imparare tanto .

Alcune risorse che potresti controllare:

Ma vedendolo da un punto di vista realistico , l'enorme sforzo necessario per codificarlo da zero mi ha ricordato questo fumetto:


(fonte: geekherocomic.com )

In bocca al lupo :-)


Oh GHC ha continuato? Penso di aver annullato l'iscrizione quando hanno iniziato a fare quella cosa della tana di Ross.
Ross

@ Ross: Sì, consegnano ancora il fumetto, quel nuovo ragazzo si chiama Boris dalla Russia, ed è un "Super Hacker" LOL
Christian C. Salvadó

17

La maggior parte dei browser Web moderni sono bestie giganti e probabilmente sono progettati in modo abbastanza scadente perché (e il Web stesso) si sono evoluti in modo piuttosto casuale.

Devi iniziare prima rendendo gli obiettivi del tuo progetto (e ciò che speri di ottenere) molto espliciti. È qualcosa che stai facendo solo per divertimento o ti aspetti che altre persone utilizzino il tuo browser? Se ti aspetti che altri lo utilizzino, quale sarà l'incentivo per loro? Non è realistico aspettarsi di sviluppare un nuovo browser da zero che tutti potranno utilizzare in sostituzione di Chrome, Safari, Firefox, IE, Opera, ecc. Tutti questi progetti hanno un vantaggio iniziale di 10-15 anni. tu, e quando li avrai raggiunti, saranno altri 10-15 anni avanti a te. Inoltre hanno molto più potere umano dietro di loro, e quindi se vuoi che il tuo progetto abbia successo, avrai bisogno di quel potere umano ad un certo punto.

Questo è il motivo per cui Apple e Google, grandi aziende con molte risorse, non sono partiti da zero. Nemmeno Microsoft ha iniziato da zero. L'IE originale era basato su Mosaic. Gli unici browser significativi ancora in giro che sono stati avviati da zero sono Opera , Konqueror e Lynx, che purtroppo hanno tutti una quota di mercato minuscola. Dimentichiamoci di Lynx per il momento, dal momento che è un browser di solo testo e presumibilmente l'unica ragione per cui è ancora in circolazione è perché serve quella specifica nicchia. Opera è probabilmente uno dei migliori browser mai realizzati, eppure non ha mai avuto una grande quota di mercato, quindi ricorda che il successo e l'innovazione non sono la stessa cosa. KHTML è il motore dietro Konqueror, che non ha mai avuto molto successo, ma è la base di WebKit che Apple e Google utilizzano. Penso che si possa sicuramente sostenere che se KHTML non fosse mai stato creato, né Safari né Chrome esisterebbero. È interessante notare che sia KHTML che Opera sono stati in gran parte prodotti da programmatori norvegesi che lavoravano nello stesso edificio a Oslo.

Devi guardare alla creazione di un browser web come costruire un sistema operativo, perché questo è essenzialmente ciò che un browser è: è un sistema operativo per l'esecuzione di app web. E come un sistema operativo, un browser web è un software molto complesso con molti componenti. Naturalmente, le persone hanno avuto successo nel creare nuovi sistemi operativi da zero. Mi viene in mente Linus Torvalds. Ha realizzato Linux, uno dei sistemi operativi di maggior successo di sempre.

Ovviamente, devi affrontare una sfida aggiuntiva, che rende la creazione di un nuovo browser di successo più difficile che creare un nuovo sistema operativo di successo . Ci si aspetta che i browser eseguano in modo impeccabile tutto il codice legacy che galleggia sul Web. Supponiamo ora che a Linus Torvalds fosse stato detto che il suo nuovo sistema operativo non avrebbe avuto importanza a meno che non fosse perfettamente compatibile all'indietro con UNIX o con qualche sistema operativo esistente. Dubito che si sarebbe preoccupato e probabilmente Linux oggi non sarebbe esistito. Realisticamente, ovviamente, l'unica ragione per cui Linux è diventato popolare è perché è stato progettato bene e il progetto GNU è stato in grado di creare strumenti per il porting su Linux di enormi quantità di codice esistente. Senza il supporto ideologico di GNU per Linux, non avrebbe mai avuto una possibilità.

Quindi, supponendo che tu sia davvero ambizioso (o avventato) abbastanza da provare a creare un nuovo browser di successo, la cosa su cui dovresti concentrarti è l' architettura e il design . Non vi è alcun motivo pratico per creare un nuovo browser da zero a meno che non si sia sicuri di poter migliorare in qualche modo il design dei browser esistenti. Ciò significa che devi familiarizzare abbastanza con il codice di WebKit e Gecko abbastanza da capire le decisioni di progettazione che hanno preso, ma non dovresti tentare di copiare il loro progetto perché altrimenti potresti anche usare il loro codice.

Il mio pensiero personale (senza aver fatto abbastanza ricerche) è che i browser di oggi non sono abbastanza modulari. Se dovessi creare un nuovo browser, troverei un modo per semplificare lo scambio di cose dentro e fuori (come sostituire un motore JavaScript con un altro) e dare all'utente un controllo molto maggiore di quello che ha attualmente con i browser esistenti . I browser moderni e i web designer hanno tolto quasi tutto il controllo all'utente. Perché io, l'utente, non posso dire al browser web come voglio che visualizzi il contenuto visualizzato sulla mia macchina? L'HTML originale forniva solo linee guida su come strutturare il contenuto e, nel tempo, gli standard più recenti sono diventati sempre più dogmatici, al punto che l'utente è ora alla totale mercé del web designer. Il fascino di Linux era che restituiva il controllo all'utente, e che "

L'altra cosa su cui vorrei dedicare del tempo alla ricerca, se fossi in te, sono i principi di progettazione del sistema operativo. La progettazione di un buon browser, almeno in teoria, dovrebbe richiedere gli stessi principi della progettazione di un buon sistema operativo, specialmente per quanto riguarda i processi simultanei, i modelli di sicurezza, ecc.

Infine, dopo aver fatto molte, molte ricerche, è qui che dovresti iniziare a programmare penso:

  1. Re-ingegnerizzare Mosaico, ma con le tue idee di design. Questo è anche ciò che suggerirei se lo fai solo per divertimento o per tuo vantaggio educativo. Leggi le specifiche HTML 1.0 e HTML 2.0 originali, nonché le specifiche HTTP 1.1 e le specifiche URI correnti e assicurati che il tuo browser aderisca a tutte queste specifiche. Ovviamente puoi scaricare il software esistente che gestisce già i protocolli di trasporto, le convenzioni URI, ecc. Ma se sei seriamente intenzionato a progettare il tuo browser, penso che sia un buon esercizio fare anche queste cose da zero, quindi ottieni un buon senso di come tutti i pezzi del puzzle si incastrano. Alla fine del passaggio 0, dovresti avere un browser almeno paragonabile a quello che era lo stato dell'arte negli anni '90. Questa è una buona prima pietra miliare. E puoi effettivamente scaricare il Mosaico originale suftp://ftp.ncsa.uiuc.edu/Mosaic/ e guarda come si confronta con il tuo browser. È anche un buon esercizio per vedere come vengono visualizzati i siti Web attuali in un browser antico come Mosaic.

  2. Aggiungi il supporto per il DOM al tuo browser. Concentrati prima su W3C DOM Livello 1 e Livello 2, poiché praticamente tutti i browser attuali li supportano completamente. Quindi guarda il Livello 3 e il Livello 4. Il DOM è estremamente fondamentale per la programmazione web, quindi se hai intenzione di costruire effettivamente un browser web moderno, l'intero design deve tenerlo in considerazione. Poiché stai scrivendo il browser in C #, potresti prendere in considerazione come sfruttare a tuo vantaggio il modello a oggetti .NET esistente.

  3. Guarda i motori di scripting esistenti e vedi se puoi portarli nel tuo progetto. Ti scoraggerei dallo scrivere il tuo interprete JavaScript, non solo perché è un progetto molto grande in sé, ma perché molto lavoro è già stato messo nell'ottimizzazione dei compilatori JS (ad esempio V8). Quindi, a meno che tu non sia un guru nella progettazione di compilatori, il tuo interprete JS costruito a mano sarà probabilmente inferiore a ciò che è già disponibile, anche se segue perfettamente le specifiche EMCAScript. Ancora una volta, penso che il motore di scripting dovrebbe essere qualcosa che è comunque un modulo completamente separato dal browser effettivo, quindi penso che sarebbe molto più utile avere un framework che ti permetta di sostituire qualsiasi motore di scripting, piuttosto che costruire un motore di scripting funziona solo con il tuo browser.

  4. Guarda il codice sorgente HTML / CSS / JS per i primi 10-20 siti Web in Nord America (Google, Facebook, YouTube, Twitter, Wikipedia, Amazon, piattaforme di blog popolari, ecc.) E progetta il tuo browser per funzionare bene con questi siti . Questo è un problema un po 'più trattabile da risolvere che realizzare un browser che aderisca a tutti gli standard esistenti (cosa che i browser attuali ancora non fanno perfettamente) tanto meno realizzare un browser che renda correttamente tutti i siti web sul web (nessuno può Fai quello). Le persone si lamenteranno del fatto che il tuo browser infrange gli standard e così via, ma non è un problema così grande come le persone che si lamentano di non poter accedere a Google o Facebook con il tuo browser. Non riesco a pensare a nessun browser che abbia seguito correttamente tutti (o anche la maggior parte) degli standard nella sua prima versione, quindi dico di non preoccuparti nemmeno di provare.


1
+1 per la maggior parte del codice dei browser web di oggi fa schifo orribilmente con carichi di merda legacy fin dagli anni '90 . Google ha cercato di risolvere questo problema creando Blink che è fondamentalmente Webkit con 8,8 milioni di righe di schifezze rimosse, ma anche ancora, rimangono carichi di schifezze inamovibili bloccate all'interno di Blink.
Pacerier

1
... Se Google avesse iniziato a creare un browser oggi, lo avrebbe sicuramente creato da zero , ma ora è troppo costoso per loro trasformare il Titanic perché tutti i suoi dipendenti conoscono già i Blink. Una nuova startup con competenze profonde e ben finanziata con denaro per creare un browser-OS concorrente può sicuramente avere un vantaggio su Chrome.
Pacerier

15

Intendi scrivere il tuo motore di rendering?

Posso solo dire buona fortuna. Molti anni uomo sono passati nell'attuale generazione dei vari browser, se vuoi fare meglio di entrambi avrai bisogno di alcune abilità serie. Se devi chiedere da dove iniziare, probabilmente hai più di qualche anno di studio prima che abbia senso tentare un simile compito.

Detto questo, ecco alcuni (ovvi) suggerimenti:

  1. scrivere un sacco di codice che fa piccole cose, come risolvere tutti i problemi di projecteuler.net
  2. impara tutto ciò che puoi sul tuo toolkit e sui suoi standard comunitari
  3. scrivi molto più codice
  4. acquisire una solida conoscenza delle macchine a stati finiti
  5. scrivi ancora altro codice
  6. impara tutto sullo stack tcp / ip e su come viene utilizzato per http
  7. impara tutto quello che puoi su http
  8. impara gli standard (html, xml, sgml, css)
  9. festeggia il tuo 150 ° compleanno.
  10. iniziare con il progetto browser effettivo.

modifica qui sotto

Non volevo che fosse motivante o demotivante, solo un tentativo di mostrarti che un browser è un progetto davvero grande e che progetti davvero grandi richiedono molta riflessione. Onestà schietta cosparsa di umorismo.

Ho programmato per oltre due terzi della mia vita e mi piace pensare di essere un programmatore abbastanza decente, ma sarebbe sciocco da parte mia pensare che avrei mezza possibilità di scrivere da zero un browser web decente .

Ovviamente, se questo è ciò che vuoi fare, non lasciare che il mio commento ti ostacoli. Probabilmente puoi fare di meglio di Internet Explorer.


12
Avrei dovuto menzionarlo: se vuoi creare una torta di mele da zero, devi iniziare creando un universo.
Kris

@ Mk12: anzi, grazie. aggiornato.
Kris

1
@Kris Come si crea un universo quando non c'è niente con cui crearlo?
uSeRnAmEhAhAhAhAhA

1
@ user2645707: Non saprei, sto solo ripetendo a pappagallo qualcuno più intelligente di me. quotationspage.com/quote/26980.html
Kris,

12
+1 per "Probabilmente puoi fare di meglio di Internet Explorer".
Pulah Nandha

14

È un progetto follemente ambizioso (specialmente per un singolo sviluppatore) ma qualcosa che mi piacerebbe fare un giorno - potresti imparare così tanto da esso.

Non so molto su come funzionano i protocolli (qualcosa che devi assolutamente ricercare) o molto su ciò che accade in un browser, ma un ottimo punto di partenza sarebbe la fonte dei browser open source, principalmente Chrome e Firefox. Chrome è un progetto particolarmente buono da guardare in quanto fanno solo ciò con cui mi aspetto che inizi: il chrome e il backend del browser. Dimentica la creazione di un motore di rendering all'inizio: usa Webkit o Gekko.


8

Come tutti gli altri hanno già detto, un browser web è un progetto enorme. Devi preoccuparti di tcp / ip e socket, rendering html, utilizzo di css, creazione di un modello DOM, esecuzione di javascript, gestione di markup e codice non validi e gestione di tutti i tipi di file prima ancora di poter pensare a tutte le cose da cui le persone si aspettano un browser (cioè segnalibri, cronologia, navigazione privata, sicurezza, ecc.) È un progetto enorme.

Detto questo, si può fare. Il mio suggerimento sarebbe di andare a vedere la fonte di Firefox. So che hai detto che vuoi costruire un browser da zero, ma sarebbe molto utile imparare prima da un progetto open source.

Scaricarei il sorgente di Firefox e lo svuoterei lentamente. In altre parole, prenderei la fonte e rimuoverei tutte le funzionalità di bookmarking. Quindi, rimuoverei la possibilità di gestire i componenti aggiuntivi. Quindi, eliminerei tutto il codice relativo al salvataggio dei file. Continuerei questo processo finché non avrò un browser web molto semplice. Controllerei quel codice.

Quindi, inizierei a costruire il mio. Prenderei le conoscenze acquisite smontando Firefox e le metterei nella creazione di un nuovo browser.

Un bel po 'di fortuna a voi!


Potete fornire indicazioni su come disintegrare Firefox? Voglio dire, ottengo un exefile, dopo averlo installato, ottengo una cartella di origine con molti dllfile. Come posso studiare il codice effettivo che ha fatto questo e la logica che sta dietro a questo?
SexyBeast

Questo commento è in ritardo per la festa, ma comunque. I file .EXE e .DLL sono il risultato di un passaggio di compilazione e non ci si può aspettare di averne molto senso. Avresti bisogno del codice sorgente (alcuni C ++ e altri linguaggi in file diversi) per dare un senso al programma. I programmatori devono dare un senso al proprio programma, quindi tendono a separare e documentare le varie parti funzionali del codice.
Roy Prins


4

Potresti iniziare con XHTML valido e ben formato, che dovrebbe essere più semplice della zuppa di tag che il tuo browser incontrerà nella "vita" reale.

Quindi devi trovare un modo per piegare il vero HTML dal web alle tue esigenze.

Ma non illuderti: un browser non è un piccolo progetto.


3

... quindi inizia a preoccuparti della sicurezza

(Le preoccupazioni non funzionali e trasversali dovrebbero essere generalmente considerate in primo piano :))


1

progetto molto ambizioso ma uno sviluppatore non può farlo da solo hai bisogno di un team (project manager, tester ...) e forse dovresti rivedere la tua scelta del linguaggio c # funziona solo su windows (so mono su linux ma non è il lo stesso) comunque ti auguro buona fortuna e sarò felice di utilizzare il tuo browser: D


0

Hai davvero molto tempo libero in mano, vero? AFAIK, la maggior parte dei browser sono stati scritti in C ++, non tutti gli utenti hanno il framework .NET installato sui loro computer e se lo fanno potrebbe non essere la versione di cui hai bisogno.

Questo potrebbe richiedere anni, ma comunque, ci sono molti browser open source là fuori, FireFox, Google Chrome ... ecc., Potresti iniziare dando un'occhiata al codice, buona fortuna :)


1
Chrome non è open source; Ma la maggior parte del suo codice sorgente può essere trovata nel progetto chromium
Anonimo
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.