15

JavaScript(jQuery)関数を保持するための最良の方法に関するアドバイスを探しています。

私はMVC/かみそりで開発しているので、レイアウトページがあります。ここにjQueryライブラリと外部JavaScriptファイルを含めて、すべてのページで利用できるようにします。

これはうまく機能していますが、すべてのページに約300行のJSを追加しているという事実に気づき始めています。ここでは、その半分がこれらのページのいずれかで使用されている可能性があります。

1つの関数は外部ファイルになく、代わりにHTML内にあります。これは、かみそりのコードで設定された変数を使用する必要があるためです。

この取り決めに関していくつか質問があります。

  • かみそりを使用して設定された変数を使用する場合、HTML内にJSを配置することは一般的に受け入れられますか?変数を外部のjsファイルに渡すクリーンな方法はないようです
  • 関数を個々のJSファイルに分割し、サイトの各ページに必要なものだけを含める必要がありますか?
  • それらを複数のファイルに分割した場合、jQueryでどのように機能します(document).readyか?含まれているすべてのJavaScriptを使用する場合は、それを使用する必要がありますか?

これは白黒の答えよりも意見の問題になると確信していますが、先に進む前にすべての選択肢を検討したいと思います。そのままでは問題なく動作しますが、もっと良い/よりクリーンな方法があると感じずにはいられません。

4

2 に答える 2

12

ユーザーがホームページにアクセスしてjavascriptファイルをロードすると、ブラウザにキャッシュされるため、後続のページでJavascriptが再度ダウンロードされることはありません。

私は間違いなくjsを分離しておくでしょう、あなたはその特定のビューが必要とするJSを初期化する各ページにスニペットを持つことができます。JSを実行する必要があるビューに以下のようなものを入れてください

$(document).ready(function() {
    mysite.mypage();
});

次に、関数mysite.mypage()を外部JSファイルで定義できます。300行は世界の終わりではありません。おそらく、最適化について心配するのは時期尚早だと思います。

サイズを小さくするために、そのJSファイルを縮小することをいつでも検討できます。これを行うための迅速かつ簡単な方法はここにあります:

http://www.minifyjavascript.com/

于 2012-12-19T14:45:56.200 に答える
3

require.js について聞いたことがありますか? http://requirejs.org/ 本当に便利だと思います。

これはモジュール ローダーであるため、すべての JS コードを個別のファイルに分割し、各ページで必要なものだけを読み込むことができます。

変数を外部JSファイルに渡すことについては知りません。その可能性/「正しい」方法だとは思いません。

各外部 JS ファイルを、パラメーターを受け取って返す関数にすることができます。次に、それを使用する必要があるページで: - ファイルの依存関係を含めます - 関数を呼び出します

それが私がしていることです、あなたの2番目の提案のようです。

$(document.ready) の質問については、本当にあなた次第です。使用する必要はありませんが、いくつかの場合に役立ちます。この概要を確認してください: http://docs.jquery.com/Tutorials:Introducing_ $(document).ready()

于 2012-12-19T14:57:27.433 に答える