2

AJAX呼び出しが遅いという問題があります。これはよくある質問ですが、私が見つけたすべての調査で提案されたすべてのことを行いました。これを読んだ人たちからコンセンサスを得たいと思っています。

基本的に、データベースから情報を取得するphpページにajaxリクエストを送信します。

こちらがページです。

すべてのjavascript、mySQL、およびphpスクリプト、リクエスト、およびページの時間を計測しました。(firebugを実行すると、コンソールとxmlに私のタイムマーカーが表示されます)

例として-

mysqlリクエストには20ミリ秒かかりますPHPページには50ミリ秒かかります少量のxml(1k未満)を処理してマーカーを生成するajax成功スクリプトの実行には8ミリ秒かかります。

それでも、ページの読み込みには4秒近くかかります。

したがって、どのスクリプトも遅れていないことを前提とすると、これはサーバーからの応答時間、または私自身のインターネット接続に問題があるはずです。

理論や考えをいただければ幸いです。

ありがとうございました

4

1 に答える 1

2

わかりましたあなたのページを見て、速度に影響を与える可能性があると私が見た問題のいくつかを以下に示します。

  1. getMarkers 関数でデータを取得するには 4 ミリ秒かかりますが、xml ファイルを読み取るには 892 ミリ秒かかります。ここで実行している検索の量が実際にパフォーマンスに悪影響を及ぼしているため、xml ファイルを読み取るためにバニラ JavaScript にフォールバックすることをお勧めします。
  2. サーバー上でローカルにあるすべてのスクリプトを縮小して結合します。非常に長い応答時間を取得していました。これを行うことで、4 つの http 要求を排除できます。これは、サーバーの応答時間に少し役立ちます。(これでjqueryまたはjquery uiを組み合わせないでください)
  3. サーバーが少し遅いため (おそらく共有ホスティングを使用しているため、これは異なる場合があります)、jquery と jquery ui を Google cdn でホストされているバージョンにリンクすることをお勧めします。これはそのJquery CDNに関する投稿です
  4. ページには 24 個の画像があります。そのうち 23 個は 4KB 未満です。これらの 23 を 1 つの CSS スプライト画像に結合し、1px X 1px の空の gif をインライン html 画像に割り当て、代わりに CSS スプライト画像を使用します。慣れていない場合は、これが何であるかについての良い記事があります: CSS スプライトの説明 また、オンラインの優れた css スプライト ジェネレーター: CSS スプライト ジェネレーター
  5. このページに Jquery UI が必要であることを確認してください。私はそれを必要とするものは何も見ませんでした。削除できれば、206k 節約できます。関連する CSS ファイルが不要な場合は、忘れずに削除してください。これにより、さらに 2 回の通話を節約できます。
  6. あまり深く掘り下げませんでしたが、まだ $(document).ready() で Google マップをセットアップするための呼び出しを開始していない場合は、ページの残りの部分をロードして、その領域にロード アニメーションを表示できます。 . このようにして、ユーザーは何かが起こっていることを知り、ページの読み込みが大幅に速くなるように見えます。

したがって、上記を実行することで、物事を大幅に高速化できます。82 のコンポーネントから 51 のローカル コンポーネントに、Google CDN ではさらに 2 つのコンポーネントになります。その xml 読み取り時間を改善できれば、オフロード時間もほぼ 1 秒短縮できます。

于 2010-10-16T00:15:59.160 に答える