0

私は自分のバンドのウェブサイトとtumblrの構築を担当しています。私は紙のドラフト段階にいます。現在、パフォーマンスを最適化するためにスクリプトを処理する方法を考えています。

基本的に、私は必要です：

  1. jQuery：DOMの準備ができたら、いくつかの対話機能と同様にDOMを操作します。
  2. Flashフォールバックを備えたHTML5音楽プレーヤー用のjPlayerのプレイリストプラグインを備えたjPlayer。
  3. Songkick APIからデータをロードするためのカスタムスクリプト（ツアー日程）。ページにツアーショーを追加します。DOMの準備ができた後に発生する必要があります（Ajaxリクエスト）。
  4. APIを使用してSoundCloudから曲をロードするカスタムスクリプト。これは、ユーザーが音楽プレーヤーから再生ボタンをクリックしているときに発生するはずです（これらは長いトラックであるため、ページの読み込み中に読み込むことはお勧めできません）。

だから、私はそれらすべてのスクリプトを構造化して、物事が適切なタイミングで適切な順序で発生するようにする方法を考えています。私は数年間開発シーンから離れていましたが、投稿する前に少し読んでください。現在、JSのデザインパターンはモジュラーアプローチを使用する傾向があることを確認しました。RequireJSのWebサイトを少し読んだので、試してみるかもしれません。

さて、私の主な質問は、可能な限り最高のパフォーマンスで正しい時間に読み込まれるようにスクリプトをどのように構成する必要があるかということです。RequireJSは、このようなデザインパターンの問題を解決するためのオプションですか？

申し訳ありませんが、これは構文の問題ではなく、思考のプリコーディングの問題です。手を汚す直前に考えようとしているだけです。

よろしく、O。

4

1 に答える 1

0

私はあなたが時期尚早の最適化の危険にさらされていると思います。通常どおりスクリプトをロードします。パフォーマンスの問題が発生した場合は、Require.jsなどのツールを取り込むことができます。たった4つのスクリプトで、問題が発生することはないと思います。

そうは言っても、スクリプトをロードするためのいくつかのポインタ：

  • スクリプトを（終了タグ<body>の直前）の下部にロードします。この方法では、ページコンテンツのロードがスクリプトによって妨げられることはありません。</body><head>

  • カスタムスクリプトを次のようにラップしますdocument.ready：

    $(document).ready(function() {
  // your code
});

    これは、すべてがロードされるまでスクリプトが実行されないことを意味し、ロード順序の問題を回避します。

  • GoogleのCDNを使用してjQueryをロードします。高速であり、（さらに重要なことに）多くのサイトで使用されているため、ユーザーによってすでにキャッシュされている可能性があります。

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">

    https://developers.google.com/speed/libraries/devguide

スクリプトをロードするさまざまな方法についてまだ心配している場合は、これが私が知っている最高のリソースであり、各アプローチの長所と短所が網羅されています。

https://developer.mozilla.org/en-US/docs/XUL_School/Appendix_D:_Loading_Scripts

于 2012-10-10T18:08:03.523 に答える