2012-06-08 9 views
5

私は、レイジーロード、scrollTo、イメージ効果のもの、このサイトの人の記事を読むことで収集されたさまざまなjQueryプラグインを使用しています。さて、これらの効果はすべてフッターから放り出され、起こっている遅れのようなものです。効果は、躊躇したり、揺れたり、滑らかではありません。jquery-in-footer code optimization(理論)

私は、ドキュメントの準備とウィンドウの負荷を使って遊んだことがあり、FOUCを防ぐためにヘッダーにスニペットがありますが、キューイングの問題やメモリの過負荷などがあると感じています。 (これはあなたのラップトップを使いすぎて、実行中のプログラムがたくさんあるようなもので、すべてが重くて遅いと感じるようなものです。)

特にOperaにあります。何らかの理由でOperaが私のサイトを操作できないようなものです。

いくつかのjqueryエフェクトはこのような問題を引き起こすはずです。人々は激しいビデオゲームをプレイしますが、問題はありません。しかし、フェードイン効果を持つウェブサイトは、コンピュータが突然処理するにはあまりにも多くなります。私のフッターコードに間違っている何かがあるはずです。

だから私の理論の質問に -

は標準的な慣行のようにあり、私は、お互いに競合しない、これらのjqueryの効果のすべてがスムーズに実行してください少ないメモリを飲み込んするには、次の起動する必要があります何か?

+2

間違いなく[セレクタをキャッシュする](http://stackoverflow.com/questions/5724400/does-using-this-instead-of-this-provide-a-performance-enhancement) –

+1

あなたのウェブページのアドレスを教えてください。私たちはそれを調査し、アドバイスをします。 –

+0

www.ideagasms.netありがとう – Stephen

答えて

5

まずは、のJavaScript/jQueryコードがWebページの速度を遅くしているのか、それともプラグインなのかを判断する必要があります。つまり、コードprofileです。

これを実行したら、最適化を開始できます。そこには、jQueryの最適化について議論するたくさんの記事があります。

いくつかのヒント:彼らは重く、ブラウザによって最適化されgetElementById()、に委任されているので、それ自体で

  • IDセレクタは高速です。
  • キャッシュjQueryセレクタ。つまり、$('.class1 #id2 > child3')を10回連続して呼び出さないでください。変数に保存var $mytd

エラーがプラグインにある場合は、オプションが制限されます。

  • が、彼らはすぐにロードするように、それらが縮小されていることを確認します
  • (それだけでファイルを転送するために時間がかかることはありませんが、また、彼らがコンパイルされていないので、読むために):しかし、あなたが試すことができますいくつかのものがあります
  • 軽量の代替案を見つける。例えばフェード効果が必要な場合は、50kbのjQueryライブラリを完全には含まないでください。

Operaは、少なくとも私が聞いたところから、非常に速くなければなりません。しかし、IEを使用してテストしている場合は、遅くなることを期待してください。彼らのJavaScriptエンジンはあまり良くありません。

+2

ウェブでのみ50kbの "本格的な"ライブラリ:) – n0pe

+0

もちろん、ウェブロードのベストプラクティス、Yahooの[Webサイトのスピードアップに関するベストプラクティス](http: //developer.yahoo.com/performance/rules.html)。誰もが知っているが、それは言及する価値がある。 –

+0

ええ、90年代のYslowグレードを取得しているので、これはjqueryのオーバーロードの問題です。すべてのあなたの返信をありがとう、私は多くの読書があるように見えます。誰かが見たいと思えば、www.ideagasms.netです。私はフッターに細かい音符を残していますので、その中のスニペットを理解するのは簡単です。 – Stephen