web-dev-qa-db-ja.com

Chromeに6つの同時接続すべてをできるだけ早く使用するように指示するにはどうすればよいですか?

http://www.camping.info/campinplaetze のレンダリングパフォーマンスを向上させたい。 WebPageTest.orgでテストを実行すると、ウォーターフォールチャートで http://images-camping.info 、Chromeからロードされた画像が最初にのみ開くことがわかりますthree接続。2秒のマークでのみ別の3つを開きます。そのため、最初の6つのイメージが連続して読み込まれ、すべてが接続ビューに表示される3番目の開いている接続に読み込まれます。

Resource viewConnection view

Chromeを開いて、1秒以内にimages-camping.infoへのsix同時接続を開き、ダウンロードできるようにしますより多くの画像を並行して使用すると、ページのレンダリングが高速になります。

誰でもそれを行う方法を知っていますか?

2
Oliver

短い回答-すべてのブラウザには特定の 並列接続を開くための制限があります。Chromeの場合、この制限は10です。

私がそこにいた場合、私は2つのことしかしませんでした:

  1. 画像の最適化-PNGファイルを使用している場合は、 tinypng.com を使用することをお勧めします。これは、Google PageSpeedモジュールと比較して画像を十分に圧縮するためです。

  2. CDNから画像を提供する-画像URLはAmazon Cloudfront URLで始まるため、Amazon Cloudfront CDNを使用して画像を提供します。したがって、2番目のドメインを使用する必要はありません こちらの例 ドメイン名。 CDNは さまざまな方法 で役立ちます。

1
Goyllo

複数のサブドメイン(CNAME)があり、それらを介していくつかのリソースをロードできます。例:

  • css.domain.com
  • js.domain.com

または、より良い、assets1、assets2など。これらはすべて同じサーバーを指しますが、ページのソースでは異なるサブドメインを使用してブラウザをだます

1
DennisP

Chromeにページの読み込み方法を伝えることができるかどうかはわかりませんが、ウェブサイトを最適化することしかできません。

  1. Expire Headersから始めて、画像だけでなく、基本的にすべてが正しく機能していることを確認してください。

  2. あなたのウェブサイトの写真を最適化してください、あなたはそれをしたと思いますが、まだしていないなら、tinypng.comまたは他のようなオンラインコンバータを使ってあなたの画像を圧縮してください。

  3. Srcファイルに.gzip圧縮を使用し、それらを縮小します。

パフォーマンスの最適化を掘り下げることは確かにありますが、これら3つの基本的なことから始めることを検討する必要があると思います。それらが役立つ場合は、さらにアドバイスを提供できます。

0
knif3r