开发者

What is the best way to serve small static images?

Right now I'm base 64 encoding them and using data uris. The idea was that this will somehow lower the number of requests the browser needs to make. Does this bucket hold any water?

What is the best way of serving images in general? DB, from FS, S3?

I am most interested in python and java based answers, bu开发者_如何学运维t all are welcome!


I would definitely take a look at CSS Image Sprites, decent write-ups here and here.

The concept is pretty simple, combine your images into one, show only the slice you need as a CSS background. This lets you lower the number of HTTP requests from many images into one or more (group your small images in sprite maps as appropriate) and have fewer images to maintain, the CSS just has some background coordinates in there.

Also, as with any static resource, make sure your cache headers are set correctly, so the client isn't fetching it needlessly.


Nicholas C. Zakas has written a tool that makes it easier to use data URIs in css, and also contains an IE6/7 compatible fix:

CSSEmbed also supports an MHTML mode to make IE6 and IE7 compatible stylesheets that use internal images similar to data URIs.


Right now I'm base 64 encoding them and using data uris. The idea was that this will somehow lower the number of requests the browser needs to make. Does this bucket hold any water?

This is most definitely a bad idea: It won't work in IE < 8; it increases the data volume served by 33%; and it makes the images completely uncacheable.

I'd say you should serve images as proper image resources - whether as separate files, or maybe as CSS sprites as @Nick suggests, will depend on their quantity and size.


Data urls will definitely reduce the number of requests to the server, since the browser doesn't have to ask for the pixels in a separate request. But they are not supported in all browsers. You'll have to make the tradeoff.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