JavaScriptコードを縮小する理由とは？

JavaScriptの自動縮小とは？

最小化とも呼ばれる自動縮小は、機能を変更せずにJavaScriptソースコードから不要な文字をすべて削除するプロセスです。これには、空白、コメント、セミコロンの削除、変数名や関数の短縮版の使用が含まれます。JavaScriptコードを自動縮小すると、ファイルサイズが小さくなります。

たとえば、これは自動縮小前と後のコードブロックです。

縮小前：8行のコード

自動縮小後：コード1行

自動縮小により、Webページの読み込みが高速化されるため、Webサイトの体験が向上し、訪問者と検索エンジンの両方が満足します。

自動縮小は難読化、圧縮、暗号化、uglificationとどのように異なりますか？

• Uglification：これは基本的に自動縮小と同じです。Uglify JSは、JavaScriptファイルを縮小するためのJavaScriptライブラリです。JavaScriptファイルを「uglify」する、というのは、Uglifyを使用して縮小するという意味です。Uglificationは、読みやすさは低減しますがパフォーマンスを向上させます。
• 暗号化：これは、プレーンデータと呼ばれるデータをエンコードデータに変換するプロセスです。この暗号化またはエンコードされたデータは暗号文として知られており、復号化のためには秘密鍵が必要です。ブラウザは暗号化されたコードを実行できません。暗号化はセキュリティ機能であり、必ずしもファイルのサイズを縮小するとは限りません。
• 難読化：このプロセスは、ビジネスロジックを隠すために使用されます。コードは、人間が読めなくなるように修正されます。これにより、リバースエンジニアリングが困難になります。難読化は、コンピューターはそれでもコードを理解して実行できるという点で暗号化とは異なります。難読化は、変数、関数、およびメンバーの名前を変更することで実現されます。結果としてファイルサイズが縮小されるとパフォーマンスも向上しますが、これは難読化の主な目的ではありません。
• 圧縮：データ圧縮は、データを表すのに必要なビット数を減らすプロセスです。データ圧縮により、ハードドライブ上の貴重なスペースを解放し、ファイル転送を高速化し、ネットワーク帯域幅のコストを削減できます。Microsoft Wordファイルなどの一部のファイルは、元のサイズの90％に圧縮できる場合もあります。

開発者が最初から縮小コードを書かない理由とは？

自動縮小によりファイルがコンパクトになり、Webパフォーマンスのベストプラクティスになります。それでは、すでに縮小されたコードを書いてはどうでしょうか？

JavaScriptコードは、コードを理解してデバッグするためには空白、フォーマット、およびコメントを必要とする人間のために、人間によって作成されています。コードの作成後、パフォーマンスを改善するために縮小ソフトウェアを使用できます。これは、ブラウザーがコードを理解しなくてもコードを実行できるためです。

自動縮小の欠点とは？

テーマ、プラグイン、サーバー環境などのサイト依存の変数により、自動縮小することで複雑なスクリプトが破損する可能性があります。また、自動縮小は他のパフォーマンスチューニングと組み合わせて実施する必要があります。単独では、大きな利益をもたらさないかもしれません。自動縮小は、デバッグが困難なエラーを引き起こす可能性もあります。

このようなデメリットはありますが、パフォーマンスを少しでも向上させるために、通常、圧縮は試みる価値があります。CSSを軽量化する方法についても説明します。