JavaScript コードを HTML ページにインポートして使用する最良の方法は何ですか? 次の 2 つのオプションを検討しています。
- 選択した JavaScript メソッドを使用する、HTML ファイルにインポートされたファイルに単一の
<script>
タグを付けます。all.js
<script>
各 HTML ファイルに個別のタグを個別に定義します。
ここで最良の設計オプションは何ですか?
JavaScript コードを HTML ページにインポートして使用する最良の方法は何ですか? 次の 2 つのオプションを検討しています。
<script>
タグを付けます。all.js
<script>
各 HTML ファイルに個別のタグを個別に定義します。ここで最良の設計オプションは何ですか?
ルカシュ、この無邪気な質問は大きな話題です。JavaScript のパフォーマンスと保守性を良いところから始めるには、これに関するSteve Souders の記事に従ってください。
そしてJSHintを使用します。コードが JavaScript のみのファイルにある場合は、はるかに簡単です。その他の優れたプラクティスについては、idiomatic.jsを参照してください。
最小化された 1 つのファイルが最もパフォーマンスが高く、リクエストが少なく、ダウンロードが小さくなります。しかし、どこにでも 1 つのグローバル js があるわけではありません。これは、デバッグ/開発が面倒です。
おそらくブラウザにキャッシュされているため、ライブラリには cdn を使用します。
js を縮小することは、適切で受け入れられる方法です。また、実行時にサーバー側で js ファイルを構築するのにも役立ちます。これは大きなトピックです。yahooさんからのアドバイスです。これらをガイドラインとして使用します。トピック js minify http://developer.yahoo.com/performance/rules.htmlもお読みください。
IMO 個別の JavaScript スニペット/プラグインに個別のタグを用意します。これにより、JavaScript コードの保守が容易になります。他の JavaScript スニペットに影響を与えることなく、プラグインを削除したり、プラグインを追加したりできます。
ただし、パフォーマンスの問題のために、最新のブラウザーは 6 つの連続したスレッドを実行してリソースをダウンロードするため、サイト/Web アプリの読み込み時間をプロファイリングすることをお勧めします。Firebug/yslow などのツールを使用して、html ページから送信される http 要求をプロファイリングできます。
個人的には、Sitemeshなどのテンプレート エンジンを使用して、アプリケーションのさまざまな部分の jsps のテンプレートを作成しています。
また、javascript については、主に JQuery と多くのプラグインを使用しています。