Dev Study
← ブラウザ・エンジン

ブラウザ・エンジン

60 カテゴリ・1200

Chromiumとは(やさしい)

20

Chromiumはより安全・高速・安定したWeb体験を目指すオープンソースのブラウザプロジェクトです。ChromeやEdgeなど多くのブラウザの土台となっているChromiumの正体と、Chromeとの違いをやさしく学びます。

Chromiumとは(ふつう)

20

Chrome・Chromium・各種派生ブラウザの違いが実務にどう効くのかを一段深く学びます。コーデックや独自機能の差、オープンソースのガバナンス、ビルドの違いといった、基礎編より踏み込んだ視点を扱います。

Chromiumの設計思想(むずかしい)

20

Chromiumのガバナンス、BlinkがWebKitからforkされた経緯の考え方、Electron/CEF/WebViewといったエンベッダとの関係、互換性方針までを上級者向けに掘り下げます。表面的な「オープンソースだから」では選べない、設計判断の背景を問います。

Chromiumのプロセス構成(やさしい)

20

Chromiumは1つの巨大なプログラムではなく、役割の違う複数のプロセスに分かれて動いています。ブラウザプロセス・レンダラープロセス・GPUプロセスなどの役割分担と、なぜわざわざ分けるのか(安定性とセキュリティ)をやさしく学びます。

Chromiumのプロセス構成(ふつう)

20

マルチプロセス設計のトレードオフや、プロセスをどう分けるかの方針(プロセスモデル)、各プロセスの責務の境界を一段深く学びます。なぜメモリを犠牲にしてまで分けるのか、どこで分けるのかという設計判断を扱います。

プロセスモデルの深層(むずかしい)

20

SiteInstanceとBrowsingInstanceの違い、プロセスの割り当てと上限、プロセス再利用といったChromiumのプロセスモデルの核心を上級者向けに扱います。マルチプロセスの「なぜ」と、その境界がどこに引かれるかを問います。

Blinkとレンダリングの基礎(やさしい)

20

BlinkはChromiumのレンダリングエンジンで、レンダラープロセスの中で動きます。HTMLの解析からDOMの構築、CSSの適用、レイアウト、ペイント、合成へと進む、画面が表示されるまでの一連の流れをやさしく学びます。

レンダリングパイプライン(ふつう)

20

Style→Layout→Paint→Compositeという描画の流れを一段深く学びます。reflowとrepaintの違い、コンポジタだけで動く軽いアニメ、property treesといった、なぜ特定の変更が軽く別の変更が重いのかを扱います。

RenderingNGの深層(むずかしい)

20

property trees、CompositeAfterPaint、compositorだけで完結するアニメの条件、content-visibilityなど、RenderingNGの内部設計を上級者向けに掘り下げます。各フェーズがなぜ分かれているのか、性能特性の理由を問います。

ChromiumとV8・JS実行(やさしい)

20

ChromiumでJavaScriptを動かしているのがV8というエンジンです。V8がどこで何をしているのか、HTMLやDOMを扱うBlinkとどう協力しているのか、なぜ速く動くのかを、初学者向けにやさしく学びます。

BlinkとV8の連携(ふつう)

20

レンダラープロセス内でBlink(レンダリングエンジン)とV8(JavaScriptエンジン)がどう連携するかを一段深く学びます。DOMとJSのバインディング、メインスレッドの仕事、イベントループとの関係を扱います。

BlinkとV8の境界(むずかしい)

20

DOMとJavaScriptをつなぐバインディング(ラッパ)、GCをまたぐオブジェクト参照、メインスレッド上でのBlinkとV8の協調を上級者向けに掘り下げます。2つの異なる管理下のオブジェクトをどう橋渡しするかを問います。

サンドボックスとセキュリティ(やさしい)

20

Chromiumは、Webページを描くレンダラーをサンドボックスという隔離された環境で動かし、万一悪意あるサイトに侵入されても被害が広がりにくいよう設計されています。サンドボックス・最小権限・Site Isolationという、Chromiumのセキュリティの土台をやさしく学びます。

サンドボックスとSite Isolation(ふつう)

20

最小権限とブローカー経由のアクセス、Site Isolationの目的(Spectreやクロスサイトの情報漏洩防止)、そしてプロセス分離の限界を一段深く学びます。なぜサイト単位で分けるのか、何を防ぎ何を防げないのかを扱います。

