数日前にウェブサイトを立ち上げました...最近、非常に遅いです。それはグラフィックでしょうか?リンクは次のとおりです: http://britobmarketing.com onMouseOver 効果が発生するのに時間がかかりすぎます。バックグラウンドの読み込みにも時間がかかります。それはすべてただ遅いです...なぜこれが起こっているのか誰かが知っていますか?
どうもありがとうございました!
-ブリト。
数日前にウェブサイトを立ち上げました...最近、非常に遅いです。それはグラフィックでしょうか?リンクは次のとおりです: http://britobmarketing.com onMouseOver 効果が発生するのに時間がかかりすぎます。バックグラウンドの読み込みにも時間がかかります。それはすべてただ遅いです...なぜこれが起こっているのか誰かが知っていますか?
どうもありがとうございました!
-ブリト。
1.5 メガを超える画像が 2 枚あります。これはウェブにとって非常に大きなことです。
のサイズをそれぞれ 250kb 以下に縮小する必要がplainbgndwall.jpg
ありbgndwall.jpg
ます。
Webベースの負荷テストでページの閲覧時間を確認しましたが、ページの読み込みに約11秒かかりましたが、すばらしいエクスペリエンスではありませんでした。結果は次のとおりです。
上の画面では、ほとんどの時間が画像で示されているので、どこで作業する必要があるかを理解できます。以下のリンクからURLを入力して、同様のテストを自分で実行することもできます。ページの読み込み中に何が起こっているかについて、さらに詳しく知ることができます。
http://www.uptrends.com/aspx/free-html-site-page-load-check-tool.aspx
はい、画像は他のコンピュータ リソースと同じです。それらはメモリを消費し、それらをレンダリングするために CPU 処理サイクルを消費します。リソースが大きいほど、メモリの使用量が多くなり、レンダリングにかかる CPU サイクルが多くなります。
低品質の圧縮バージョンの画像を作成することをお勧めします。Adobe Fireworks (広告なし、私が使用しているのはこれだけです) などの一部の画像処理ツールには、細部を大幅に劣化させることなく画像を圧縮するオプションがあります。未使用の色を削減または削除することもできます。
また、すべてのスロー効果の主な原因ではありません。DOM 操作と不適切なコードもパフォーマンスに影響を与える可能性があります。
それらの画像は巨大です。ユーザーにページの読み込み時に 4 MB 以上をダウンロードするように依頼し、その上でアニメーション化すると、実際にサイトの速度が低下します。画像のサイズを小さくすると、パフォーマンスが向上します。
ページの読み込みを速くするために、常に 100KB に近いかそれ以下の画像を取得するようにしています。また、表示する画像が 500KB を超える場合は、ユーザーがナビゲートするときに画像の読み込みを遅らせます。
ブラウザーは、マウスオーバー画像が最初に必要になったときにのみ読み込みます。ブラウザーがそれらをキャッシュすると、スワップ アニメーションははるかに高速に見えます。<img>
画像を非表示のタグに入れるなどして、画像をすぐに読み込ませることができます。
とはいえ、このようなささいな美容効果のために非常に多くの大きな画像を必要とするのは、ちょっと悪いことです。接続が遅いユーザーは、ユーザー エクスペリエンスが低下する可能性があります。