Saya mencoba membuat browser kecil selama 8 minggu.
(github.com/beginner-jhj)Halo! Saya siswa kelas 12 SMA yang akan masuk jurusan teknik komputer.
Selama 8 minggu, saya mencoba membuat mesin browser kecil dari dasar menggunakan C++ dan Qt.
Karena ini pertama kalinya saya menggunakan C++, ada banyak trial and error, tetapi saya belajar banyak dengan menerjemahkan inti dari rendering pipeline langsung ke dalam kode.
Saya membagi implementasi seluruh rendering pipeline menjadi 5 tahap:
-
Menganalisis string HTML untuk membuat pohon DOM (termasuk pemulihan error)
-
Parsing aturan CSS dan menghitung Computed Style melalui Cascade
-
Menghitung posisi dan ukuran kotak berdasarkan model block/inline
-
Menangani cache dan pemuatan gambar lalu menghitung ulang layout (Reflow)
-
Painting akhir menggunakan Qt Graphics View Framework
Karena kodenya ditulis dengan C++ yang baru saya pelajari, mungkin masih banyak kekurangannya.
Saya akan sangat berterima kasih jika Anda bisa memberi masukan tentang struktur kode atau arah perbaikannya!
Detail lebih lanjut bisa dilihat di https://github.com/beginner-jhj/mini_browser/blob/main/README.ko.md.
14 komentar
Pertama-tama, saya dukung Anda.
Memutuskan untuk membuat web browser saja sudah luar biasa..
Sekarang karena Anda sudah mendapatkan pengalaman yang bagus..
Anda bisa mengunduh kode Chromium..
mencoba build-nya
dan juga mendapatkan pengalaman menganalisisnya.
Karena kreasi adalah ibu dari peniruan.
Pekerjaan yang Anda lakukan menarik. Saya merasa mungkin akan bisa belajar lebih banyak jika dikerjakan langsung tanpa menggunakan Claude, tetapi karena memanfaatkan AI sudah menjadi arus utama, ini juga tampaknya pengalaman yang bagus.
Sebagai satu ide, bagaimana kalau berdasarkan pengalaman ini Anda mencoba membuat parser
og tag.og tagadalah informasi sederhana seperti gambar thumbnail utama yang disetel pada halaman web; mengambilnya memang pekerjaan yang mudah jika memakai DOM parser, tetapi ada masalah bahwa DOM parser itu berat.Jadi, alih-alih memakai DOM parser lain dan mem-parsing seluruh DOM, jika Anda mengimplementasikan parser kecil dan efisien yang hanya mengambil informasi tag tertentu, itu bisa menjadi library yang berguna.
Khususnya di aplikasi mobile, saya merasa cukup disayangkan belum ada library seperti ini. Jika dibuat untuk mobile menggunakan bahasa javascript/kotlin/swift, ini bisa menjadi library open source yang populer.
Saya cuma ingat bersenang-senang habis-habisan setelah CSAT selesai sampai masuk kuliah... Tapi setelah membaca README-nya, sepertinya Anda memahami poin-poin intinya dengan sangat baik. Saya juga pernah membaca buku ini lalu mencoba mengimplementasikannya dengan Swift. hehe
Wah, ini buku apa ya? Saya sempat membaca README-nya, tapi sepertinya tidak melihat ada penyebutan buku...!
README tidak memuat isi seperti itu. Karena isinya mirip dengan bukunya, saya jadi salah paham... maaf;;;
Bukunya berjudul 'Web Browser dari Dasar'. Contoh di buku tersebut diimplementasikan dengan Python.
Terima kasih banyak sudah memberi tahu :D Sepertinya saya harus coba mengintipnya di Kyobo Book Centre..!
Waktu kelas 3 SMA, cuma karena sedikit bisa instal APM Linux, aku sempat belagu di komunitas developer.
Wah, gila sih, serem banget
Seru sekali dibacanya!
Menurut saya, fakta bahwa Anda sudah berusaha dan mencoba membuatnya saja sudah kelas satu. README-nya terasa seperti sebuah laporan, jadi makin menarik untuk dibaca.
Saya jadi menantikan apa yang akan Anda buat berikutnya, hehe
Anda benar-benar luar biasa.
Saya sempat melihat sekilas, dan saat saya kelas 12 SMA saya bahkan tak berani membayangkan hal seperti ini. Semoga Anda terus belajar CS dengan baik dan menjadi engineer yang hebat.
Terima kasih! Saya akan terus berusaha keras dan berkembang menjadi engineer yang hebat!
Saya sangat menikmati membacanya! Secara pribadi ada yang ingin saya tanyakan, apakah ada cara untuk menghubungi Anda?
Terima kasih banyak sudah membaca tulisan panjang ini! Silakan hubungi saya di hj5014221@gmail.com.
Tautannya rusak ya :(
Ah, saya berikan tautan repo utamanya! https://github.com/beginner-jhj/mini_browser