Site Isolationとサンドボックスの深層(むずかしい)

20

Spectre等の投機実行サイドチャネル、Universal XSS、プロセス境界=セキュリティ境界という原則、サンドボックス・エスケープの難しさを上級者向けに掘り下げます。なぜプロセス分離が防御として効くのかを問います。

OOPIFとフレーム分離(むずかしい)

20

クロスサイトiframeの別プロセス描画、複数プロセスにまたがる合成の仕組み、プロセス同居による最適化を上級者向けに掘り下げます。1つのページが複数プロセスで描かれる仕組みと、その境界を問います。

プロセス間通信(Mojo)の基礎(やさしい)

20

Chromiumは仕事を複数のプロセスに分けているため、それらが連携するにはプロセス間通信(IPC)が欠かせません。MojoというIPCの仕組みや、ブラウザ側とレンダラー側を結ぶRenderProcessHost/RenderProcess、RenderFrameHost/RenderFrameの関係をやさしく学びます。

Mojoとプロセス間通信(ふつう)

20

Chromiumのプロセス間通信を担うMojoを一段深く学びます。.mojomによるインターフェース定義、メッセージパイプ、型付きIPCの利点、同期と非同期の違いといった、なぜ安全なプロセス間連携が成り立つのかを扱います。

Mojoの深層(むずかしい)

20

associated interfaces、同期呼び出しのコスト、capability(権限)の受け渡し、メッセージパイプの順序保証など、ChromiumのIPC基盤Mojoの設計を上級者向けに掘り下げます。プロセス間通信のトレードオフを問います。

Chromiumのネットワークと読み込み(やさしい)

20

Chromiumがどうやってインターネットからページのデータを取ってくるかをやさしく学びます。ネットワーク処理を専門に担うネットワークサービス、レンダラーとの関係、リソースの読み込みやキャッシュの基礎を扱います。

ネットワークサービスと読み込み(ふつう)

20

通信を担うネットワークサービスのプロセス分離と、その上で動くHTTPキャッシュ、Cookie、プロトコル処理の集約を一段深く学びます。なぜ通信を1か所にまとめるのか、キャッシュがどう効くのかを扱います。

ネットワークとキャッシュの深層(むずかしい)

20

キャッシュパーティショニング、HTTPキャッシュのキー、プリフェッチ/プリロードの判断、ネットワークサービスのプロセス分離などを上級者向けに掘り下げます。性能とプライバシー・セキュリティのトレードオフを問います。

Chromiumプロジェクトの仕組み(やさしい)

20

Chromiumはオープンソースとして運営されるブラウザプロジェクトで、ソースコードの公開・課題トラッカー・リリースの仕組みなどが整っています。プロジェクトの運営方法やリリースチャンネル(stable/beta/dev/canary)の考え方をやさしく学びます。

リリースチャンネルと開発フロー(ふつう)

20

Canary・Dev・Beta・Stableという段階的なリリースチャンネルの役割と、品質ゲートの考え方、フィーチャーフラグによる段階的な機能投入を一段深く学びます。なぜ段階を分けるのか、各段階で何を確かめるのかを扱います。

タブとプロセスモデル(やさしい)

20

Chromiumは複数のプロセスに仕事を分けるマルチプロセスモデルを採用しています。タブの中身を描くレンダラープロセスとタブの関係や、1つのタブが落ちても全体に波及しにくい「クラッシュの局所化」、分けることの利点と費用のバランスをやさしく学びます。

スレッドとイベントループ(ふつう)

20

レンダラー内のメインスレッド・コンポジタスレッド・ワーカーの役割分担と、タスクキューによる処理、ジャンク(描画の引っかかり)の原因を一段深く学びます。なぜスレッドを分けると滑らかになるのかを扱います。

スレッドとスケジューリング(むずかしい)

20

メイン/compositor/ラスタの分担、タスクの優先度、jankとrequestAnimationFrame、入力応答との両立を上級者向けに掘り下げます。限られたスレッド資源をどう配分すれば滑らかさと応答性を保てるかを問います。

デベロッパーツールと標準対応(やさしい)

20

Chromiumに組み込まれたデベロッパーツール(DevTools)は、ページの要素検査やコンソール、ネットワーク確認、パフォーマンス計測などで開発とデバッグを助けます。ここではDevToolsの役割、Web標準への準拠、外部からブラウザを操作するCDP(Chrome DevTools Protocol)の基礎をやさしく学びます。

