ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript の理解と使用法

JavaScript の理解と使用法

零下一度
零下一度オリジナル
2017-06-26 11:25:151095ブラウズ

(1) JavaScript とは何ですか?

JavaScript は、Web ページと対話するために設計されたスクリプト言語であり、次の 3 つの部分で構成されます: (1) ECMAScript: コア言語機能を提供します。 (2). ドキュメント オブジェクト モデル (DOM): Web コンテンツにアクセスして操作するためのメソッドとインターフェイスを提供します (3) ブラウザ オブジェクト モデル (BOM): ブラウザーと対話するためのメソッドとインターフェイスを提供します

(2)実行

(最新ブラウザの原則)

著者: Qian Duoduo
リンク:
出典: Zhihu
著作権は著者に属します。商業的転載の場合は、著者に連絡して許可を得てください。非商業的転載の場合は、出典を明記してください。

1. HTMLのダウンロードと実行は同期していますか?

結論: 状況によって異なります。

HTML の実行に関するこの説明は不正確です。いわゆる実行には、HTML の解析、レイアウト、ペイントの段階が含まれます。ダウンロード、parseHTML/parseCSS/executeJS、レイアウト、ペイントはすべて別のプロセスにあります。

parseHTML/parseCSS は並行して完了すると、レイアウトによってレンダリング ツリーが生成され、ペイントがレンダリングされます。 JSを実行するとレイアウト段階に戻ります。


A. ネットワーク速度が十分に速く、コンテンツがすぐに送信される場合は、parse+layout+paint が後で実行されます。

B. ネットワークが弱く、ネットワーク速度が非常に遅い場合、最新のブラウザは最適化されており、受信したコンテンツを事前にレンダリングしようとするため、PC 上でページがブロックごとに表示されます。

C.chunk の原理も同様で、各チャンク ブレークポイントが解析とレンダリングをトリガーする可能性があります。

D. 一部のブラウザでは、ダウンロード プロセス中に、コンテンツが最初の画面を超えると計算された場合、コンテンツが描画されます。最初の画面のコンテンツが先にあります。

ほとんどのプロセスは並列しているため、比較的複雑です。ケースバイケースで説明することは意味がありません。原則として理解することをお勧めします。


2. CSS ファイルのダウンロードとレンダリングは同期しますか? それとも、最初にダウンロードしてからレンダリングする必要がありますか?

ダウンロード プロセス中に parseCss の字句解析が同時に行われるかどうかはわかりませんが、結局のところ、その可能性は非常に高いです。 、それはロスレスです。最適化計画ですが、最終的には、それをダウンロードしてレイアウトし、レンダリング ツリーを生成してからレンダリングする必要があります。

3. CSSファイルのダウンロードと実行とHTMLファイルのダウンロードと実行は同期していますか?

並行して。ただし、いくつかの制限に注意する必要があります。たとえば、ドメイン名での同時リクエストの最大数は 6 です。それ以上のリクエストはシリアル化する必要があります。

4. グラフィックの読み込みは HTML ファイルのダウンロード/実行と同期していますか? オーディオやビデオ、その他のリソースはどうですか?

上記と同じです。

5. js ファイルのダウンロードと実行、および html ファイルのダウンロードと実行は同期ですか?

ダウンロードは可能ですが、JS

は実行できませんか? /pictures が表示されますか? /css ファイル/js ファイルも同時にダウンロードされますか?


正常です。

7. html/css ファイル/js ファイルを同時に実行することは可能ですか?


上記の記事を読むと理解できます: html 解析と css 解析は並列であり、レイアウトは両方の後に行われます。ペイントが完了すると、新しい CSS の実装がレイアウトとペイントに遅れます。 js 解析は html 解析をブロックするため、後続のレイアウトとペイントは同時に実行されません。 html3.1&lt>選択する。外部スクリプトに対してのみ有効です。つまり、スクリプトはすぐにダウンロードされますが、ページ上の他の操作は妨げられません。

2. charset: 文字エンコーディング属性、オプション。デフォルトは UTF-8 エンコーディングで、主に src 属性で指定された

コードの文字セットを表します。そのため、これを使用する必要はありません。

3.defer: スクリプト遅延属性、オプション。 HTML ドキュメント全体が解析されて表示されるまで、スクリプトの実行時間を遅らせるために使用されます。これは、外部スクリプト ファイルに対してのみ有効です。 4.言語: スクリプト タイプ属性。標準の一部ではなく、非推奨です。ほとんどのブラウザ

はこの属性を無視するため、使用する必要はありません。

5.src: 外部ファイル属性をリンクします (オプション)。実行されるコードを含む外部ファイルを表します。注意:

src 属性を設定すると、script 要素に記述された JavaScript コードが無効になる可能性があります。

6. type: スクリプトタイプ属性、必須。デフォルト値は text/javascript で、コードの記述に使用されるコンテンツ タイプ (MIME タイプとも呼ばれる) を示す、 language

の代替属性とみなすことができます。

注: コード内のどこにも を使用しないでください

3.2 ラベルの位置