JavaScript エンジン-jsチュートリアル-php.cn

JavaScript Engine

JSエンジン:

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

JS エンジンには 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.resolve(): 즉시 해결되는 Promise를 생성하고 그 성공 값이 인수로 전달됩니다. then() 콜백은 확인된 값을 인수로 사용하여 호출됩니다.

으아악