ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript DOM The Art of Programming (第 2 版) 読書メモ (JavaScript のベスト プラクティス)_JavaScript スキル
JavaScript DOM The Art of Programming (第 2 版) 読書メモ (JavaScript のベスト プラクティス)_JavaScript スキル
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBオリジナル
- 2016-05-16 17:21:00929ブラウズ
1. JavaScript の悪用を防ぐ 「JavaScript を通じてどの Web ページの動作を変更したい場合でも、実行する前によく考えてください。まず、この Web にこの追加の動作を追加する必要があるかどうかを確認してください。」ページ?"
個人的には、Web ページのインタラクティブなエクスペリエンスを向上させるために JavaScript がほぼどこでも使用されている現在の時代において、著者のこの文章は、JavaScript は適切に使用されるべきであり、Web ページの動作を妨げないようにする必要があるという意味として理解できると思います。クールな効果を実現するスクリプトの使用が原因で、読み込みが遅くなったり、互換性が極端に悪かったりすることで、ユーザーが Web サイトを閲覧したり使用したりできなくなる可能性があります。
2. スムーズな低下。 スムーズな低下とは、ユーザーがブラウザーで JavaScript を無効にした場合、またはブラウザーが JavaScript をサポートしていない場合でも、ユーザーは引き続き Web サイトを正常に閲覧できることを意味します。
最初にこの問題を見たとき、この状況はほとんど無視できるものだと感じたので、この問題に関するいくつかの議論 (Zhihu) とブログ投稿「JavaScript が利用できない問題の探索」を読みました。また、ブログパークのトップページ、つまりJavaScriptを無効にしてWebを閲覧してみると、ブログへのコメントはできないものの、分類効果は正常に表示されず、もちろん何もありませんでした。広告、主な機能（ブログ記事の閲覧、ページジャンプ等）は通常通りご利用頂けます。
その後、基本的に結論を導き出すことができます。つまり、スムーズな劣化を考慮すると、少なくとも Web サイトの主要な機能が正常に使用できることが保証されるべきです。 Blog Parkの場合はブログをチェックするということになります。
3. 「javascript:」疑似プロトコルとインライン イベント処理機能を無効にします。これら 2 つの記述方法を HTML で使用しても重大な問題は発生しませんが、スムーズな劣化 (一貫性のない Web ページの動作) を防ぎ、スクリプトの記述が複雑で、コードの保守が困難になります。
4. パフォーマンスに関する考慮事項 パフォーマンスに関する考慮事項のベスト プラクティスは、依然として非常に理解しやすいものです。
「DOM アクセスを最小限に抑え、マークアップを最小限に抑える」。 DOM へのアクセスが少なくなる理由は、DOM へのクエリが大量のパフォーマンスを消費するためです。複数の関数に対して繰り返される DOM クエリは、リファクタリングするか、グローバル変数として抽出するか、パラメーターとして直接渡す必要があります。マークアップを減らすと DOM のサイズが小さくなり、DOM ツリー内の特定の要素を見つけるのにかかる時間が短縮されます。
「スクリプトをマージ」。外部スクリプト ファイルを組み込むと、ページの読み込み時に送信されるリクエストの数を減らすことができます。 Chrome Developer Tools の [ネットワーク] タブを観察すると、リクエストの数と Web ページの読み込みにかかる時間がはっきりとわかります。下の図は、サードパーティの Baidu 共有プラグインが最も遅いことを示しています。もちろん、全体的なロード時間はまだ許容範囲内です。ただし、参照されるファイルが大きすぎる場合、またはサードパーティのプラグイン リクエストが遅い場合は、常にページ全体が読み込まれるため、Web ページの読み込みが遅いという印象を与え、エクスペリエンスが低下します。 
また、「マークアップ内のスクリプトの位置も、ページの初期読み込み時間に大きな影響を与えます。」ブートストラップの例と同様に、参照される JS プラグインはすべてページの最後に配置され、説明が追加されます。 
HTTP 仕様によれば、ブラウザは同じドメイン名から同時に最大 2 つのファイルしかダウンロードできず、スクリプトのダウンロード期間中はブラウザはダウンロードしません。他のファイルは、異なるドメイン名のファイルであってもダウンロードされません。通常、スクリプト ファイルはブロック内に置かれます。ブラウザから他のファイル (画像や他のスクリプトなど) を並行してロードすることはできません。
すべての <script> タグをドキュメントの末尾、<body> タグの前に配置します。これにより、スクリプトが読み込まれるときに、ウィンドウオブジェクトはそのままです。ドキュメントに対してさまざまな操作を実行できます。 <br><br>最後の提案は、スクリプトを圧縮することです。これはよく見かけますが、通常は .min.js 接尾辞が付いたスクリプト ファイルです。 </script>