ITを表現する

JavaScriptのHTML文書の最後にを含む

あなたのスクリプトで、ページのコンテンツの一部を挿入するdocument.writeを（もしくはJavaScriptを使用してページの内容のいずれかを動的に生成）されていない場合は、BODYタグの終わりの前にページの一番下に文を含むスクリプトを移動します。
HTTP/1.1仕様書は、ブラウザがホスト名ごとに並列に2つ以下のコンポーネントをダウンロードすることを示唆している。 あなたが複数のホストからあなたのイメージを提供する場合には、並行して発生するつ以上のダウンロードを得ることができます。 スクリプトがダウンロードされていますが、しかし、ブラウザはさらに別のホスト名には、他のダウンロードを開始しません。
動的にスクリプトノードを作成し、ページがAJAXを使用してロードされた後、リモートスクリプトをロードする方法もあります。

JavaScriptのあなたをExt​​ernalise

JavaScriptファイルがブラウザによってキャッシュされるため、外部のJavaScriptファイルを使用すると、ページのロードが高速になります。 インラインJavaScriptの 'HTML文書には、HTMLドキュメントが要求されるたびにダウンロードされる。 これは実際に行われたHTTP要求の数を減らすかもしれないが、その後、HTMLドキュメントのサイズが大きくなります。 外部JavaScriptのは、ブラウザによってキャッシュされます。HTMLドキュメントのサイズは、HTTPリクエストの数を増やすことなく削減されます。
あなたのサイト上のユーザーがセッションごとに複数のページビューを持っていて、ページを再使用するのと同じスクリプトとスタイルシートの多くの場合、キャッシュされた外部ファイルからより多くの潜在的な利点がありますのでご注意ください。

JavaScriptファイルをパックする

JavaScriptの場合には、CSSとは異なり、ファイルは単にスペースまたはタブを削除するよりも縮小ファイルサイズを与えるであろういくつかの標準的なアルゴリズムを使用してクランチ可能性があります。 JavaScriptのパッカーの例はここhttp://dean.edwards.name/packer/見つけることができます

任意のスクリプトが重複を取り除く

それは全体のスクリプトが重複する可能性があることは非常に珍しいですが、10上の米国Webサイトの見直しは、それらの2が重複するスクリプトが含まれていることを示しています。 スクリプトが重複していますが、明らかに不必要なHTTPリクエストと無駄なJavaScriptの実行を作成することにより、パフォーマンスが低下します。
スクリプト名が異なるものの、また、多くの場合、スクリプトのチームのサイズと数のため、同じページ内のスクリプトが重複する可能性があります。

可能であれば、DOM要素にアクセスして最小限に抑える

JavaScriptでDOM要素にアクセスすると、より応答ページを持つために非常に遅いですが、以下を行う必要があります。
アクセスの要素に•キャッシュ参照
• "オフライン"ノードを更新してツリーに追加
•JavaScriptを使用してレイアウトを固定しないでください

コンテンツとプレゼンテーションから独立した動作

単にコンテンツ（XHTML / XML）から我々は独立したプレゼンテーション（CSS / XSLT）として、我々はまた、動作（JavaScript）を分離する必要があります。 これは控えめなJavaScriptと呼ばれています。 我々は外部CSSファイルへのリンクと同じように、我々は外部のJavaScriptファイルにリンクする必要があります。

代わりに、コンテンツ（例えば、onmouseoverイベントは、onclickなど）にハードコーディングする動作のため、動作が動的に要素、クラス、およびDOMを使用して一意の要素（ID）を追加する必要があります。 基礎的なドキュメント、コンテンツは、唯一の有効なXHTML / XMLとしないjavascriptを含める必要があります。
Javascriptが動作を追加することにより、コンテンツを強化する必要があります。 コンテンツにはJavaScript（または完全なJavaScriptサポートを持たない）を使用せずに有用であり、使用可能なままにしてください。

私は戻って、申し訳ありませんので、この記事で年齢を保存しました！ 私はソースを覚えていない...しかし、それは我々のためのサイトを開発する誰のために、観客約注意しなければならない私たちにとって、有用だった...ので、ここでiは

ページの重さは、インターネット接続速度の様々な特定のページのダウンロード時間を決定するために使用することができます。 例によって、次の表では、人気の高い接続速度の数は少なくとも3つの異なるページのダウンロード時間を示しています。

ページの重さを減らすことのメリット？

ページの重さの利点のウェブサイトの所有者と消費者の両方を削減するのにプラスの影響。 潜在的な利点は次のとおりです。

1. ページの読み込み速度が速くなります。 ページの重さを減らすことの最も明白な影響は、あなたのウェブサイトのページに関係なく、接続速度の、訪問者のために高速にロードすることです。
2. 下のページのロード時間がより快適な訪問者を作成します。 訪問者は、欲求不満になると、ページが迅速にロードする場合は別の場所に行くことが少なくなります。 一方、遅いローディングのページは訪問者や潜在的な顧客を失う確実な方法の一つです。
3. より速くロード時間が増加した変換に貢献していきます。 より多くの訪問者は、もはやあなたのサイトに滞在します。 それらの多くは、ニュースレター、またはブックマーキングサイトにサインアップし、購入をすることになります。
4. あなたのブランド認知を向上させることになります。 戻って、顧客と初めての訪問者は同様にあなたのページにすばやく読み込む場合は、 "専門家"としてあなたのサイト（およびビジネス）を記述するより多くの傾斜になります。
5. きれいで、堅実なコードを含むページは、しばしば自然の検索エンジンでより効果的に索引付けされます。
6. 重量用に最適化ページが実際に高トラフィックのサイトで帯域幅の費用を節約することができます。 100,000ページには、各重量150 KBは、100,000ページ、各重量75 KB以上のISPからの二倍の帯域幅を必要とします。 使用される帯域幅または過量仕込みのために充電するISPのために、この削減は、帯域幅の費用を大幅に削減を作成することができます。

