JavaScript エンジン

JSエンジン:

• JSコードを実行するプログラム。元。 Google の V8。
• V8 が Chrome、Node.js を強化
• 他のブラウザには独自の JS エンジンがあります。

JS エンジンには 2 つの部分があります。

1. コールスタック: 実行コンテキストを使用してコードが実行される場所。
2. ヒープ: オブジェクトの保存に使用される非構造化メモリ プール。

すべての c/r プログラムはマシンコードに変換する必要があります。 2 つのプロセスを介して実行されます:

1. コンパイル: コード全体が一度にマシンコードに変換され、コンピューターで実行できるバイナリ ファイルに書き込まれます。

ソースコード -(コンパイル済み)->バイナリコード[ポータブルファイル] -(実行)->プログラム実行
実行はコンパイルのかなり後に行われる可能性があります。

2. インタプリタ: インタプリタはソース コードを 1 行ずつ実行します。

ソースコード -(1​​行ずつ実行)->プログラム実行

• ここのコードはまだマシンコードに変換する必要があります。
• コンパイル済みの l/gs に比べてかなり遅いです。

3. JIT、つまりジャストインタイムコンパイル:

• 最新の JS エンジンは、コンパイルと解釈を組み合わせて高速化しています。
• コード全体が一度にマシンコードに変換され、すぐに実行されます。 ソースコード -(コンパイル済み)->マシンコード -(実行)->プログラム実行
• 実行する中間ポータブル ファイルがありません。
• コンパイル直後に実行が行われます。
• したがって、この手法により、JS は解釈された l/gs よりもはるかに高速になりました。

JS でのコンパイル プロセス:

ステップ 1. 解析:

• 私たちのコードは解析されます。つまり、JS エンジンによって AST または抽象構文ツリーに読み込まれます。
• l/g にとって意味のある const、let、function などのキーワードに基づいてコードをツリーに分割することで機能します。
• 次に、コードを構造化された方法でツリーに保存します。
• 構文エラーも確認してください。
• AST は DOM ツリーとは何の関係もありません。 AST は、JS エンジン内のコードを表現したものにすぎません。

ステップ 2、3[結合]: コンパイル + 実行

• AST はコンパイルされ、その直後に JIT を使用して実行されます。
• 実行は呼び出しスタックで行われます。
• 最新の JS には賢い最適化戦略があります。つまり、できるだけ早く実行を開始できるように、最初に最適化されていないバージョンのマシンコードをすばやく作成します。
• このコードは、既に実行中の pgm 実行中にバックグラウンドで再度再コンパイルされます。
• 複数回の反復で実行され、各最適化の後、コードの実行を停止することなく、最適化されていないコードが新しく最適化されたコードと交換されます。これにより、V8 が非常に高速になります。
• この解析、コンパイル、実行はすべて、JS Engine 内の特別なスレッドで行われます。このスレッドには、コール スタックを使用してコードを実行しているメイン スレッドから完全に分離されたコードを使用してアクセスすることはできません。
• JS は単に l/g と解釈されるだけではありません。 JIT コンパイルがあり、解釈された l/gs よりもはるかに高速になります。

JS ランタイム = JS エンジン + Web API + C/B キュー

• JS ランタイム: JS を使用するために必要なものがすべて含まれるコンテナー。
• JS ランタイムの中心は JS エンジンです。
• JS エンジンがなければランタイムがないため、JS はまったく存在しません。
• JS エンジンだけでは十分ではありません。DOM、フェッチ、タイマーなどの Web API へのアクセスが必要です。
• Web API: ランタイムによってエンジンに提供される機能ですが、JS エンジンの一部ではありません。元。ブラウザのウィンドウ オブジェクト、ノードのグローバル オブジェクト。
• コールバック キューは、実行準備ができているすべての関数を含むデータ構造です。元。クリック、タイマー、データなど
• DOM イベント ハンドラー fns はコールバック fns とも呼ばれます。
• コール スタックが空の場合、コールバック fn は C/B キューからコール スタックにシフトされて実行されます。
• 継続的なチェックとシフトはイベントループによって実行されます。
• イベント ループは、JS がノンブロッキングの同時実行モデルを持つことを可能にするものです。
• ノードに関しては、ブラウザから提供される Web API はありません。 C++ バインディングとスレッド プールと呼ばれるものがあります。

