D7に最適なCSSおよびJS集約/縮小戦略


8

Drupal 6には、CSSとJS をインテリジェントにバンドルするという素晴らしい仕事をする素晴らしいadvaggモジュールがありますが、現在のところD7リリースはありません。

私が達成しようとしているのは:

  • CSSファイルとJSファイルが少ない(5つのCSSファイルと5つのJSファイルは多すぎる)
  • JSファイルは縮小化されています(現在、CSSではコアのみがこれを実行します)

ここで役立つdrupal 7ソリューションはありますか?これを最適化した他の人の経験は何ですか?


編集:質問は最初に2011年に投稿されました。現在、advaggの非常に安定したD7リリースがあります。

回答:


12

D7には、サイトに関する実際の統計に基づいて集計する学習モードを持つコアライブラリがあります。

すべてを1つの巨大な集合体に総当たりしたい場合は、サンプルコードを使用して記事を作成しました。

/**
 * Implements hook_js_alter().
 */
function mymodule_js_alter(&$javascript) {
  uasort($javascript, 'drupal_sort_css_js');
  $i = 0;
  foreach ($javascript as $name => $script) {
    $javascript[$name]['weight'] = $i++;
    $javascript[$name]['group'] = JS_DEFAULT;
    $javascript[$name]['every_page'] = FALSE;
  }
}

/**
 * Implements hook_css_alter().
 */
function mymodule_css_alter(&$css) {
  uasort($css, 'drupal_sort_css_js');
  $i = 0;
  foreach ($css as $name => $style) {
    $css[$name]['weight'] = $i++;
    $css[$name]['group'] = CSS_DEFAULT;
    $css[$name]['every_page'] = FALSE;
  }
}

Drupal.orgの問題#1034208でも、厳密な注文要件を少し緩和することを提案しています。


巨大な集合体は正しい振る舞いを生み出すようには見えませんでした。それは確かにページに対して1つの大きなCSS / JSファイルを作成しますが、このファイルはあなたがいるページに応じて変化します。これは明らかに理想的ではありません。
wiifm

正確に言えば、各ページが異なるJSファイルをロードする場合、集約は必然的に異なります。Drupal 7がファイルを機能グループ(JS_LIBRARY、JS_DEFAULT、JS_THEME)に分割する理由を再発見しました。複雑なサイトでは、これは多くの場合、1つの巨大なファイルより効率的です。
ディランタック

1
3つのグループがある場合、どのようにして5つのファイルをヘッドにロードできますか?3を超えないようにしてください。すべてを1つのファイルにバンドルすることは恐ろしい考えですが、JSファイルを最小限に保つ方法は?
Rudie

ここで言及したコードを試しました。実際には、2つの圧縮jsファイルが作成されています。どうすれば1つのjsファイルにすることができますか?
ARUN、2014

@DylanTack私のウェブサイトの一つは、ロードCSSのfiels [に問題があるdrupal.stackexchange.com/questions/128649/...とウェブサイトのアドレス[ living.md/]私はあなたのコードを入れてさまよったが、私は一緒にあなたのコードを使用することができますadvaggモジュール?

3

AdvAgg D7は開発中です。その他のオプション(含まれている引用はプロジェクトページからのものです):

... uglify.jsを使用して、サイトのJavaScriptをその場で縮小できます。モジュールはデフォルトでWebサービス(uglify.me)に依存して縮小を実行するため、縮小JavaScriptのメリットを享受するためにサーバーで前処理を行う必要はありません。

...サイトのフロントエンドパフォーマンスを高速化するように設計されています。Speedyモジュールのこの最初のリリースでは、まだ縮小されていないコアJavaScriptファイルの縮小バージョンを提供します。たとえば、drupal.jsの縮小版は提供されますが、jquery.js(すでに縮小版)は提供されていません。


AdvAgg 7.xが最初のRCになりました。drupal.org/project/advagg使用することをお勧めします
mikeytown2 2013
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.