Comment commencer à créer un navigateur Web?

J’ai décidé de faire des efforts pour créer un navigateur Web à partir de zéro. Quelles sont les fonctions, architectures et caractéristiques communes aux navigateurs Web modernes que je devrais connaître avant de commencer?

Toutes les recommandations sont très appréciées!

Bien le décomposer en morceaux. Qu’est-ce qu’un navigateur Web? Qu’est ce que ça fait? Il:

  • Récupère le contenu externe. Donc, vous avez besoin d’une bibliothèque HTTP ou (non recommandé) écrivez ceci vous-même. Il y a beaucoup de complexité / subtilité dans le protocole HTTP, par exemple la gestion des en-têtes d’expiration, différentes versions (bien que ce soit la plupart du temps 1.1 ces jours-ci), etc.
  • Gère différents types de contenu. Theres un registre Windos pour ce genre de chose que vous pouvez greffer. Je parle d’interpréter le contenu basé sur le type MIME ici;
  • Analyse HTML et XML : pour créer un DOM (Document Object Model);
  • Analyse et applique CSS : cela implique de comprendre toutes les propriétés, toutes les unités de mesure et toutes les manières dont les valeurs peuvent être spécifiées (par exemple, “border: 1px black solid” vs propriétés border-width séparées, etc.);
  • Implémente le modèle visuel du W3C (et c’est le vrai kicker); et
  • A un moteur Javascript .

Et en gros, c’est un navigateur Web. Maintenant, certaines de ces tâches sont incroyablement complexes. Même les sons faciles peuvent être difficiles. Prenez le contenu externe. Vous devez gérer des cas d’utilisation tels que:

  • Combien de connexions simultanées utiliser?
  • Erreur signalant à l’utilisateur;
  • Les proxies;
  • Options utilisateur
  • etc.

La raison pour laquelle moi-même et d’autres sums en train de soulever nos sourcils, c’est que le moteur de rendu est difficile (et, comme quelqu’un l’a fait remarquer, les années de travail ont évolué). Les principaux moteurs de rendu sont les suivants:

  • Trident: développé par Microsoft pour Internet Explorer;
  • Gecko: utilisé dans Firefox;
  • Webkit: utilisé dans Safari et Chrome 0-27;
  • KHTML: utilisé dans l’environnement de bureau KDE. Webkit est sorti de KHTML il y a quelques années;
  • Elektra: utilisé dans Opera 4-6;
  • Presto: utilisé dans Opera 7-12;
  • Clignotement: utilisé dans Chrome 28+, Opera 15+, webkit fork;

Les trois premiers doivent être considérés comme les principaux moteurs de rendu utilisés aujourd’hui.

Les moteurs Javascript sont également difficiles. Il y en a plusieurs qui ont tendance à être liés au moteur de rendu particulier:

  • SpiderMonkey: utilisé dans Gecko / Firefox;
  • TraceMonkey: remplacera SpiderMonkey dans Firefox 3.1 et introduira la compilation JIT (juste à temps);
  • KJS: utilisé par Konqueror, lié à KHTML;
  • JScript: le moteur Javascript de Trident, utilisé dans Internet Explorer;
  • JavascriptCore: utilisé dans Webkit par le navigateur Safari;
  • SquirrelFish: sera utilisé dans Webkit et ajoute JIT comme TraceMonkey;
  • V8: moteur Javascript de Google utilisé dans Chrome et Opera;
  • Opera (12.X et moins) a également utilisé le sien.

Et bien sûr, il y a tous les éléments de l’interface utilisateur: navigation entre les pages, historique de la page, effacement des fichiers temporaires, saisie d’une URL, saisie automatique des URL, etc.

C’est beaucoup de travail.

Cela semble être un projet vraiment intéressant, mais il vous faudra investir un énorme effort.

Ce n’est pas une chose facile, mais d’un sharepoint vue académique, vous pourriez en apprendre beaucoup .

Quelques ressources que vous pourriez vérifier:

  • HTMLayout.NET : moteur de rendu HTML / CSS et gestionnaire de disposition rapide, léger et intégrable .
  • GeckoFX : contrôle Windows Forms qui intègre le contrôle du navigateur Mozilla Gecko dans toute application Windows Forms.
  • SwiftDotNet : un navigateur basé sur Webkit en C #
  • Gecko DotNetEmbed
  • Gecko#
  • Rendu d’une page Web – étape par étape

Mais vu le sharepoint vue réaliste , l’énorme effort nécessaire pour le coder à partir de zéro m’a rappelé cette bande dessinée:

http://soffr.miximages.com/browser/2009-02-25-coding-overkill.png

Bonne chance 🙂

C’est un projet incroyablement ambitieux (en particulier pour un développeur unique), mais quelque chose que j’aimerais faire un jour – vous pourriez apprendre beaucoup de choses.

