drupal remove unused css

i'm using drupal 6 .Is there any way to remove 开发者_运维技巧unused css (eg. from system.css) from a page before loading. Unused css degrades my site's performance by increasing loading time.

You would spend more time parsing CSS than you would just loading the file to begin with. You would lose any benefit of the CSS being cached since each page would have a different resulting CSS file. You would be better off simply optimizing and compressing your CSS than trying to parse through it on every page load.

For D7 you can use hook_css_alter

From http://drupalcode.org/project/tao.git/blob/HEAD:/template.php

 <?php
 /**
* Implements hook_css_alter().
* @TODO: Once http://drupal.org/node/901062 is resolved, determine whether
* this can be implemented in the .info file instead.
*
* Omitted:
* - color.css
 * - contextual.css
 * - dashboard.css
 * - field_ui.css
 * - image.css
 * - locale.css
 * - shortcut.css
 * - simpletest.css
 * - toolbar.css
 */
 function tao_css_alter(&$css) {
 $exclude = array(
 'misc/vertical-tabs.css' => FALSE,
 'modules/aggregator/aggregator.css' => FALSE,
 'modules/block/block.css' => FALSE,
 'modules/book/book.css' => FALSE,
 'modules/comment/comment.css' => FALSE,
 'modules/dblog/dblog.css' => FALSE,
 'modules/file/file.css' => FALSE,
 'modules/filter/filter.css' => FALSE,
 'modules/forum/forum.css' => FALSE,
 'modules/help/help.css' => FALSE,
 'modules/menu/menu.css' => FALSE,
 'modules/node/node.css' => FALSE,
 'modules/openid/openid.css' => FALSE,
 'modules/poll/poll.css' => FALSE,
 'modules/profile/profile.css' => FALSE,
 'modules/search/search.css' => FALSE,
 'modules/statistics/statistics.css' => FALSE,
 'modules/syslog/syslog.css' => FALSE,
 'modules/system/admin.css' => FALSE,
 'modules/system/maintenance.css' => FALSE,
 'modules/system/system.css' => FALSE,
 'modules/system/system.admin.css' => FALSE,
 'modules/system/system.base.css' => FALSE,
 'modules/system/system.maintenance.css' => FALSE,
 'modules/system/system.menus.css' => FALSE,
 'modules/system/system.theme.css' => FALSE,
 'modules/taxonomy/taxonomy.css' => FALSE,
 'modules/tracker/tracker.css' => FALSE,
 'modules/update/update.css' => FALSE,
 'modules/user/user.css' => FALSE,
 );
 $css = array_diff_key($css, $exclude);
 }

You can also overwrite in theme .info for D6 and now D7 https://drupal.org/node/901062 .

Some theme had developed some helper using .info with and cssexclude key and the hook_css_alter

 <?php
 function twitter_bootstrap_css_alter(&$css) {
//global $theme_key;
//$theme_path = drupal_get_path('theme', $theme_key);

$excludes = _twitter_bootstrap_alter(twitter_bootstrap_theme_get_info('exclude'), 'css');
$css = array_diff_key($css, $excludes);
}

function twitter_bootstrap_js_alter(&$js) {
$excludes = _twitter_bootstrap_alter(twitter_bootstrap_theme_get_info('exclude'), 'js');
$js = array_diff_key($js, $excludes);
 }

 function _twitter_bootstrap_alter($files, $type) {
 $output = array();

 foreach($files as $key => $value) {
 if(isset($files[$key][$type])) {
 foreach($files[$key][$type] as $file => $name) {
 $output[$name] = FALSE;
 }
 }
 }
 return $output;
 }

The performance impact is low because hook_css_atler is not run often.

If you are familiar with node js you can also use "find unused css": https://www.npmjs.com/package/find-unused-css

It only supports html files and find out unused css in your project.

If you mean that the css is unused because the rules are never applied on any page or that you override them in your theme then one solution is to exclude the offending stylesheet altogether and implement the rules that you do want in your theme instead.

There are a few ways to do this, including the style stripper module (which I haven't tried), by unsetting variables in template.php or simplest by copying the system.css file to your theme (and remembering to add to theme.info) and then trimming away to your heart's content.

Additionally if there there are some rarely accessed categories of pages on your site that have rules which are not used elsewhere (e.g. admin pages) you could consider putting these rules in a separate file and conditionally including them from your theme.

You can also enable css file optimization, take a look at "Administer › Site configuration > Performance". This will reduce both the size and number of requests made to your website since it will aggregate and compress your css files into a single file.