ウェブの特別な機能の一つに、構成可能性があります。ウェブページには、さまざまなリソースが含まれており、複数のオリジンから提供される可能性があります。
Blink は、 Chromium ベースのブラウザ（Chrome、 Android WebView、Microsoft Edge、Opera、Brave など）のレンダリング エンジンとして機能します。
レンダリング エンジンは、HTML、CSS、JavaScript コードと、画像やその他のリソースを、ユーザーが表示して操作できるウェブページに変換するウェブブラウザのコンポーネントです。
Blink はどのようにウェブページをレンダリングするのですか？
Blink は、HTML、CSS、JavaScript、動画、画像など、必要なすべてのリソースを収集してレンダリング プロセスを開始します。これらのリソースを取得するために、Blink は Chromium と基盤となるオペレーティング システムのネットワーク スタックとのやり取りを管理します。
CSS と HTML が読み込まれるとすぐに、Blink はテキスト形式のコードを操作可能な表現に変換できます。これは「解析」と呼ばれます。 JavaScript も解析してから実行する必要があります。
すべてが完了すると、Blink は「レンダリング」を開始します。レンダリングとは、ユーザーが表示して操作するウェブページをレイアウトして表示する作業です。
次の図は、レンダリング タスクのパイプラインのステージを示しています。各ステージには、関連するコンポーネント、プロセス、リソースが含まれています。Blink には多くの作業があります。
グラフィックをレンダリングする
Blink は、オープンソースの Skia グラフィック エンジンを使用して、パソコンまたはモバイル デバイスの基盤となるグラフィック ハードウェアと やり取りします。
Skia は、さまざまなハードウェア プラットフォームとソフトウェア プラットフォームで動作する共通の API を提供します。Google Chrome やその他の多くのプロダクトのグラフィック エンジンとして機能します。
Skia は、プラットフォームの変更に対応しながら、さまざまなオペレーティング システムとデバイスをサポートするのではなく、 OpenGL、Vulkan、および DirectXなどのグラフィック ライブラリを使用します。Skia が使用するライブラリは、モバイルの Android やパソコンの Windows など、実行しているプラットフォームによって異なります。
JavaScript を解析して実行する
JavaScript と WebAssembly のコードを解析して実行するために、Blink は Chromium プロジェクトで開発されたオープンソース エンジンである V8を使用します。
V8 を使用すると、デベロッパーは JavaScript または WebAssembly のコードを使用して、基盤となるブラウザの機能にアクセスできます。たとえば、 Blink が HTML コードから構築するドキュメントの内部表現である ドキュメント オブジェクト モデルを操作する場合などです。
V8 は、JavaScript 標準である ECMAScript に従って JavaScript を処理します。
標準に準拠したレンダリング
V8 は、ECMAScript と呼ばれる JavaScript 標準に従って JavaScript を処理します。Blink などのレンダリング エンジンは、ウェブ標準を相互運用可能な方法で実装するように設計されています。ウェブ標準により、デベロッパーとエンドユーザーは、使用しているブラウザに関係なく、ウェブページが適切に動作することを確信できます。
Blink は、 HTML、 CSS、 DOM などのウェブ標準で定義されているブラウザと言語の機能の仕様に準拠しています。
HTML と DOM
HTML 標準では、ブラウザ エンジニアが HTML 要素を実装する方法を定義しています。各 HTML 要素の仕様には、 DOM インターフェース を定義するセクションが含まれています。これにより、デバイスやプラットフォーム間で標準化された方法で要素を操作できるように、ブラウザで JavaScript を実装する方法が詳しく説明されています。
インターフェース仕様は、
WebIDL（Web
Interface Definition Language）で記述されています。次の WebIDL は、HTML
標準の HTMLImageElement の定義の一部です。
[Exposed=Window,
LegacyFactoryFunction=Image(optional unsigned long width, optional unsigned
long height)]
interface HTMLImageElement : HTMLElement {
[HTMLConstructor] constructor();
[CEReactions] attribute DOMString alt;
[CEReactions] attribute USVString src;
[CEReactions] attribute USVString srcset;
[CEReactions] attribute DOMString sizes;
[CEReactions] attribute DOMString? crossOrigin;
[CEReactions] attribute DOMString useMap;
[CEReactions] attribute boolean isMap;
[CEReactions] attribute unsigned long width;
[CEReactions] attribute unsigned long height;
readonly attribute unsigned long naturalWidth;
readonly attribute unsigned long naturalHeight;
readonly attribute boolean complete;
readonly attribute USVString currentSrc;
[CEReactions] attribute DOMString referrerPolicy;
[CEReactions] attribute DOMString decoding;
[CEReactions] attribute DOMString loading;
[CEReactions] attribute DOMString fetchPriority;
Promise<undefined> decode();
// also has obsolete members
};
WebIDL は、ほとんどのウェブ標準を構成する機能インターフェースなどを記述する標準化された方法です。
機能を実装するために、エンジニアは WebIDL コードをファイルに配置します。これにより、Blink によって自動的に変換され、その機能のインターフェースがデベロッパーに提供されます。WebIDL でインターフェースが定義されると、エンジニアはインターフェース呼び出しに応答する実装を構築できます。
html_image_element.idl Chromium ソース内。サードパーティ ライブラリ
Blink は複数のサードパーティ ライブラリを使用します。たとえば、 WebGL は インタラクティブな 2D グラフィックと 3D グラフィックのレンダリングに使用されます。
WebGL などのライブラリは高度に最適化され、慎重にテストされています。これにより、Blink は重要な機能にアクセスできます。WebGL IDL が定義され、Blink エンジニアは、さまざまな要素のレンダリングに使用されるバックエンドのコードとライブラリにウェブ インターフェースを接続します。
WebGL の動作を確認するには、WebGL を使用するフラクタル レンダリング アプリ Fractious をご覧ください。
クロス プラットフォーム レンダリング
Chrome は、すべてのオペレーティング システムとデバイスで Blink を使用しているのでしょうか？
iOS と iPadOS では、Chrome はレンダリング エンジンとして WebKit を使用します。WebKit は、1998 年に遡る別のプロジェクトである KDE のフォークです。 実際、Safari と Chromium はどちらも当初 WebKit をベースとしていました。現在、Apple の App Store の要件に従って、Safari と Apple エコシステムのすべてのブラウザで WebKit が使用されています。
時間の経過とともに、Chromium プロジェクト は別のマルチプロセス ソフトウェア アーキテクチャを開発しました。これは、1 つのコードベースで 2 つの 別々のアーキテクチャを維持することが問題になっていたためです。
また、Chromium は WebKit に組み込まれていない機能を使用したいと考えていました。そこで、バージョン 28 から、Chromium エンジニアは独自のレンダリング エンジンの開発を開始することにしました。WebKit からコードをフォークし、Blink と名付けました。Blink は、Netscape Navigator ブラウザで使用されていた（あまり人気のない）
<blink> タグにちなんで名付けられたという噂があります。テキストを
点滅させるために。
まとめると、Chrome、Microsoft Edge、Opera、Vivaldi、Arc、Brave などの Chromium ベースのブラウザとフレームワークでは Blink が使用されています。Safari とその他のブラウザでは、Chrome を含む iOS と iPadOS のすべてのブラウザで WebKit が使用されています。Firefox は Gecko というレンダリング エンジンを使用しています。