J’ai essayé de créer un petit navigateur en 8 semaines.
(github.com/beginner-jhj)Bonjour ! Je suis un lycéen de terminale sur le point d’entrer en école d’informatique.
Pendant 8 semaines, j’ai créé à partir de zéro un petit moteur de navigateur avec C++ et Qt.
Comme c’était ma première expérience avec C++, j’ai connu de nombreux tâtonnements, mais j’ai énormément appris en transposant directement en code les éléments clés du pipeline de rendu.
J’ai implémenté l’ensemble du pipeline de rendu en 5 étapes :
-
Analyse de chaînes HTML pour générer un arbre DOM (avec correction des erreurs)
-
Parsing des règles CSS et calcul des styles calculés via la cascade
-
Calcul de la position et de la taille des boîtes sur la base du modèle block/inline
-
Mise en cache et chargement des images, puis recalcul de la mise en page (
Reflow) -
Painting final à l’aide du Qt Graphics View Framework
Comme le code a été écrit dans un C++ que j’apprenais tout juste, il peut comporter pas mal d’imperfections.
Je serais très reconnaissant de recevoir vos retours sur la structure du code ou les pistes d’amélioration !
Vous trouverez plus de détails sur https://github.com/beginner-jhj/mini_browser/blob/main/README.ko.md.
14 commentaires
D’abord, tous mes encouragements.
Avoir eu l’idée de créer un navigateur web…
Maintenant que vous avez acquis une belle expérience…
ce pourrait être une bonne idée de télécharger le code de Chromium…
de le compiler
et de vous exercer aussi à l’analyser.
Après tout, la création est la mère de l’imitation.
C’est un travail intéressant. Je me dis que vous auriez peut-être pu apprendre davantage en le faisant directement sans utiliser Claude, mais comme l’usage de l’IA est la grande tendance, cela me semble malgré tout une bonne expérience.
Si je peux me permettre une idée, pourquoi ne pas créer un parseur de balises OG en vous appuyant sur cette expérience ?
Les balises OG sont de brèves informations définies sur une page web, comme l’image de vignette représentative. Les récupérer est simple avec un parseur DOM, mais le problème est qu’un parseur DOM est lourd.
Ainsi, au lieu d’utiliser un autre parseur DOM et de parser l’ensemble du DOM, si vous implémentez un parseur petit et efficace qui se contente de récupérer les informations de certaines balises, cela pourrait devenir une bibliothèque utile.
J’ai particulièrement ressenti ce manque dans les applications mobiles. Si vous le développiez pour le mobile en utilisant les langages JavaScript/Kotlin/Swift, cela pourrait devenir une bibliothèque open source populaire.
Je me souviens surtout avoir profité à fond de la période entre la fin du CSAT et l’entrée à l’université… Mais en lisant le README, on dirait que vous avez bien compris les points essentiels. Moi aussi, après avoir lu ce livre, j’avais essayé de l’implémenter en
swift. HahaOh, de quel livre s’agit-il, par hasard ? J’ai lu le README, mais je n’ai pas l’impression qu’il y ait une mention d’un livre... !
Il n’y a rien de tel dans le README. Comme le contenu ressemblait au livre, je me suis trompé... Désolé ;;;
Il s’agit du livre Building a Web Browser from Scratch. Les exemples du livre sont implémentés en Python.
Merci infiniment de me l’avoir signalé :D Je vais jeter un coup d’œil discret chez Kyobo Bookstore..!
Quand j’étais en terminale, comme je savais un peu installer Linux APM, je faisais le malin sur une commu de devs
waouh, pfiou
J’ai pris beaucoup de plaisir à le lire !
Je pense que le simple fait d’avoir fait l’effort d’essayer de le créer est déjà remarquable. Le README ressemblait presque à un véritable rapport, ce qui l’a rendu encore plus intéressant.
J’ai hâte de voir ce que ce sera la prochaine fois haha
C’est vraiment remarquable.
Je n’ai fait que parcourir rapidement, mais quand j’étais en terminale, je n’aurais jamais osé imaginer une telle chose. J’espère que vous continuerez à bien étudier l’informatique et que vous deviendrez un formidable ingénieur.
Merci beaucoup ! Je vais continuer à faire de mon mieux pour devenir un excellent ingénieur !
J’ai pris beaucoup de plaisir à vous lire, c’était vraiment excellent ! J’aurais une question à titre personnel : y a-t-il un moyen de vous contacter ?
Merci beaucoup d’avoir pris le temps de lire ce long texte ! Vous pouvez me contacter à hj5014221@gmail.com.
Le lien est cassé, on dirait bouhou
Ah, je vous donne le lien du repo principal ! https://github.com/beginner-jhj/mini_browser