ライブラリ/依存関係
は通常、最初に行うべきことは、例えばコア依存性を決定していますあなたのカスタムコードのほとんどが主なライブラリですか?私はすでにあなたのリストから
の下線と
jQueryは基本的に同じことをしようとしています。どれが最も最適化され、最速であるかは徐々に平準化されています。 2番目のアンダースコアがまだ最も速いと仮定しましょう。トラバースのためのjQueryに依存しています。ミクロスピードを得るために余分なライブラリを用意しますか?私の意見では、各ページの余計なペイロードは価値がありません。
次にブートストラップが主なCSSドライバである可能性がありますが、使用する可能性があるいくつかのJavaScript機能があります。カルーセル、日付ピッカー、ドロップダウン、他のウィジェットを切り替える...それらが使用されているかどうか(おそらくはい)、そうでない場合は、Bootstrap jsライブラリを削除してください。ブートストラップはまだjQueryに依存していることに注意してください。
選択/選択はオプションのプラグインです。それらの目標はBootstrap/jQueryでカバーされる可能性が高いです。それらをリファクタリングしてみてください。
スリックグリッドもグリッドシステムです。ブートストラップグリッドよりも何が利点ですか?彼らがブートストラップをリファクタリングしたように聞こえる。それが使用されている場合は、ブートストラップグリッドにリファクタリングして、チームの一般的な知識を増やしてください。
ハンドルバーテンプレート用。論理演算子を使用すると便利です。そうでなければ、小さな置換関数を簡単に見つけることができます。
function renderTemplate(obj, template) {
var tempKey, reg, key;
for (key in obj) {
if (obj.hasOwnProperty(key)) {
tempKey = String("{{" + key + "}}");
reg = new RegExp(tempKey, "g");
template = template.replace(reg, obj[key]);
}
}
return template;
}
CKEditorバージョン/ラファエル心の内の1つの具体的な目標=> WYSIWYG /ベクターとのライブラリです。怠惰なロードを理想的に保つのに最適です。必要なときにのみページにそれらを含める。サーバーの言語は<script>
が<head>
タグに含ま扱うなら
// after the additional library was loaded ...
cacheObj1.on('focus', this.initCKE);
cacheObj2.on('click', this.initVector);
、あなたは心の中で特定のページで必要とされる、簡単なスクリプト参照を、維持するために選択することができます。 20のDOM準備完了イベントをインラインで終わらせないで、プロジェクトに必要なものすべてを初期化する準備イベントを1つだけにしてください。遅延ロードに
- jQueryのプラス様々なプラグイン
- ブートストラップ
- ハンドル
-
CKEditorバージョン
リファクタリング
-
LIBコアへ
-
選ば/ Selectセレクト
リファクタリングD3 /ラファエル
リファクタリングから遅延ロードへ
アプリケーション/カスタムJS
libのコアへ
アンダー
リファクタリングのlibコアへ
SlickGrid
リファクタリング今トリッキーな部分が始まります。あなたのJavaScriptのスキルはどれくらい良いですか、以前のプログラマーはどれくらいうまくいきましたか? jQueryセレクタが大量に見つかった場合は、モジュール方式でプログラムされていない可能性が高いです。あらゆるコードの平和を何かにリファクタリングするという難しい作業が始まります。 ここでのアイデアは、あなたのライブラリと会話するインスタンスまたはローダーファイルを持つことです。おそらくカスタム関数ファイル(あなたが望むならアンダースコア関数を保持することができます)をコード全体で使用するでしょう。プロトタイプや "クラス"とシングルトンはそれを完成させます。A nice postリファクタリングについては、これを設定する方法に関するリンクを追加することができます。それでは、grunt/gulpの設定はあまりにも派手ではありません。 JS(npm、bower)とCSS(コンパス、less)のオートメーションは、その場でカバーすることができます。
結論
jQueryが主な依存性の可能性が高いです。あなたがそれを取り出すならば、あなたは最初から始めるでしょう。あなたが話すすべてのプラグインは、ページの読み込み時に余分な脂肪です。それほど優れているわけではありませんが、クッキースクリプト、jsonサポート、polyfillsなどの他の機能を再利用するだけの費用を払うこともあります。 1つまたは2つのコアライブラリを使用し、依存関係とアプリケーションコードを明確に分離してください。
はbundle and minify ^^
ハッピーリファクタリングすることを忘れないでください!
これは大いに役立ちます!遅延読み込みとは何を意味しますか?私はそれを必要とするページにロードすることを前提としていますが、Railsのアセットパイプラインは難しいものです。あなたはCDNを使うことを意味しますか? これらの依存関係のそれぞれは、SlickGridのような理由で選択されました。なぜなら、列をマージできるからです。コアlibを使用すると、いくつかの機能を再実装することになります。場合によっては努力する価値があるかどうかは不明です。 –
番号が付いているので、ライブラリの読み込み順序について考える必要があります。 1と2の間で、 '$'オブジェクトに接続するときに、いくつかのjQueryプラグインを追加することができます。 「Modernizr」は、私が例を挙げて0にするものです。それをバンドルして小型化し、余分なものはすべて、特定の機会にのみ使用されます。スクリプトタグを頭に置くか、ajaxライブラリの読み込みやその他の手法によって動的にインクルードされます。 –