DevToolsとCDP(ふつう)

20

Chrome DevTools Protocol(CDP)の仕組みと、それを利用する自動化ツール(Puppeteer/Playwright)、そして性能やメモリの計測を一段深く学びます。なぜ外部ツールがブラウザを制御・計測できるのかを扱います。

CDPと計測の深層(むずかしい)

20

CDP(Chrome DevTools Protocol)のドメイン、トレース計測、メモリやパフォーマンス解析の読み方を上級者向けに掘り下げます。計測ツールが何を測り、その数値をどう解釈すべきかを問います。

V8とは(やさしい)

20

V8がどんなソフトウェアで、何のために作られ、どこで使われているのかを学びます。Chrome や Node.js を支えるエンジンとしての基本像をつかむ入門編です。

V8の全体像(ふつう)

20

V8がブラウザやNode.jsにどう組み込まれ、IsolateやContextといった単位でどう実行されるのかを一段深く学びます。シングルスレッド実行モデルや、エンジンと組み込み先の役割分担を理解する章です。

V8の値表現(むずかしい)

20

V8が値をメモリ上でどう表現しているかを、タグ付きポインタ・SMI・HeapNumber・ポインタ圧縮・Sandboxの観点から深掘りします。内部表現とメモリレイアウト、性能やセキュリティとの結びつきを理解する上級編です。

V8の実行パイプライン(やさしい)

20

V8がソースコードを実行するまでの流れ(パース→Ignition→Sparkplug→Maglev→TurboFan)の全体像を学びます。なぜ段階的に最適化していくのか、その狙いをつかむ章です。

実行ティアの設計(ふつう)

20

Ignition・Sparkplug・Maglev・TurboFanという複数ティアが、なぜその役割分担になっているのかを一段深く学びます。ティアアップの判断、各コンパイラのトレードオフ、起動とピーク性能の両立を理解する章です。

最適化パイプラインの深層(むずかしい)

20

V8がコードを段階的に最適化していく多層パイプラインを深掘りします。On-Stack Replacement、ティア間の乗り換え、フィードバックベクタを使ったウォームアップなど、なぜその設計が速さにつながるのかを理解する上級編です。

Ignitionとバイトコード(やさしい)

20

V8のインタプリタであるIgnitionと、それが生成するバイトコードについて学びます。なぜバイトコードを経由するのか、起動の速さやメモリ効率の観点から理解する章です。

パースとバイトコード(ふつう)

20

V8がソースを読み込み、バイトコードへ変換するまでの工夫を一段深く学びます。遅延パースやプリパース、バイトコードキャッシュが起動時間にどう効くのかを理解する章です。

バイトコードと内部表現(むずかしい)

20

V8のインタプリタが扱うバイトコードの内部表現を深掘りします。レジスタベースの仮想マシン、アキュムレータ、バイトコードのキャッシュ、パースの遅延判断など、起動性能とメモリ効率を支えるしくみを理解する上級編です。

JITコンパイルと最適化(やさしい)

20

実行中にコードを機械語へ変換するJITコンパイルと、Sparkplug・Maglev・TurboFanの役割分担を学びます。ホットなコードがどのように段階的に速くなるかを理解する章です。

JIT最適化の仕組み(ふつう)

20

実行中にコードを機械語へ最適化するJITの仕組みを一段深く学びます。ホットコードの検出、実行フィードバックの活用、Sparkplug/Maglev/TurboFanの役割分担の理由を理解する章です。

投機的最適化の深層(むずかしい)

20

V8の最適化コンパイラが行う投機的最適化を深掘りします。型ガード、インライン化、範囲解析、エスケープ解析など、観測データを前提に大胆な最適化を行いつつ安全性を保つしくみを理解する上級編です。

投機的最適化と脱最適化(やさしい)

20

V8が実行時の型情報をもとに行う投機的最適化と、前提が崩れたときに起こる脱最適化(deopt)を学びます。なぜ型を安定させると速いのか、その理由を理解する章です。

投機と脱最適化の実際(ふつう)

20

投機的最適化と脱最適化(deopt)が実際のコードでどう起きるのかを一段深く学びます。deoptを誘発する書き方、モノ/ポリ/メガモーフィック、型の安定が速度に効く理由を理解する章です。

脱最適化の深層(むずかしい)

20