Je ne connais pas beaucoup le fonctionnement des protocoles (quelque chose que vous devez absolument rechercher) ou ce qui se passe dans un navigateur, mais la source des navigateurs open-source, principalement Chrome et Firefox. Chrome est un projet particulièrement intéressant, car ils ne font que commencer avec ce que je pense: le chrome et le backend du navigateur. Oubliez d’abord la création d’un moteur de rendu: utilisez Webkit ou Gekko.

Vous voulez dire en écrivant votre propre moteur de rendu?

Je ne peux que dire bonne chance. De nombreuses années ont été consacrées à la génération actuelle des différents navigateurs. Si vous voulez faire mieux que l’un d’eux, vous aurez besoin de compétences sérieuses. Si vous devez vous demander par où commencer, vous avez probablement plus de quelques années d’étude à faire avant de tenter une telle tâche.

Cela dit, voici quelques indications (évidentes):

  1. écrire beaucoup de code qui fait de petites choses, comme résoudre tous les problèmes de projecteuler.net
  2. apprendre tout ce que vous pouvez sur votre trousse d’outils et ses normes communautaires
  3. écrire beaucoup plus de code
  4. avoir une réelle compréhension des machines à états finis
  5. écrire encore plus de code
  6. Tout savoir sur la stack TCP / IP et comment elle est utilisée pour http
  7. apprendre tout ce que vous pouvez sur http
  8. apprendre les standards (html, xml, sgml, css)
  9. Célébrez votre 150ème anniversaire.
  10. lancez le projet de navigateur proprement dit.

éditer ci-dessous ici

Je ne voulais pas que ce soit motivant ou démotivant, juste une tentative de vous montrer qu’un navigateur est un très gros projet et que de très gros projets nécessitent beaucoup de reflection. Honnêteté émoussée parsemée d’humour.

J’ai programmé pour plus des deux tiers de ma vie et j’aime penser que je suis un programmeur assez décent, mais il serait insensé de penser que je serais à moitié capable d’écrire un navigateur Web décent à partir de zéro .

Bien sûr, si c’est ce que vous voulez faire, ne laissez pas mon commentaire vous en empêcher. Vous pouvez probablement faire mieux que Internet Explorer.

La plupart des navigateurs Web modernes sont des bêtes géantes, et probablement mal conçues car elles (et le Web lui-même) ont évolué de manière assez aléatoire.

Vous devez d’abord commencer par rendre les objectives de votre projet (et ce que vous espérez atteindre) très explicites. Est-ce quelque chose que vous faites simplement pour vous amuser, ou vous attendez-vous à ce que d’autres personnes utilisent votre navigateur? Si vous vous attendez à ce que d’autres l’utilisent, quelle sera leur motivation? Il est irréaliste de penser que vous développerez un nouveau navigateur à partir de zéro que tout le monde pourra utiliser en remplacement de Chrome, Safari, Firefox, IE, Opera, etc. Tous ces projets ont un début de 10 à 15 ans sur vous, et au moment où vous les avez rattrapés, ils seront encore 10-15 ans devant vous. De plus, ils ont beaucoup plus de puissance derrière eux, et si vous voulez que votre projet soit couronné de succès, vous aurez besoin de ce pouvoir à un moment donné.

C’est la raison pour laquelle Apple et Google, de grandes entresockets disposant de nombreuses ressources, n’ont pas recommencé à zéro. Même Microsoft n’est pas parti de rien. L’IE original était basé sur Mosaic. Les seuls navigateurs importants encore disponibles aujourd’hui sont Opera , Konqueror et Lynx , qui ont malheureusement tous une part de marché minuscule. Oublions Lynx pour le moment, car il s’agit d’un navigateur de texte uniquement et que la seule raison pour laquelle il existe toujours est qu’il sert à ce créneau spécifique. Opera est sans doute l’un des meilleurs navigateurs jamais créés, et pourtant, sa part de marché n’a jamais été excellente, alors rappelez-vous que le succès et l’innovation ne sont pas la même chose. KHTML est le moteur de Konqueror, qui n’a jamais connu un grand succès, mais constitue la base de WebKit utilisée par Apple et Google. Je pense que l’on pourrait certainement affirmer que si KHTML n’avait jamais été créé, ni Safari ni Chrome n’existeraient. Il est intéressant de noter que KHTML et Opera ont été produits en grande partie par des programmeurs norvégiens travaillant dans le même bâtiment à Oslo.

Vous devez envisager de créer un navigateur Web semblable à un système d’exploitation, car c’est essentiellement ce qu’est un navigateur – c’est un système d’exploitation pour exécuter des applications Web. Et comme un système d’exploitation, un navigateur Web est un logiciel très complexe comportant de nombreux composants. Bien sûr, les gens ont réussi à créer de nouveaux systèmes d’exploitation à partir de rien. On pense à Linus Torvalds. Il a créé Linux, l’un des systèmes d’exploitation les plus performants de tous les temps.

