25

静的ファイルをロードするときのブラウザーのパフォーマンスについて調べていたところ、この疑問が生じました。

CDN 静的ファイル (つまり、Google Code、最新の jQuery、AJAX CDN など) を使用すると、Web ページ全体ではなく別のドメインから要求されるため、パフォーマンスが向上すると言う人もいます。

パフォーマンスを改善する他の方法は、Expiresヘッダーを数か月後に等しく設定し、ブラウザーに静的ファイルを強制的にキャッシュさせ、要求を削減することです。

性能を考えてどちらがいいのか、両方を組み合わせてもいいのか悩んでいます。

4

5 に答える 5

71

最終的に、フロントエンド最適化(FEO)とも呼ばれるサイトのWebパフォーマンス最適化(WPO)を実行している場合は、両方の手法を採用することをお勧めします。彼らは驚くほど手をつないで働くことができます。どちらか一方を選択する必要がある場合でも、いつでもキャッシュを選択することは間違いありませ。実際、CDNを使用する場合でも、すべてのWebプロジェクトに適切なリソースキャッシュを設定することが不可欠だと思います。

キャッシング

ヘッダーの設定Expiresとリソースのキャッシュは必須であり、リソースに対して100%の時間実行する必要があります。キャッシングを行わない理由は本当にありません。Apacheでは、これを有効にmod_expires.cした後、設定するのは非常に簡単mod_headers.cです。HTML5 Boilerplateプロジェクト.htaccessファイルには優れた実装例があり、サーバーがnginx、lighttpd、IISなどの他のサーバーである場合は、これらの他のサーバー構成を確認してください。

キャッシングについて学ぶことに興味がある人は、次のように読んでください。MarkNottinghamのキャッシングチュートリアル

コンテンツ配信ネットワーク

あなたが言及Google Code, jQuery latest, AJAX CDNし、私はあなたが支払い、あなた自身のリソースをホストするものを含む一般的なCDNに触れたいと思いますが、単にjqueryホストファイルcdnを使用している場合、またはhttp://cdnjs.com/から何かをロードしている場合も同じです。例。

CDNは、サーバー側のヘッダーキャッシュを設定するよりも重要ではないと思いますが、CDNを使用するとパフォーマンスを大幅に向上させることができますが、コンテンツ配信ネットワークのパフォーマンスはプロバイダーによって異なります

これは、トラフィックが世界中のオーディエンスであり、CDNプロバイダーが世界中のエッジ/ピアロケーションを多数持っている場合に特に当てはまります。また、リソースを提供するために作業の一部をCDNにオフロードするため、Webホスティング帯域幅とCPU使用率(少し)が大幅に削減されます。

まれに、CDNの遅延がサーバーよりも遅くなると、CDNがパフォーマンスに悪影響を与える可能性があります。また、リソースの並列化を過度に最適化して使用すると(cdn1、cdn2、cdn3などのマルチサブドメインを使用)、ユーザーエクスペリエンスが低下し、追加のDNSルックアップでオーバーヘッドが発生する可能性があります。ここではバランスが必要です。

発生する可能性のあるもう1つの悪影響は、CDNがダウンしている場合です。それは起こった、そしてまた起こるだろう。これは、無料のCDNの場合により当てはまります。なんらかの理由でCDNがダウンすると、サイトもダウンします。これは、さらに別の潜在的な単一障害点(SPOF)です。javascriptリソースの場合、賢くなり、CDNからリソースをロードできます。失敗した場合は、どのような場合でも、ローカルコピーを検出してロードします。フォールバック(HTML5ボイラープレートから取得)を使用してajax.googleapis.comからjQueryをロードする例を次に示します。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.2.min.js"><\/script>')</script>

明らかな無料のAPIリソース(jquery、google apiなど)に加えて、CDNを使用している場合は、使用料を支払う必要がある場合があるため、ホスティングコストが増加します。もちろん、一部のCDNでは、特定の場所にアクセスするために追加料金を支払う必要があります。たとえば、アジアのノードは北米よりも追加コストがかかる場合があります。

于 2012-10-16T15:20:56.540 に答える
5

パブリック アプリケーションの場合は、CDN にアクセスしてください。キャッシュは繰り返しのリクエストには役立ちますが、最初のリクエストには役立ちません。最初のページにアクセスしたときに高速に読み込まれるようにするには、CDN を使用します。ファイルが別のサイトによって既にキャッシュされている可能性はかなり高いです。他の人がすでに述べたように、CDN の結果ももちろん大量にキャッシュされます。

ただし、イントラネット Web サイトがある場合は、ファイルを自分でホストすることをお勧めします。通常、ファイルは CDN からよりも内部ソースからの方が高速に読み込まれるからです。次に、複数のファイルを 1 つに結合して、要求の数を減らすオプションもあります。

于 2012-10-16T15:15:12.757 に答える
4

CDN には、複数のサーバーを提供し、トラフィックをクライアントに最も近い場所に自動的にルーティングするという利点があります。これにより、場所ごとに最適化された、より迅速な配達が可能になります。

また、静的コンテンツは特別なアプリケーション サーバー (動的コンテンツなど) を必要としないため、CDN にオフロードできるということは、そのトラフィックを完全に削減することを意味します。ストリーミング ビデオ クリップは大きすぎてキャッシュできないか、キャッシュすべきではありません。ただし、必ずしもその帯域幅をサポートする必要はありません。CDN がそのトラフィックを引き受けます。

それは必ずしもキャッシュに関するものではありません。小規模なアプリケーション Web サーバーは、動的コンテンツを提供したいだけかもしれませんが、めったに変更されないヘビー ヒット メディア用のソリューションが必要です。CDN はスケーリングの問題を処理します。

于 2012-10-16T14:10:04.157 に答える
1

@Anthony_Hatzopoulos に同意 (+1)

CDN はキャッシングを補完します。また、場合によっては、キャッシュ ディレクティブの最適化にも役立ちます。

たとえば、私が働いている会社では、生成されたオブジェクトを識別して動的にキャッシュするために、行動学習アルゴリズムを CDN に統合しています。

通常、これらのオブジェクトはキャッシングできません (つまり、[Cache-Control: max-age=0] Http ヘッダー)。ただし、この場合、システムはキャッシングの可能性を識別し、元の HTTP ヘッダーの方向をオーバーライドできます。(例: 動的に生成され、キャッシュされる必要のある人気のある製品、または動的に生成されているにもかかわらず、同じ形式で何千人ものユーザーに表示される人気のある検索結果ページ)。

はい、あなたが尋ねる前に、システムは個人化されたデータと非常に新鮮なものを識別して、誤検知を防ぐこともできます... :)

このようなアルゴリズムの実装は、リバース プロキシ CDN テクノロジによってのみ可能になりました。これは、CDN とキャッシングが互いに補完し合い、より優れたスマートなアクセラレーション ソリューションを作成する方法の一例です。

于 2012-10-17T14:54:52.033 に答える