最適化コードが前提を裏切られたときに起きる脱最適化(deoptimization)を深掘りします。eager/lazyの違い、deopt理由、deoptループ、フィードバック汚染といった、性能が突然崩れる原因を理解する上級編です。

Hidden Classesとオブジェクトの形(やさしい)

20

V8がオブジェクトを高速に扱うためのHidden Classes(隠しクラス、内部的にはMap/Shape)を学びます。同じ形を共有するとなぜ速いのか、その仕組みを理解する章です。

Hidden Classesを活かす(ふつう)

20

Hidden Class(オブジェクトの「形」)を最適化に活かす書き方を一段深く学びます。形の共有を保つコツ、動的なプロパティ追加・削除の害、packed/holey配列の違いを理解する章です。

Mapとトランジションの深層(むずかしい)

20

V8がオブジェクトの形を管理するMap(Hidden Class)とそのトランジションを深掘りします。プロパティ追加順による形の共有、配列のelements_kindの一方向遷移、fast/dictionaryモードへの劣化など、性能を左右する内部挙動を理解する上級編です。

インラインキャッシュ(やさしい)

20

同じ場所で繰り返されるプロパティアクセスを速くするインラインキャッシュ(IC)を学びます。モノモーフィックやメガモーフィックといった状態の意味と、なぜ形の安定が大切かを理解する章です。

インラインキャッシュの段階(ふつう)

20

プロパティアクセスを速くするインラインキャッシュ(IC)の段階を一段深く学びます。IC状態の遷移、退化を招くコード、最適化との関係を理解する章です。

ICとフィードバックの深層(むずかしい)

20

Inline Cache(IC)とフィードバックベクタの内部挙動を深掘りします。形からハンドラへの記録、モノ→ポリ→メガモーフィックの遷移、メガモーフィック時のスタブキャッシュ参照など、最適化を支える観測の仕組みを理解する上級編です。

V8のガベージコレクション(やさしい)

20

不要になったメモリを自動で回収するV8のガベージコレクション(GC)を学びます。世代別GCの考え方、若い世代と古い世代、ScavengerやMark-Sweep、Orinocoの全体像を理解する章です。

世代別GCの仕組み(ふつう)

20

V8のガベージコレクタ(Orinoco)が採る世代別の戦略を一段深く学びます。Scavengerのセミスペース方式、Mark-Sweep-Compact、世代仮説、ポーズを減らす工夫を理解する章です。

GCアルゴリズムの深層(むずかしい)

20

V8のガベージコレクタOrinocoを、三色マーキング・並行/インクリメンタル処理・ライトバリア・世代別GCといった内部アルゴリズムの観点から深掘りします。なぜその設計が停止時間やスループットに効くのかを理解する上級編です。

V8のメモリ管理(やさしい)

20

V8がメモリをどう管理するか、ヒープとスタックの違い、メモリリークの考え方、GCとの関係を学びます。安定して動くアプリの土台になるメモリの基礎をつかむ章です。

メモリとリークの実際(ふつう)

20

スタックとヒープ、Write barrier、そして実際に起こるメモリリークのパターンを一段深く学びます。クロージャやイベントリスナ、タイマーによるリークと、ヒープスナップショットの考え方を理解する章です。

オブジェクトのメモリ表現(むずかしい)

20

V8がオブジェクトのプロパティや配列要素を実際にどうメモリへ配置するかを、in-object/out-of-objectプロパティ・fast/dictionaryモード・backing storeの観点から深掘りします。バイトがどこに置かれ、なぜそれが速さに効くのかを理解する上級編です。

V8の組み込みとWebAssembly(やさしい)

20

V8を自分のC++アプリに組み込むEmbedding API(Isolate/Context/Handleなど)と、Node.jsでの利用、WebAssembly対応を学びます。V8が「部品」として使われる姿をつかむ章です。

組み込みとWasmの実際(ふつう)

20

V8を他のソフトに組み込む際のIsolate・Context・Handleの役割と、WebAssemblyの実行を一段深く学びます。Node.jsでの統合や、WasmのLiftoff/TurboFanという2段構成を理解する章です。

組み込みとWasmの深層(むずかしい)

20

V8を他のソフトに組み込む際のIsolate・Context・Handle/HandleScope・Persistentやマイクロタスクの扱い、そしてWebAssemblyのLiftoff/TurboFan二段構成やJS↔Wasm境界のコストを深掘りします。エンジンを使う側から見た内部挙動を理解する上級編です。