-->
Page 1 of 1

CSS Optimizer (handy tool for embedded web programming)

PostPosted: Wed Sep 13, 2017 8:30 am
by treii28
Handy tool for embedded device programming. You can tell it to include your icon images right in the css as data urls to reduce the number of necessary requests on devices like the ESP8266 running the Async WebServer code (which limits at 5 open connections at a time)
In otherwords, if you have a single css file being used by a web page that references any more than 6 images to be used in your content, anything after the 6th may not properly load (unless you embed some kind of limited asset loader in your javascript to make sure no more than 5 requests are open at any one time. Presumably, the browser won't start processing the css until at least the page using it and the css containing the images are both fully loaded and complete. Of course, the browser may still be requesting other CSS, javascript or images at the same time also, further limiting the number of things that can be downloaded simultaneously when the limit is 5 total. This way, anything referenced by the css will be included with just 1 request. Similar mechanisms can be employed in HTML also, but would be self-defeating as you couldn't re-use those assets elsewhere, where with css you can just by loading the one css file.)
http://dataurl.net/#cssoptimizer