CSS and Javascript now being aggregated and compressed

The Drupal system has a lot of CSS and Javascript files. Each module typically has one or more of each, so Webform has a couple, Book has a couple, etc.  In addition there is UNL theme CSS and the CSS and Javascript you add under the toolbar's Appearance link.

Aggregating (combining multiple files into one) and compressing (removing extra whitespace) makes the total payload smaller and means fewer files have to be transfered from the server to the user when a page is loaded.

What does this look like? For CSS, instead of this in the source:

<style type="text/css" media="all">@import url("http://parking.unl.edu/modules/system/system.base.css?mgdrov");
@import url("http://parking.unl.edu/modules/system/system.menus.css?mgdrov");
@import url("http://parking.unl.edu/modules/system/system.messages.css?mgdrov");
@import url("http://parking.unl.edu/modules/system/system.theme.css?mgdrov");
@import url("http://parking.unl.edu/modules/search/search.css?mgdrov");
@import url("http://parking.unl.edu/modules/user/user.css?mgdrov");
@import url("http://parking.unl.edu/sites/all/modules/date/date_popup/themes/datepicker.1.7.css?mgdrov");
@import url("http://parking.unl.edu/modules/field/theme/field.css?mgdrov");
@import url("http://parking.unl.edu/modules/node/node.css?mgdrov");
@import url("http://parking.unl.edu/sites/all/modules/views/css/views.css?mgdrov");
@import url("http://parking.unl.edu/sites/all/themes/unl_wdn/style.css?mgdrov");</style>

There is now this:

<link type="text/css" rel="stylesheet" href="http://parking.unl.edu/css/css_pbm0lsQQJ7A7WCCIMgxLho6mI_kBNgznNUWmTWcnfoE.css" media="all" />