レポートに掲載され、次のデータを検討

トップでスタイルシートを置く

あなたはページが徐々にロードする場合は、、我々はできるだけ早く持ってどのようなコンテンツを表示するようにブラウザをしたい、つまり、文書のHEAD内のページの上部にCSSを入れた。 これは、ページがこのページのプログレッシブレンダリングを容易に、より速くロードされたように見えます。 これは、大量のコンテンツを持つページに対して、低速のインターネット接続上のユーザにとって特に重要です。

それは全体的なユーザーエクスペリエンスを向上させることが文書化された事実、それは、進行状況インジケータと視覚的なフィードバックを提供することが重要です。 IE、CSSが完全にロードされるまで、ページのレンダリングブロックを含む彼らのスタイルを変更すると、一部のブラウザ、場合場合には、ページの要素を再描画する必要がなくなります。 このため、ユーザーは見になる 空白のページを参照してください。

W3 HTML仕様 "にも、CSSは、HTMLページのHEADセクションに私を含める必要があることを述べています。 at the bottom of the page, so it's best not to use it.また、IEでは、次の点に注意して@import使用した場合と同じ動作をする<link>ページの下部にあるので、それを使用しないことをお勧めします。

ブラウザ固有の機能を使用して避ける

フィルタ：フィルタの使用 メモリ消費量が増加し、要素ごとに適用され、イメージではなく当たり、問題が乗算されますので。 また、フィルタはIE独自のものであり、それ故に他のブラウザで意図したとおりに動作しません。 あなたは、透明やグラデーション背景を使用する場合は、画像で1画素を使用しています。
式：CSSの表現は、CSSで持っている便利な機能ですが、まだIE固有の機能です。 また、これらの式であることに注意することが重要です。 ページがレンダリングとサイズが変更されたときに評価され、スクロールして、ユーザーがページ上にマウスを移動した場合であっても。 これがあなたのページのパフォーマンスに影響を与える可能性は言うまでもない。 あなたはその長所は "その短所より多くの重量を量る"と感じない限り、それゆえ簡単な言葉で、CSSの表現を使用することは避けてください

あなたのCSSをExternalise

外部CSSを使用してのロードが高速になります ページのJavaScriptとCSSファイルがブラウザによってキャッシュされるためです。 インラインCSSはHTML文書にHTML文書が要求されるたびにダウンロードされる。 これは実際に行われたHTTP要求の数を減らすかもしれないが、その後、HTMLドキュメントのサイズが大きくなります。 外部CSSはブラウザによってキャッシュされます。HTMLドキュメントのサイズは、HTTPリクエストの数を増やすことなく削減されます。

あなたのサイト上のユーザーがセッションごとに複数のページビューを持っていて、ページを再使用するのと同じスクリプトとスタイルシートの多くの場合、キャッシュされた外部ファイルからより多くの潜在的な利点がありますのでご注意ください。

CSSファイルをパックする

梱包したり、CSSを演算処理すると、ロード時間を改善することにより、そのサイズを小さくするためのコードから不要な文字を削除する方法です。

CSSはすべてのコメントと空白のような不要な文字、改行などを削除することで、私クランチできます。

年齢のために、私はすべてのベストプラクティスを統合するために考えた、私は今、そしてすべてのを読んでいる。 ついに！ 私はペンにそれを置くために降りた。 私はこの巨大な文書を作成する巨大なタスクになるだろうことに気づいたので、私はそれにカテゴリ全体を捧げることにしましたので、私は、ベストプラクティスについてのものを追加し続けることができると私は彼らに遭遇したとき...

よく！ ここに内容がヤフー、グーグルなどのような標準の開発者によって書かれたものと私の個人的なUI開発のベストプラクティスの融合になります

このスペースを見て、browing保つベストプラクティスカテゴリ

シンプルに言えば（今日の前にDOCTYPEを聞いたことがない人のため！） DOCTYPEは、このようなものになります<HTML>タグ（この非常にページのソースから貼り付け）の前に来る、HTMLドキュメント内の宣言です。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

したがって、この問題を解決するには、することであった

• 使用するモードを選択してその基準を知っていたウェブ開発者を許可します。
• 古い（癖）の規則に従って、古いページを表示し続ける。

とDOCTYPEが生まれました。

したがって、ページが標準かどうかように設計されているかどうかに基づいて、適切なDOCTYPEを選択します。

これらの基準が導入される前に書かれた古いページは、DOCTYPEを持っていません。 そのためにDOCTYPEは、HTMLに存在しない場合、ブラウザは Quirksモードになっています。
DOCTYPEは、次のいずれかのように定義されますしかし、もしブラウザがSTRICTモードであると言われています。

<DOCTYPE HTML PUBLIC " - / / W3C / / DTD HTML 4.01暫定/ / EN" "http://www.w3.org/TR/html4/loose.dtd">