eZ Community » Projects » CssInlineImageOptimizer

CssInlineImageOptimizer

Extension to eZ Publish that provides a CSS optimizer for ezjscore that inlines small images as Data URLs in the packed CSS source to minimize number of HTTP requests.

» Visit project page    » Project members    » Reviews

Latest forum activity - Visit project's forums page

Tuesday 31 January 2012 9:35:04 pm

Hi Johan,

Great idea, and I look forward to trying it out. I think it would be helpful to post some extra info about the outcome of this extension (ie, reduce filesize/bandwith) or links to extra info about Data URLs, for those who don't know what this extension does.

One caveat with Data URLs seems to be that you only get the savings on filesize if you use gzip/deflate the CSS+ImageData on the server. I see that you can set the max filesize in settings file - what savings have you experienced? Would be good to put this sort of info in the main documentation too!

Cheers,

Geoff

Friday 09 March 2012 5:35:05 pm

There is no decrease in net data volume since base64-encoding only uses 6 bits per character. But the big save is in round-trip time due to fewer number of HTTP-requests. If you count the overhead in headers for each HTTP-request you also save some bytes of data there.

Off course the resulting combined CSS-file is slightly larger but it compresses well and can be cached.

On the website I'm building now we almost halved the number of HTTP-request from ~ 56 to 30 since a lot of the images were small icons less than 2 kB in size.

Your one-stop HTML5 spot for all things Data URL: http://dataurl.net/

 

Members - Visit project's team page
Real name:
Johan Beronius
Country:
Sweden 
#Posts:
2
Project reviews - See all reviews

Saturday 24 March 2012 10:35:06 pm

It's a very good idea and an easy way to improve front end performance of your site (provided you don't target IE6 or IE7...).