php - Which will load faster in the browser: including images in HTML as DataURLs, or using the normal img tag with src url? -
we're generating our pages in php , want make generated pages load possible in browser. when generating pages (which .html
pages) realized have 2 options:
page data url images
<html> <head></head> <body> <img src="data:image/png;base64,blahblahblah1" /> <img src="data:image/png;base64,blahblahblah2" /> <img src="data:image/png;base64,blahblahblah3" /> </body> </html>
page "normal" images
<html> <head></head> <body> <img src="/images/image1.png" /> <img src="/images/image2.png" /> <img src="/images/image3.png" /> </body> </html>
there pros/cons of dataurl:
pros:
fewer trips browser server (there 1 trip) - given generated nature, , needing maintain , css, using sprites not work on project
less bandwidth usage on smaller images
much faster in https
cons:
image sizes larger due base64 encoding (about 37% larger)
doesn't work in ie7 , in ie8, there's limit on size of 32kb
will "one-trip" make big difference? noticeable user?
Comments
Post a Comment