performance - 直し方 - 人間関係リセット症候群 離婚




要素/スタイル/スクリプトの関係を維持しながら、全体のディレクトリを縮小しますか? (2)

あなたが探しているものは、縮小しているのではなく、圧縮しています。 識別子を短縮するとインタフェースが変更され、依存する外部スクリプトが破壊される可能性があるため、定義による縮小は空白を削除するだけです。 この理由から、圧縮は本質的に圧縮よりも安全ですが、閉じたシステム(つまり、カプセル化されたWebアプリケーション)では、圧縮が良いアイデアになる可能性があります。

Javascriptの場合、ほとんどの人はYUI CompressorまたはDean EdwardsのPackerを使用します。

CSSには、スタイルを最適化するためのツールがたくさんありますが、クラス名を短くすることはできません。 この理由はいくつかあります:

  1. CSSファイルを圧縮するには、その中のクラスとIDの参照を変更するために、スクリプトはそれを含むすべてのHTMLファイルを知る必要があります。 あなたのウェブサイトのサイズと構造によっては、彼は自明ではないかもしれません。
  2. 圧縮後、 <span class="image_caption"><span class="a12"> 、さらに悪い場合<p id="a12">なると、セマンティックHTMLは読みにくくなります。

あなたが記述したようなことをすることは間違いありませんが(私は実際には個人的なCMS /フレームワークに取り組んでいます )、メンテナンスできるようにするためには、きちんと構造化されたCMSの統合部分でなければならないでしょう新しい変更が公開されるたびにすべてのファイルを「舞台裏で」圧縮し、すべての元のファイルを保持してサイト全体を維持できるようにします。

現在、プロジェクトディレクトリ全体を縮小できるソリューションはありますか? もっと重要なのは、クラス名、IDを短くして、すべての文書で一貫性を保つことができるソリューションが存在するかどうかです。

これを変える何か:

Index.html ---

<div class="fooBar">
  <!-- Code -->
</div>

Styles.css ---

.fooBar { 
  // Comments and Messages
  background-color: #000000; 
}

Index.js ---

$(".fooBar").click( function () { 
  /* More Comments */
  alert( "fooBar" ); 
});

これに:

Index.html ---

<div class="a"></div>

Styles.css ---

.a{background-color:#000;}

Index.js ---

$(".a").click(function(){alert("fooBar");});





page-load-time