Optimizing Drupal7 CSS and JS

Even though Drupal (since long ago) supports merging CSS and JS into one file each, after I upgraded from v6 to v7, I still ended up getting more than one of each. It turns out, Drupal has some notion of groups, and it would only merge the CSS / JS elements within each group. I did some web searches, and came up with the following:

function pixture_reloaded_js_alter(&$js) {
  if (arg(0) === 'admin' || strpos($_GET['q'], 'search/google') === 0) {
    return;
  }

  uasort($js, 'drupal_sort_css_js');
  $weight = 0;

  foreach ($js as $name => $javascript) {
    $js[$name]['group'] = -100;
    $js[$name]['weight'] = ++$weight;
    $js[$name]['every_page'] = 1;
    $js[$name]['scope'] = 'footer';
  }
}


function pixture_reloaded_css_alter(&$css) {
  uasort($css, 'drupal_sort_css_js');

  $print = array();
  $weight = 0;
  foreach ($css as $name => $style) {
    $css[$name]['group'] = 0;
    $css[$name]['weight'] = ++$weight;
    $css[$name]['every_page'] = TRUE;

    if ($css[$name]['media'] == 'print') {
      $print[$name] = $css[$name];
      unset($css[$name]);
    }
  }

  $css = array_merge($css, $print);
}

This goes into the Theme's template.php file, in my case I use the Pixture Reloaded theme. I don't know much about Drupal nor PHP, so I don't know what this might break. But this accomplishes three things:

  1. Merge all CSS into one single CSS.
  2. Merge all JS into one single JS.
  3. Move the JS to the "footer" of the page (this is important for improved page rendering, but could potentially break some sites I'd imagine).

Hacking: