Zend Framework - Combine yout CSS in one file

Monday, May 17, 2010 | 0 comments
zendframework css php

As each day require more complex designs css files, if we optimize the normal application is to divide these files and load only what is needed, but this practice is penalized with increments's HTTP requests.

Ideally, CSS will divide into as many files as you need to optimize, but have a system that once loaded.


With Zend Framework and inform the css helpers we want and discover our exclusive special html code generates all together and orderly, saw this and works to integrate with Minify as ICS Design, I decide to upgrade a previous code I had.

I think, Minify is too heavy for what little we need, my idea is to unite all the css needed in a single file, save it in cache and go use it, as the number of combinations that use our programs is finite, once generated the file, and you need not regenerate, unless it forces. Compress the files I see a fool, and that such work can do better Apache module and Deflate.

<IfModule mod_deflate.c>
    SetOutputFilter DEFLATE
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE application/x-javascript
 </IfModule>

Partiendo como base del código de CS Desing:

 <?php
  class Valclip_View_Helper_MinStyleSheets extends Zend_View_Helper_HeadLink {
      public function minStyleSheets() {
          $items = array();
          $stylesheets = array();
          foreach ($this as $item) {
              if ($item->type == 'text/css' && $item->conditionalStylesheet === false) {
                  $stylesheets[$item->media][] = $item->href;
              } else {
                  $items[] = $this->itemToString($item);
              }
          }
          foreach ($stylesheets as $media=>$styles) {
              $item = new stdClass();
              $item->rel = 'stylesheet';
              $item->type = 'text/css';
              $newname = 'css_' . md5('vcss'  . implode(',', $styles) ) . '.css';
              $this->process($styles, $newname);
              $item->href = $this->getMinUrl() . '/' . $newname;
              $item->media = $media;
              $item->conditionalStylesheet = false;
              $items[] = $this->itemToString($item);
          }
          return  implode($this->_escape($this->getSeparator()), $items);
      }
      
      protected function process($files, $name) 
      {
          $cacheFile = BASE_PATH . $this->getMinUrl() . '/' . $name;
          if (file_exists($cacheFile )) {
              return;
          }
          $cache='';
          foreach ($files as $v) {
              $cache .= file_get_contents(BASE_PATH . $v ) .  "&gt;PHP_EOL;
          }
      
          $fp = @fopen($cacheFile, "wb");
          if ($fp) {
              fwrite($fp, $cache);
              fclose($fp);
          }
      }
      
      public function getMinUrl() {
          return '/public/tmp/cache';
      }
      
      
      
  }


Only you have to play the getMinUrl method (), since it is particular to my system and instead of:


and change:

  <?php echo $this->headLink(); ?>


with this other

  <?php echo $this->MinStyleSheets(); ?>


I think it easy deployment and does its job, one thing you can not use the @import clausule in CSS files. And the JavaScript in the next article.

Bookmark this article at these sites

Comments on this article

No comments for this article.

Leave us a comment

Feel free to write whatever you want that is related to the article.

Just to show avatar from gravatar.com

Copyright (c) 2012 Valclip Version 1.0.23dev


valclip   +34 677 62.74.00