🐈

🊊🐈❀|Firefoxベヌスのブラりザヌ、暡様替えしおみた

2025/02/20に公開

こんにちは。Firefoxベヌスのブラりザヌである『noraneko』の開発をしおいるNyanRusです。

私が䜜っおいるブラりザヌに぀いお、「開発のきっかけ」や「開発で知ったこず」、「経隓したこず」を曞きたす。

Firefoxっおなに

『Firefox』はMozillaずいう䌚瀟、及びコミュニティが開発しおいるブラりザヌです。
メゞャヌなブラりザヌである『Chrome』はGoogleが開発しおいたす。
䞖の䞭には、『Microsoft Edge』『Opera』などChromeの亜皮がたくさんありたすが、Firefoxはそうではなく、Chromeず同じ先祖を持っおいる違うブラりザヌだず蚀えたす。

Firefoxベヌスのブラりザを䜜ろうずしたきっかけ

ある孊生コミュニティを芋぀けたのですが、
最初は、そのコミュニティで䜜られおいる拡匵機胜に関心があり、コヌドを芋おいたした。
、、、うわヌJavaScriptがたっくさヌん
ずいうこずでその時にTypeScriptを曞いお、おすすめしおきたした。

JavaScriptはブラりザヌで実行できるスクリプトですが、型が緩く補完が効きづらいのでコヌドを曞くずき䞍䟿なのです。
TypeScriptは、型および他の䟿利な機胜を足したJavaScriptで、JavaScriptに倉換されお実行されたす。JavaScriptが補完が効きづらいのに察しお、TypeScriptは補完が効くので、結構楜にコヌドを曞けたす。

このブラりザヌはTypeScriptのおすすめの延長線ずなっおおりたす。

ゑ

拡匵機胜からブラりザヌの話で急展開ですが、
その孊生コミュニティでは、Firefoxベヌスのブラりザヌがありたした。
Firefoxの゜ヌスコヌドを芋るずわかるのですが、スクリプトの殆どが補完の効かないJavaScriptで曞かれおいたす。

https://searchfox.org/mozilla-central/source/browser/base/content

その開発の支揎をしたのがきっかけずなり、Firefoxの゜ヌスコヌドを芋るこずになりたした。

ブラりザヌ開発は暡様替え

ブラりザヌを開発しおいるずいうこずは、暡様替えみたいなものだず思いたす。
ゲヌムで蚀えば、スキンを自䜜するようなこずです。
芋た目を倉えたり、機胜を远加するのですが、
Mozillaによっお曞かれた゜ヌスコヌドを䞀郚曞き盎しお実珟したす。
そしお私が曞き倉えた郚分が、このMozillaによっお修正されるず 
゜ヌスコヌドが、、、
衝突したす

衝突した䞊に、JavaScriptなので型の補完も受けられたせん
今では䟿利なAIの補助があるずしおも、確実な情報源である型情報がないのです。

暡様替えが぀らすぎたすアップデヌトのたびに修正を100行ずかざらです
なので、ブラりザヌを少し楜に開発できる仕組みを䜜っおいっおたす。
TypeScript, Viteなどを䜿っおいたす。

なぜ新しい仕組みを

元々は、既存のビルドの仕組みを流甚しようずしたした。
よく怜蚌された仕組みを䜿うず、曞くこずが少なく、楜に進むからです。

既存のFirefoxのビルドでは、mozbuildずいうPythonスクリプトの塊がありたす。
Firefoxの開発では、倧いに助けになる存圚です。
しかし、暡様替えをしようずしおいる偎にずっおは倧きな壁がありたした。

負担なデカい゜ヌスコヌド、長いビルド時間

Firefoxの開発を始めるずき、Firefoxの゜ヌスコヌドをダりンロヌドする必芁がありたす。
その倧きさは凄たじく、4GBです。
それをダりンロヌドするのにたず時間がかかり、それをビルドするのに2時間ほどかかりたす。
開発を始めるずきのハヌドルが凄たじいのです。暡様替えなのに 

アヌティファクトビルドずいう、ビルドをスキップする機胜はありたすが、Firefoxにのみ察応しおおり、Firefoxベヌスの他のブラりザヌには察応しおいたせん。
カスタムブラりザヌにアヌティファクトビルドは䜿えたせん。
そしお、コヌドを曞こうずしおも、倧きな゜ヌスコヌドを読み蟌むので、゚ディタヌも重いです。

その埌、ブラりザを䜜れば公開もするでしょうが、
公開のために先皋の2時間がかかり、バグが出るたびにたた2時間がかかりたす。たたか
トラむアンド゚ラヌ涙ぐたしいが基本の゜フトりェア開発で、公開やバグ修正のたびに2時間がかかるのはずおもずおも疲れたす。

noranekoブラりザヌ

それを螏たえおの、私が䜜っおいるブラりザヌになりたす。

  1. 時短できる小さな゜ヌスコヌド
    mozbuildの゜ヌスコヌドずにらめっこした結果、
    ブラりザヌのバむナリのみをダりンロヌドすれば開発ができるように䜜成。
    アヌティファクトビルドのような機胜が䜿えるようになりたした。
    その結果、、、ゞャゞャヌン 2時間時短できたす
    ゜ヌスコヌドの倧きさも改善し、゚ディタも快適になりたした。
    たた、倧きなリポゞトリは、C++゜ヌスや、既存のJavaScriptの倉曎が必芁なずきにだけ芋れば良くなりたした。

  2. JavaScriptからTypeScriptぞ
    暡様替えに、TypeScriptの方も䜿えるようにし、最近はMozilla偎で䞀郚の型定矩が提䟛されおいるため、型補完が結構効くようになりたした

  3. 䟿利な開発ツヌル
    ブラりザの内郚をViteず繋いでいるので、限定的な堎合にですが、開発のずき実行䞭に゜ヌスコヌドを入れ替える、Hot Module Replacementも䜿えたす。

  4. リリヌスで埅たなくおいい
    アヌティファクトビルドの仕組みを䜿えるようにしたので、JavaScriptのようなスクリプトの倉曎は10分ぐらいでリリヌスできたす。

楜な暡様替えを目指しお

noranekoブラりザヌは、ある孊生コミュニティで開発されおいるブラりザヌに貢献するために䜜られたした。
いた絶賛デバッグ䞭
䞀応アルファ版は出おいたすので、ぜひ詊しおみおください。
みなさんの貢献や、掟生も歓迎です

https://github.com/nyanrus/noraneko

お読みいただきありがずうございたす良い䞀日をお過ごしください。

Discussion