1. IEのダウンロードの順序は上から下にあり、レンダリングの順序も上から下までです。ダウンロードとレンダリングは同時に実行されます。
2。ページの一部にレンダリングすると、上記のすべての部品がダウンロードされています(すべての関連要素がダウンロードされているわけではありません)。
3.セマンティック解釈タグ埋め込みファイル(JSスクリプト、CSSスタイル)に遭遇した場合、IEダウンロードプロセスにより、ダウンロード用の個別の接続が可能になります。
4.スタイルシートのダウンロードが完了した後、以前にダウンロードしたすべてのスタイルシートで解析されます。解析が完了すると、以前のすべての要素(以前にレンダリングされたものを含む)が再レンダリングされます。
5. JSおよびCSSに再定義がある場合、後の定義関数は以前の定義関数をオーバーライドします。
JSのロード1。ダウンロードして並行して解析できません(ブロックダウンロード)。
2。JSが参照されると、ブラウザはJSリクエストを送信し、リクエストの返却を待ちます。ブラウザには安定したDOMツリー構造が必要なため、ある可能性が非常に高いです
コードは、document.writeまたはappledChildを使用するか、ジャンプにlocation.hrefを使用するなど、DOMツリー構造を直接変更します。 JSの修理が発生しないようにするために、ブラウザ
DOMツリーを変更するには、DOMツリーを再構築する必要があるため、他のダウンロードやレンダリングをブロックします。
HTMLページの読み込みをスピードアップする方法1。ページ減量:
a。ページの重みは、負荷速度に影響を与える最も重要な要因です。
b。不要なスペースとコメントを削除します。
c。インラインスクリプトとCSSを外部ファイルに移動します。
d。 HTML Tidyを使用してHTMLの体重を減らすことができます。また、圧縮ツールを使用してJavaScriptの体重を減らすこともできます。
2。ファイルの数を減らす:
a。ページで参照されるファイルの数を減らすと、HTTP接続の数を減らすことができます。
b。多くのJavaScriptおよびCSSファイルをマージすることができ、それらをマージするのが最善です。 CaibangziはJavaScriptを統合しました。 base.jsファイルへの関数とprototype.js。
3.ドメイン名の削減クエリ:
a。 DNSクエリと解析ドメイン名も時間を消費するため、外部JavaScript、CSS、写真、その他のリソースへの参照を減らす必要があります。異なるドメイン名を使用することが少ないほど、より良いです。
4.キャッシュの再利用データ:
a。キャッシュはデータを再利用します。
5。ページ要素の読み込み順序を最適化します。
a。最初にページに表示されていたコンテンツとそれに関連するJavaScriptとCSSをロードし、元の写真、フラッシュ、ビデオなどに表示されないものなど、HTML関連のものをロードしてからロードします。
6.インラインJavaScriptの数を減らす:
a。ブラウザパーサーは、インラインJavaScriptがページ構造を変更すると想定しているため、インラインJavaScriptの使用は高価です。
b。コンテンツを出力する方法であるdocument.write()を使用しないでください。最新のW3C DOMメソッドを使用して、最新のブラウザのページコンテンツを処理します。
7.最新のCSSと法的タグを使用します。
a。最新のCSSを使用して、ラベルと画像を削減します。たとえば、最新のCSS+テキストを使用すると、テキストのみの写真を完全に置き換えることができます。
b。ブラウザがHTMLを解析する場合、エラーの修正やその他の操作を避けるために、リーガルタグを使用します。 HTML Tidyを使用してHTMLの体重を減らすこともできます。
8。あなたのコンテンツをチャンクします:
a。ネストされたテーブルではなく、ネストされていないテーブルまたはdivを使用しません。ネストされたテーブルの大きな塊に基づいてテーブルのレイアウトを複数の小さなテーブルに分解するため、ページ(または大きなテーブル)コンテンツが表示されるまでロードされるまで待つ必要はありません。
9.画像とテーブルのサイズを指定します。
a。ブラウザがすぐに画像またはテーブルのサイズを決定できる場合、レイアウトの配置を再入力せずにすぐにページを表示できます。
b。これにより、ページの表示がスピードアップするだけでなく、ページが読み込まれた後のレイアウトの不適切な変更を防ぎます。
c。画像は高さと幅を使用します。
HTMLページの読み込みと解析プロセス1.ユーザーはURLを入力します(HTMLページであり、初めてアクセスするのは初めてであると仮定します)、ブラウザはサーバーにリクエストを発行し、サーバーはHTMLファイルを返します。
2.ブラウザはHTMLコードの読み込みを開始し、外部CSSファイルを参照する<head>タグに<link>タグがあることを見つけます。
3.ブラウザはCSSファイルのリクエストを発行し、サーバーはCSSファイルを返します。
4.ブラウザはHTMLのコードの<body>部分の一部を引き続き読み込んでおり、CSSファイルが取得されているため、ページのレンダリングを開始できます。
5.ブラウザは、画像を参照してサーバーにリクエストを行ったコードに<img>タグを見つけました。この時点で、ブラウザは画像がダウンロードされるまで待つことはありませんが、後続のコードをレンダリングし続けます。
6.サーバーは画像ファイルを返します。画像は特定の領域を占めるため、後続の段落の配置に影響するため、ブラウザはコードのこの部分を戻って再レンダリングする必要があります。
7.ブラウザは、JavaScriptコードの行を含む<script>タグを見つけて、迅速に実行しました。
8。JavaScriptスクリプトは、このステートメントを実行します。このステートメントは、ブラウザにコードを非表示にするようにコマンドします。それは残念です、突然そのような要素が欠落しているので、ブラウザはコードのこの部分を再レンダリングする必要があります。
9.最後に、私は</html>の到着を待ちました、そして、ブラウザが涙を流しました...
10。待って、まだ終わっていません。ユーザーはインターフェイスのスキニングボタンをクリックし、JavaScriptはブラウザに<link>タグのCSSパスを変更するように依頼しました。
11.ブラウザはここに全員を集め、全員が荷物を詰め、もう一度やり直さなければなりません...ブラウザはサーバーから新しいCSSファイルを要求し、ページを再レンダリングしました。