Bien sûr, vous êtes confronté à un défi supplémentaire, qui rend la création d’un nouveau navigateur performant plus difficile que la création d’un nouveau système d’exploitation performant . Les navigateurs sont censés exécuter parfaitement tous les codes existants qui circulent sur le Web. Supposons maintenant que Linus Torvalds ait été informé que son nouvel OS n’aurait aucune importance à moins d’être parfaitement compatible avec UNIX ou un système d’exploitation existant. Je doute qu’il se soit dérangé et Linux n’existerait probablement pas aujourd’hui. En réalité, bien sûr, la seule raison pour laquelle Linux est devenu populaire, c’est parce qu’il a été bien conçu et que le projet GNU a été capable de créer des outils permettant de porter d’énormes quantités de code existant sur Linux. Sans le soutien idéologique de GNU pour Linux, cela n’aurait jamais eu de chance.

Donc, en supposant que vous soyez vraiment ambitieux (ou téméraire) pour essayer de créer un nouveau navigateur réussi, vous devez vous concentrer sur l’ architecture et le design . Il n’y a aucune raison pratique de créer un nouveau navigateur à partir de rien, sauf si vous êtes certain de pouvoir améliorer la conception des navigateurs existants d’une manière ou d’une autre. Cela signifie que vous devez vous familiariser suffisamment avec le code de WebKit et de Gecko pour comprendre les décisions de conception qu’ils ont sockets, mais vous ne devriez pas essayer de copier leur conception car vous pourriez aussi bien utiliser leur code.

Mes pensées personnelles (sans avoir fait suffisamment de recherches) sont que les navigateurs d’aujourd’hui ne sont pas assez modulaires. Si je devais créer un nouveau navigateur, je trouverais un moyen de faciliter l’échange d’informations (comme remplacer un moteur JavaScript par un autre) et donner à l’utilisateur un plus grand contrôle qu’il n’a actuellement sur les navigateurs existants. . Les navigateurs modernes et les concepteurs de sites Web ont pris presque tout le contrôle de l’utilisateur. Pourquoi l’utilisateur ne peut-il pas dire au navigateur Web comment je souhaite que le contenu soit affiché sur ma machine? Le HTML original ne donnait que des directives sur la manière de structurer le contenu, et au fil du temps, les nouvelles normes sont devenues de plus en plus dogmatiques, à tel point que l’utilisateur est désormais à la merci totale du concepteur Web. L’attrait de Linux était qu’il redonnait le contrôle à l’utilisateur, et c’est pourquoi tant de geeks l’ont soutenu et en ont fait un système d’exploitation performant.

L’autre chose que je passerais du temps à faire de la recherche, si j’étais vous, concerne les principes de conception du système d’exploitation. Concevoir un bon navigateur, du moins en théorie, requirejs les mêmes principes que la conception d’un bon système d’exploitation – en particulier en ce qui concerne les processus concurrents, les modèles de sécurité, etc.

