2017-05-19 3 views
-1

私は、さまざまな異なるページやフォームをajaxで呼び出すサイトで作業しています。ページの読み込み時間を節約するために、私は各ページやフォームに必要な.jsファイルのみを読み込もうとしていますが、開発中にはイベントや要素のようないくつかの問題やエラーが発生します($(document)参照)。また、Jqueryはajaxを使用してインラインjをロードするための非推奨警告をスローします。新しいjavascriptを読み込むためのベストプラクティスは何ですか?

私はjqueryの.getScript()関数で外部スクリプトを呼び出すことができ、すべてのエラーを解決できることは知っていますが、必要なすべてのスクリプトファイルをメインヘッダー(またはフッター)。

どのアプローチは、ワークフローとユーザーエクスペリエンスの面でより効率的ですか?最初にすべてのサイトjをロードするか、必要に応じて動的にスクリプトをロードしますか? (この場合、無関係なjsファイルの合計サイズは約50kbです)

+0

ドキュメントの最後にすべてのスクリプトを含めると、読み込みパフォーマンスが向上するように見えるはずです(htmlページを表示する前に読み込みを完了する必要がないため) – Alessandro

+0

逆に、ページの読み込み時に利用可能なので、FOUC ...が少なくなります(したがって意見に基づいて) –

+0

頭に最も必要なものだけをロードします(依存関係があるものもあります)ので、BL(ビジネスロジック)スクリプト体の中に – Plankton

答えて

1

ロードするときに動的にロードし、各jsファイルをロードすることをお勧めします。実際には非推奨のload()を忘れて使用してください$.ajax()構文。

+0

私は '$ .ajax()'構文を使用していますが、Ajaxを使ってスクリプトを読み込むときにJqueryが警告を出します: _ "メインスレッドの同期XMLHttpRequestは、エンドユーザの経験に有害な影響を与えるため、 more help https://xhr.spec.whatwg.org/"_ – freeworlder

+0

新しいスクリプトを読み込むために '.getScript()'を使うことができますが、ファイルがおそらく合計で200k未満であると考えています。 '$(document)'オブジェクトから要素やイベントを参照しなければならないという余分なコーディングと不便さがあります。 – freeworlder

+1

xhr要求の明示的な非同期オプションをtrueに設定して修正することができます。この回答を確認すると多分お手伝いできます:http://stackoverflow.com/questions/28322636/synchronous-xmlhttprequest-warning-and-script – SilverSurfer

関連する問題