JS コードがコールスタックでどのように実行されるか

• JS には単一の実行スレッドがあるため、一度に実行できることは 1 つだけです。したがって、JS ではマルチアスキングはできません。
• API は環境によって提供されますが、言語の一部ではありません。元。タイマー、フェッチ、DOM、位置情報などの Web API
• コールバック キュー: 発生したイベントに関連付けられたコールバック関数を実行する準備ができています。
• コール スタックが空になるたびに、イベント ループはコールバックをコールバックからキューに転送し、実行のためにコール スタックに渡します。
• イベント ループは、JS での非同期動作を可能にする重要な部分です。
• 同時実行モデル: l/g が同時に発生する複数の処理をどのように処理するか。
• JS ランタイムの重要な部分:
• コールスタック
• Web API
• コールバックキュー
• イベントループ
• DOM に関連するものはすべて、JS ではなく Web API の一部です。
• 画像の読み込みは非同期で行われます。同期していたらブロックされていたでしょう。つまり、メインスレッドではなく Web API 環境で行われていたでしょう。
• すべてのイベント リスナー、.then() などの作業は、コール スタックではなく、WEB API 環境で発生します。
• コールバック関数はコールバック キューに配置され、コール スタックで実行されるのを待ちます。
• コールバック キューは、コールスタックが完了する必要がある todo リストのようなものです。
• 上記の期間は実行までの最小遅延であり、実行時間ではありません。
• コールバック キューには、DOM イベント、クリック、キー押下などからのコールバックも含まれます。DOM イベントは非同期動作ではありませんが、実行にはコールバック キューを使用します。
• イベント ループは、コールバック キューが空になるまでチェックし続けます。コール スタックに配置された各コールバックは、イベント ループ ティックとして呼び出されます。
• イベント ループは JS ランタイム全体を調整します。
• 非同期コードはエンジン内で実行されないため、JS 自体には時間の感覚がありません。非同期動作を管理するランタイムと、実行するコールバックを決定するイベント ループです。
• エンジンまたは呼び出しスタックは、単に与えられたコードを実行します。
• 画像がロードされるとき、イベント リスナーはロード イベントが発生するまで Web API 環境で待機し続けます。起動されると、それのみがコールバック fn としてコールバック キューに送られ、コール スタック上でその順番が実行されるのを待ちます。

マイクロタスクキュー:

• Promise からのコールバックはコールバック キューに送られず、マイクロタスク キューに送られます。
• このキューはコールバック キューよりも高い優先度を持ちます。
• イベント ループは最初にこのキューをチェックし、最初にそのタスクをすべて実行してから、実行のためにコールバック キューに移動します。
• Promise のコールバックはマイクロタスクと呼ばれ、そのためマイクロタスク キューと呼ばれます。他にもマイクロタスクがありますが、現時点ではここでは関係ありません。 イベント ループは、各コールバックがいつ実行されるかを決定します。コールバックキューと比較してマイクロタスクに高い優先度を与えます
• マイクロタスクは、他のすべての通常のコールバック キューの前にインラインでカットできます。
• Promise.resolve() : すぐに解決される Promise を作成し、その成功値が引数として内部に渡されます。 then() コールバックは、解決された値を引数として呼び出します。

console.log("Direct simple console BEGIN");
setTimeout(() => console.log("Text from Timer"),0);
Promise.resolve("Text from Promise").then(res => console.log(res));
console.log("Direct simple console END");

Order of Output:
Direct simple console BEGIN
Direct simple console END
Text from Promise
undefined
Text from Timer

• マイクロタスク キューに多数のマイクロタスクがある場合、または時間のかかるマイクロタスクがある場合、マイクロタスク キューがコールバック キューを枯渇させる可能性もあります。

console.log("Direct simple console BEGIN");
setTimeout(() => console.log("Text from Timer"),0);
Promise.resolve("Text from Promise1").then(res => console.log(res));
Promise.resolve("Text from Promise2").then(res => {
  for(let i=0; i<5000; i++)
  console.log(res);
});
console.log("Direct simple console END");

以上がJavaScript エンジンの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。