Contact Me


Recent Posts


Categories


Archives


Tags

3d actionscript Actionscript 2 Actionscript 3 api APIs as2 as3 brand caching carousel channel code compress contest contract CSS Flash flv fp10 free freelance gadget gadgets gdata google JavaScript jquery mvc papervision papervision3d PHP player playlist puremvc pv3d search tube tutorial twitter video widget XML you youtube

Recent Comments

  • Ahmed: Can you put up an example?
  • Ahmed: Hmmm sorry this is a tough one but I don’t work with ASP.NET! Sorry!
  • Michael: Good example but one question… in all the slider skinning I see with Flex the thumb overruns the left...
  • venkata: Hi I am using OAuth to connect to youtube api. I got accessToken and TokenSecret for a particular user. Now...
  • Ahmed: Good old flexlib, what component are you using?

Links


Help end world hunger

Compressing and Caching Static Text-based Assets with PHP

So recently I’ve been playing around with GZIP compression on Apache and PHP to see how fast I can get my assets to load. Now I’ve written a post already on how to compress sites with GZIP.

Now I’ve taken my script to a new level, that is the asset loader script that compresses text-based assets using GZIP. I’m not using any sort of code compressor on the assets, yet, as I’ve already compressed the scripts using YUI. More importantly, I’ve now added the ability for me to cache a number of files into one rather than loading several, as we all know: less HTTP request = more fun.

So the concept is quite simple: pass a list of files, separated by a comma, to the script and it will then combine the files, compress with GZIP and cache the file for future use.

Before I had something like this:

1
2
3
4
5
6
<script type="text/javascript" src="/assets/js/jquery.js"></script>
<script type="text/javascript" src="/assets/js/jquery-easing.js"></script>
<script type="text/javascript" src="/assets/js/jquery-flash.js"></script>
<script type="text/javascript" src="/assets/js/jquery-scrollTo.js"></script>
<script type="text/javascript" src="/assets/js/jquery-ui.js"></script>
<script type="text/javascript" src="/assets/js/suitcase.js"></script>

So you see that we’re loading files separately, they are already compressed and the GZIP’ed, but we’re not caching them, so there’s always some latency, so with the new script I do this:

1
<script type="text/javascript" src="/gzip-service.php?f=assets/js/jquery.js,assets/js/jquery-easing.js,assets/js/jquery-flash.js,assets/js/jquery-scrollTo.js,assets/js/jquery-ui.js,assets/js/suitcase.js"></script>

Now for the PHP script:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<?php
/**
 * @author          Ahmed Nuaman (http://www.ahmednuaman.com)
 * @langversion     5
 *
 * This work is licenced under the Creative Commons Attribution-Share Alike 2.0 UK: England & Wales License.
 * To view a copy of this licence, visit http://creativecommons.org/licenses/by-sa/2.0/uk/ or send a letter
 * to Creative Commons, 171 Second Street, Suite 300, San Francisco, California 94105, USA.
*/


if ( substr_count( $_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip' ) )
{
    ob_start( 'ob_gzhandler' );
}
else
{
    ob_start();
}

$dir            = '/path/to/public_html/';
$test_file      = $dir . 'cache/' . md5( $_GET['f'] );
$files          = explode( ',', $_GET['f'] );

if ( strstr( $files[ 0 ], '.js' ) )
{
    $content_type = 'javascript';
}
elseif ( strstr( $files[ 0 ], '.css' ) )
{
    $content_type = 'css';
}
elseif ( strstr( $files[ 0 ], '.xml' ) )
{
    $content_type = 'xml';
}

header( 'Content-type: text/' . $content_type );

if ( !file_exists( $test_file ) )
{
    foreach ( $files as $file )
    {
        $feeds .= file_get_contents( $dir . $file );
    }
   
    file_put_contents( $test_file, $feeds );
}

echo file_get_contents( $test_file );

?>

So it’s a pretty simple script to dissect. The only thing you need to worry about is changing the “$dir” and “$test_file” to specify what the base directory is (so people don’t steal your GZIP’ing service) and where you want the files to be cached.

Tell me what you think.


Leave a Reply

Your comment:

Allowed tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>
Fork me on GitHub