Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

proxy.php - for CSS compression/ combining - to improve performance
 
srinigenie
Guru
 
Avatar
Total Posts:  539
Joined:  2008-02-04
 

Hi all,

On the Magento home page, the number of CSS file requests are many and in order to use the flexibility of proxy.php to cater to CSS files so that all CSS files would be clubbed as one file and be sent to the browser. This will save the time and minimize the http requests.

1. Copied js/proxy.php into skin/frontend/default/default folder

2. Change the proxy.php in the new folder for enabling CSS

if ($contentType===true{
        $contentTypes 
= array(
            
'js' => 'text/javascript',
            
'css' => 'text/css',
//            'gif' => 'image/gif',
//            'png' => 'image/png',
//            'jpg' => 'image/jpeg',
        
);

3. On the file Mage/Page/Block/Html/Head.php, ensure that all CSS files are chunked and directed through the new proxy.php file. Modified the function getCssJsHtml() in the below manner to ensure this happens:

public function getCssJsHtml()
    
{
        $lines 
= array();
        
$baseJs Mage::getBaseUrl('js');
        
$html '';

        
$script '<script type="text/javascript" src="%s" %s></script>';
        
$stylesheet '<link type="text/css" rel="stylesheet" href="%s" %s></link>';
        
$alternate '<link rel="alternate" type="%s" href="%s" %s></link>';

        foreach (
$this->_data['items'as $item{
            
if (!is_null($item['cond']) && !$this->getData($item['cond'])) {
                
continue;
            
}
            $if 
= !empty($item['if']) ? $item['if''';
            switch (
$item['type']{
                
case 'js':
                    
#$lines[$if]['other'][] = sprintf($script, $baseJs.$item['name'], $item['params']);
                    
$lines[$if]['script'][] $item['name'];
                    break;

                case 
'js_css':
                    
//proxying css will require real-time prepending path to all image urls, should we do it?
                    
$lines[$if]['other'][] sprintf($stylesheet$baseJs.$item['name']$item['params']);
                    
#$lines[$if]['stylesheet'][] = $item['name'];
                    
break;

                case 
'skin_js':
                    
$lines[$if]['other'][] sprintf($script$this->getSkinUrl($item['name']), $item['params']);
                    break;

                case 
'skin_css':
//                  $lines[$if]['other'][] = sprintf($stylesheet, $this->getSkinUrl($item['name']), $item['params']);
        
$lines[$if]['skin_css'][] $item['name'];        
                    break;

                case 
'rss':
                    
$lines[$if]['other'][] sprintf($alternate'application/rss+xml'/*'text/xml' for IE?*/$item['name']$item['params']);
                    break;
            
}
        }

        
foreach ($lines as $if=>$items{
            
if (!empty($if)) {
                $html 
.= '<!--[if '.$if.']>'."\n";
            
}
            
if (!empty($items['script'])) {
                
foreach ($this->getChunkedItems($items['script']$baseJs.'proxy.php?c=auto&amp;f=') as $item{
                    $html 
.= sprintf($script$item'')."\n";
                
}
//                foreach (array_chunk($items['script'], 15) as $chunk) {
//                    $html .= sprintf($script, $baseJs.'proxy.php/x.js?f='.join(',',$chunk), '')."\n";
//                }
            
}
            
if (!empty($items['stylesheet'])) {
                
foreach ($this->getChunkedItems($items['stylesheet']$baseJs.'proxy.php?c=auto&amp;f=') as $item{
                    $html 
.= sprintf($stylesheet$item'')."\n";
                
}
//                foreach (array_chunk($items['stylesheet'], 15) as $chunk) {
//                    $html .= sprintf($stylesheet, $baseJs.'proxy.php/x.css?f='.join(',',$chunk), '')."\n";
//                }
            
}
            
if (!empty($items['skin_css'])) {
                $items[
'skin_css'str_replace ("css/","",$items['skin_css']);
                foreach (
$this->getChunkedItems($items['skin_css']$this->getSkinURL().'css/proxy.php?c=auto&amp;f=') as $item{          
                  $html 
.= sprintf($stylesheet$item'')."\n";
                
}
//                foreach (array_chunk($items['stylesheet'], 15) as $chunk) {
//                    $html .= sprintf($stylesheet, $baseJs.'proxy.php/x.css?f='.join(',',$chunk), '')."\n";
//                }
            
}            
            
if (!empty($items['other'])) {
                $html 
.= join("\n"$items['other'])."\n";
            
}
            
if (!empty($if)) {
                $html 
.= '<![endif]-->'."\n";
            
}
        }

        
return $html;
    
}

4. On doing this I was delighted to find that the CSS files were being requested through the new proxy.php. However, to my disappointment, all the page alignment went haywire. I saved the webpage and checked the proxy.css file that gets saved alongwith. Here I don’t observe anything fishy and all the CSS format appears to be present intact in one file.

WIsh if someone can point to me where I am going wrong!!

Thanks in advance!!

 
Magento Community Magento Community
Magento Community
Magento Community
 
srinigenie
Guru
 
Avatar
Total Posts:  539
Joined:  2008-02-04
 

Finally figured this out!! The problem was due to print.css file. Removed this from page.xml as I didnt find it being used particularly anywhere --

app\design\frontend\neoInterface\default\layout\page.xml

<!--            <action method="addCss"><stylesheet>css/print.css</stylesheet><params>media="print"</params></action> -->
 
Magento Community Magento Community
Magento Community
Magento Community
 
srinigenie
Guru
 
Avatar
Total Posts:  539
Joined:  2008-02-04
 

And some more steps that I had done to get this working - forgot to document that here earlier -

copy the proxy.php from the base js folder and uncomment one line to ensure CSS content type is enabled-

if ($contentType===true{
        $contentTypes 
= array(
            
'js' => 'text/javascript',
            
'css' => 'text/css',

Place this new proxy.php in two places
skin\frontend\default\default\css
skin\adminhtml\default\default

Refresh cache in admin and check the pages now!!!

 
Magento Community Magento Community
Magento Community
Magento Community
 
srinigenie
Guru
 
Avatar
Total Posts:  539
Joined:  2008-02-04
 

edited the code and updated the post with the new code - as skin images were not loading with old code ...

 
Magento Community Magento Community
Magento Community
Magento Community
 
Moshe
Magento Team
 
Avatar
Total Posts:  1770
Joined:  2007-08-07
Los Angeles
 

@srinigenie: make sure you are not using theme file fallback to default theme for your stylesheet files, to avoid missing stylesheets.

 
Magento Community Magento Community
Magento Community
Magento Community
 
srinigenie
Guru
 
Avatar
Total Posts:  539
Joined:  2008-02-04
 

Moshe ...that was a bouncer to me :( ....I have copied over the stylesheets as well to my new theme .... and it seems to be working now ... is there anything else to be done? as such for the first few pages, it looks ok .. and have removed print.css as I didnt think it was being used anywhere ...

 
Magento Community Magento Community
Magento Community
Magento Community
 
lisali
Enthusiast
 
Avatar
Total Posts:  889
Joined:  2008-04-28
London, UK
 

Hi sirigenie,

This looks like somethong I am looking for...but not sure what exactly to do, could you help?

I also thought that Magento automatically rolls all css and js, respectively, into one, but Yslow reports many different files.

Thanks!

 
Magento Community Magento Community
Magento Community
Magento Community
 
vsnetfreak
Member
 
Avatar
Total Posts:  32
Joined:  2009-12-17
Bhilai, Chhattisgarh
 

Hi,

My admin is not working.

I got that fixed by moving the css & other files in folders but that stops a few admin features from working like images upload for products.

Please advice.

 
Magento Community Magento Community
Magento Community
Magento Community
 
vsnetfreak
Member
 
Avatar
Total Posts:  32
Joined:  2009-12-17
Bhilai, Chhattisgarh
 

I figured out that my css path is wrong.

<link type="text/css" rel="stylesheet" href="http://demo.domainname.com/skin/adminhtml/default/default/css/proxy.php?c=auto&f=,reset.css,boxes.css,menu.css" ></link>

it must be <link type="text/css" rel="stylesheet" href="http://demo.stormkimonos.com/skin/adminhtml/default/default/proxy.php?c=auto&f=,reset.css,boxes.css,menu.css" ></link>

How I can update that ? Sorry but I have no knowledge of magento and php.

 
Magento Community Magento Community
Magento Community
Magento Community
 
vsnetfreak
Member
 
Avatar
Total Posts:  32
Joined:  2009-12-17
Bhilai, Chhattisgarh
 

Please help, need solution badly…

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top