jsとcssを開発する場合、ファイルを元の形式に保つ方が便利ですが、本番環境ではファイルを縮小してマージする必要があります。 いくつかのビルドシステムがありますが、それらの使用は非常に難しく、問題があります。 少なくとも、私はコレクターを書くことにしたほど、彼らに飽きてきました。 それは非常に便利であることが判明したので、私はあなたとそれを共有することにしました。
私が戦うことにした別の問題は、htmlのファイルを接続することの利便性ではありませんでした。 1つのファイルを接続するには、次のように記述する必要があります。
<script type="text/javascript" src="..."></script>
20個のファイルがある場合、これはすべて混乱に変わり、何かを見つけることが困難になります。 この場合、スクリプトとcssはページの異なる部分で接続する必要があります。 また、たとえばブートストラップを別のディレクトリにスローする必要がある場合は、ページの最初と最後でパスを変更する必要があります。 一般に、この方法でファイルを添付する方がはるかに高速になると判断しました。
<use> file1.css file2.js dir/ file3.js file4.css </use>
また、使用中に
いくつかの素晴らしい機能を追加しました。 たとえば、現在のドメイン（ホスト）を挿入します。 しかし、私の歌はそれについてではありません。
タグを使用するだけで十分であり、ビルド構成でファイルを作成する必要はなく、表現するためにミドルウェアを作成する必要がありました。
つまり アセンブリはオンザフライで発生します。ブラウザが本番環境でファイルを要求すると、ディスク上の元の形式ではありますが、最小化されて返されます。 less、sass、coffeescript、jade、haml、mdの自動コンパイルを有効にしました。 これもオンザフライで発生します。
当然、これらすべてがサーバーの生産パフォーマンスに最良の方法で影響を与えるとは限りません。 したがって、実稼働環境では、結果はメモリにキャッシュされます。 それまでの間、彼はgzipの後に結果のキャッシュを追加しました（なぜCPUが無駄にロードされるべきか）。 ブラウザ側のキャッシュ（ETag）も利用できます。 一般に、標準の静的ミドルウェアであるExpress / Connectよりも高速であり、ディスクとストーンのロードが少なくなります。
標準ミドルウェアは、ファイル統計を2回取得し、ディスクからファイルを読み取り、結果を圧縮します。 私のものは、メモリからデータを吐き出すだけです。
数行で接続します
npm install fast-static
var fastStatic= require('fast-static'); app.use('/static',fastStatic.use('./static'));
次に、スクリプト/リンクの代わりに、htmlファイルでuseタグを使用します。
以上です。 envは販売されたサーバーで変更することを忘れないでください。
一般的に、便利な組立システムが得られました。
特徴
- 変換：コーヒー、ハム、レス、ジェイド、サス、md
- useタグを介した簡易ファイル添付
- 拡張子による自動MIMEタイプ
- gzipをサポート（メモリにgzipをキャッシュ）
- ブラウザ側のキャッシュ（ETag）をサポート
env = productionが最適化される場合
- css、js、およびhtmlを最小化する
- ファイルのマージ
- cssに小さな画像を埋め込みます
- 結果をメモリにキャッシュします
githubに関する完全なドキュメント：
https :
//github.com/Hkey1/fast-static-
更新
新しいバージョンは、ディレクトリdir / *にinkludファイルが登場しました
シンプルな包含ライブラリがありました-useタグに名前とバージョンを追加するだけです。 たとえば、「bootstrap 3.1.1」
ブラウザ側のキャッシュを大幅に高速化しました。