JSコード最適化スキルの普及版（jsサイズ削減）_javascriptスキル

この記事を注意深く読むと、ほとんどの JS 最適化方法をこれら 3 つの方法から切り離すことができなくなります。

(Web ページの合計サイズは 155,000 で、JS が 100,300 を占めます)

JS を最適化する時期です

JS の最適化に関する記事はすでにたくさんありますが、そのほとんどは変数、文字列、型などの非常に専門的なものです。それらは紹介する必要もありません。 . 知っていてもダメです。ほとんどのウェブマスターはそれを「使用」しています。JS にそれを配置および削除する方法を指示するだけです。

今日の Web サイトには、統計コード、共有ツール、コメント リスト、関連記事プラグインなどのツールが装備されており、強力な機能を実現するには、これらの JS プラグインを使用する必要があります。ウェブサイトの速度にも影響します。

最も一般的に使用される JS 最適化方法

ブログの JS 呼び出しから判断すると、現在速度に最も大きな影響を与えているのは、Wumi プラグイン (952 ミリ秒) と Nafoneng Ads (434 ミリ秒) です。本当に使用したい場合は、それを保持し、公式の教科書に従って適切に最適化することができます。以下では、Lu Songsong が最も一般的に使用される JS 最適化方法のいくつかを紹介します。

方法 1: 重要でない JS をページの下部に配置します

これは、重要でない JS をすべてページの本文の上に配置して非同期読み込みを実現します。つまり、Web ページが読み込まれるのを待って、最後にこれらの重要でない JS ファイルを読み込みます。 .JS なので、Web ページの速度には影響しません。

たとえば、控えめでゴージャスなテンプレートの util.js パブリック ファイルのデフォルトの効果は、Web ページを閲覧すると、「トップに戻ってコメントを書く」という特殊効果が Web ページに表示されます。 。 wumii (Wumi プラグイン JS) と jiathis (共有ツール JS) が util.js ファイルに統合されました。

(重要ではないJSはページの下部に配置されています)

もちろん、他の Web サイトでもこれを行う必要があります。重要でない JS はすべてページの下部に配置します。

方法 2: JS ファイルをマージ

JS をマージする。つまり、HTTP リクエストを減らし、サーバーへのリクエストを減らしてプロセスを高速化します。これにはある程度のスキルが必要ですが、これは最も簡単な方法です。 :

何はともあれ、まず A ファイルを B ファイルに直接貼り付けます。Web ページが正常に動作する場合は、A ファイルを削除してください。一部の特殊効果が失敗しても問題はありません。 C ファイルをマージして置き換えます。競合しない 2 つの JS ファイルが常に存在します。

たとえば、私のブログの Baidu アド マネージャーには 6 つの広告スロットがあり、デフォルトでは 6 つの HTTP リクエストが必要です。これはサードパーティ JS であるため、1 つのリクエストには最速で 234 ミリ秒かかります。つまり、この広告マネージャーのせいで、Web ページを開くのにさらに 2 秒かかります。

(JS の 2 番目の部分は 6 つのリクエストを 1 つに変換します)

公式チュートリアルに従って JS をマージした後、6 つの広告スロットの広告リクエストが 1 つのリクエストにマージされます。これにより、JS リクエストの数が大幅に削減され、ページ レンダリングのブロックが効果的に軽減され、広告の読み込み速度が向上します。

方法 3: JS ファイルの重量を減らす

三項演算子、オブジェクト検索の削減、JS を簡潔にする方法については説明しません。「JS Weight Loss Tool」を使用します。通常、このようなツールは、JS ファイル内の数百行のコードを 1 行に圧縮し、サイズを小さくします。推奨ツール: http://javascriptcompressor.com/ または ソフトウェア バージョン (良好なフォールト トレランス効果)

このようなツールを使用すると、空白行などの問題が発生するため、JS 機能が無効になることがあります。最も簡単な方法は、Dreamweaver を使用して、圧縮された JS を DW に入れることです。エラーが発生したことを示すメッセージが自動的に表示されます。エラーが発生した場所に新しい行を追加するか、復元します。

最後に、ネチズンの個人的な経験を紹介しましょう:

サイトが時間の経過とともにゆっくりと成長すると、多くの問題が見つかります。その 1 つは、サイトがますます肥大化し、実行速度も低下することです。最適化、つまりサイトを最適化するために最善を尽くすことが非常に重要になっています。

これらの方法は理解しやすいので、皆さんに役立つことを願っています。