Beating YSlow Roland van Ipenburg <ipenburg@cpan.org> Dutch Perl Workshop, Zaterdag 14 April 2012

YSlow

YSlow

YSlow

YSlow

YSlow Gratis browser plug-in Makkelijk Ziet er leuk uit

YSlow Gratis Makkelijk Ziet er leuk uit Managers die er verder weinig vanaf weten zien daar toch graag overal

YSlow Gratis Makkelijk Ziet er leuk uit Managers die er verder weinig vanaf weten zien daar toch graag overal Ik ook

Maar… TIMTOWTDI traag TIMTOWTDI snel

Maar…

Focus Compressie Minder HTTP requests Caching

Build script Comprimeert PNG Comprimeert JavaScript Comprimeert Cascading Style Sheets Maakt minder HTTP requests Optimaliseert voor caching

Compressie App::PNGCrush? sub build_png { my ( $from, $to ) = @_; $to =~ s{(.*)/.*}{$1}gis; my @PNGCRUSH = ( q{pngcrush}, q{-d}, $to, q{-brute} ); system( @PNGCRUSH, $from ); return; }

Compressie JavaScript::Minifier::XS? Readonly::Scalar my $YUICOMP => q{java -jar %s -o}; my @yuicomp = split $SPACE, ( sprintf $YUICOMP, $opts{yuicomp} ); sub build_js { my ( $from, $to ) = @_; system( @yuicomp, $to, $from ); return; }

Compressie CSS::Minifier? Readonly::Scalar my $YUICOMP => q{java -jar %s -o}; my @yuicomp = split $SPACE, ( sprintf $YUICOMP, $opts{yuicomp} ); sub build_css { my ( $from, $to ) = @_; system( @yuicomp, $to, $from ); version_assets($to); return; }

system()

system() Zelfde uitvoer als niet Perl oplossing Geen extra dependency Snelst Making Easy Things Easy & Hard Things Possible

Hard things Maakt minder HTTP requests Optimaliseert voor caching

Minder HTTP requests Inline data background-image: url("data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAMAAAAFCAYAAAH3dmY0AAAAGXR FWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAB5JRE FUCFtj+P//vyADmEAFQCElOOsunFUOxKEYHABp9Rqiaw+C6gAAA ABJRU5ErkJggg==");

Inline data MIME::Base64 $image_data = q{data:} . $MAP{$extension} . q{;base64,} . MIME::Base64::encode_base64( $image_data, $EMPTY );

Caching Expire nooit Dus verander de bestandnaam als het bestand wijzigt

Fingerprint bestand MIME::Base64::URLSafe Digest::MD5 my $fingerprint = substr( MIME::Base64::URLSafe::urlsafe_b64encode( Digest::MD5::md5_hex($external_data) ), 0, $FINGERPRINT_LENGTH ); my $new_url = $base . $FINGERPRINT_SEPERATOR . $fingerprint . $ext;

CDN Content Delivery Network

CDN

CDN Content Delivery Network $new_url = $opts{cdn} . ($dir ne ($DOT . $SLASH) ? File::Spec->catfile( $dir, $new_url ) : $new_url );

Perl & CPAN Archive::Zip Getopt::ArgvFile Log::Log4perl DBD::SQLite WebService::Validator::HTML::W3C WebService::Validator::CSS::W3C Image::Compare

Vragen? @ipenburg Werkt bij puurpxl.nl