Enfin, après avoir fait beaucoup de recherches, vous devriez commencer à coder:

  1. Réorganisez Mosaic , mais avec vos propres idées de conception. C’est aussi ce que je suggérerais si vous le faites simplement pour le plaisir ou pour votre propre bénéfice éducatif. Lisez les spécifications HTML 1.0 et HTML 2.0 originales, ainsi que les spécifications HTTP 1.1 et les spécifications URI actuelles, et assurez-vous que votre navigateur respecte toutes ces spécifications. Vous pouvez bien sûr télécharger des logiciels existants qui traitent déjà les protocoles de transport, les conventions URI, etc. mais si vous envisagez sérieusement de concevoir votre propre navigateur, je pense que c’est un bon exercice de faire ces choses à partir de rien. une bonne idée de la manière dont toutes les pièces du puzzle s’emboîtent. À la fin de l’étape 0, vous devriez avoir un navigateur au moins comparable à celui de l’état de la technique dans les années 90. C’est une bonne première étape. Et vous pouvez télécharger la mosaïque originale à l’ adresse ftp://ftp.ncsa.uiuc.edu/Mosaic/ et voir comment elle se compare à votre navigateur. C’est également un bon exercice pour voir comment les sites Web actuels sont affichés dans un ancien navigateur tel que Mosaic.

  2. Ajoutez le support pour le DOM à votre navigateur. Concentrez-vous sur les DOM DOM 1 et 2 du W3C, car pratiquement tous les navigateurs actuels les prennent en charge complètement. Ensuite, regardez les niveaux 3 et 4. Le DOM est extrêmement fondamental pour la programmation Web. Si vous envisagez de créer un navigateur Web moderne, sa conception doit en tenir compte. Étant donné que vous écrivez le navigateur en C #, vous voudrez peut-être prendre en considération la manière dont vous pouvez exploiter le modèle d’object .NET existant à votre avantage.

  3. Regardez les moteurs de script existants et voyez si vous pouvez les porter sur votre projet. Je vous découragerais d’écrire votre propre interpréteur JavaScript, non seulement parce que c’est un très gros projet en soi, mais aussi parce que beaucoup de travail a déjà été fait pour optimiser les compilateurs JS (par exemple, V8). Donc, à moins d’être un gourou dans la conception du compilateur, votre interpréteur JS construit à la main sera probablement inférieur à ce qui existe déjà, même s’il suit parfaitement les spécifications EMCAScript. Encore une fois, je pense que le moteur de script devrait être un module complètement séparé du navigateur actuel, donc je pense qu’il serait beaucoup plus utile d’avoir un framework qui vous permette de remplacer n’importe quel moteur de script plutôt que de créer un moteur de script cela ne fonctionne qu’avec votre navigateur.

  4. Regardez le code source HTML / CSS / JS pour les 10 à 20 meilleurs sites Web en Amérique du Nord (Google, Facebook, YouTube, Twitter, Wikipedia, Amazon, plates-formes de blogs populaires, etc.) . Il s’agit d’un problème un peu plus facile à résoudre que de créer un navigateur qui respecte toutes les normes existantes (ce que les navigateurs actuels ne font toujours pas parfaitement) rendant un navigateur qui rend correctement tous les sites Web sur le Web (personne ne peut le faire). fais ça). Les gens vont se plaindre que votre navigateur enfreint les normes, etc. Je ne peux pas penser à un navigateur qui a correctement suivi toutes les normes (ou même la plupart) lors de sa première version, alors je dis même pas la peine d’essayer. Si vous pouvez créer quelque chose que les gens voudront utiliser suffisamment pour qu’il y ait toujours une 2ème ou 3ème version, vous pouvez alors vous soucier des standards.

Udacity a maintenant un cours intitulé “Construire un navigateur Web” – https://www.udacity.com/course/programming-languages–cs262

Comme tout le monde l’a déjà dit, un navigateur Web est un énorme projet. Vous devez vous soucier de TCP / IP et de sockets, rendre le HTML, utiliser css, créer un modèle DOM, exécuter javascript, gérer le balisage et le code malformés et gérer tous les types de fichiers avant même de penser un navigateur (c.-à-d. signets, historique, navigation privée, sécurité, etc.) C’est un énorme projet.

Cela étant dit, cela peut être fait. Ma suggestion serait d’aller regarder la source de Firefox. Je sais que vous avez dit vouloir créer un navigateur à partir de rien, mais il serait très utile d’ apprendre d’abord un projet open source.

Je téléchargerais la source de Firefox et la supprimerais lentement. En d’autres termes, je prendrais la source et supprimerais toutes les fonctionnalités de bookmarking. Ensuite, je supprimerais la possibilité de gérer les addons. Ensuite, je supprimerais tout le code concernant la sauvegarde des fichiers. Je continuerais ce processus jusqu’à ce que je reçoive un navigateur Web très simple. Je regarderais ce code.

Ensuite, je commencerais à construire le mien. J’accepterais les connaissances acquises en démontant Firefox, et je le mettrais dans la construction d’un nouveau navigateur.

Beaucoup de chance pour vous!

Vous pourriez commencer avec un XHTML bien formé et valide, ce qui devrait être plus facile que la soupe de tag que votre navigateur rencontrera dans une vraie “vie”.

Ensuite, vous devez trouver un moyen de plier le vrai HTML du Web à vos besoins.

Mais ne vous en faites pas: un navigateur n’est pas un petit projet.

… alors commence à s’inquiéter de la sécurité

(les préoccupations non fonctionnelles et transversales devraient généralement être considérées comme telles :))

projet très ambitieux mais un développeur ne peut pas le faire tout seul; vous avez besoin d’une équipe (chef de projet, testeurs …) et peut-être devriez-vous revoir votre choix de langue c # fonctionne uniquement sur Windows même) de toute façon je vous souhaite bonne chance et je serai heureux d’utiliser votre navigateur: D

Vous avez vraiment beaucoup de temps libre dans votre main, n’est-ce pas? AFAIK, la plupart des navigateurs ont été écrits en C ++, tous les utilisateurs n’ont pas le framework .NET installé sur leurs ordinateurs et s’ils le font, ce n’est peut-être pas la version dont vous avez besoin.

Cela pourrait vous prendre des années, mais de toute façon, il existe de nombreux navigateurs open source, FireFox, Google Chrome, etc., vous pouvez commencer par consulter le code, bonne chance avec ça 🙂