20MB to fetch in one go is too much, it will result in a slow and annoying user experience. You should probably ajax-load each image in turn.
Incidently, how big are your images? An 800 x 600 jpeg should be around 50k at 90 - 95% quality. So 20 MB would be 400 images. This seems like a lot for one page. I'm guessing your image sizes are large - consider reducing them. If you want to have hi-res, non-compressed versions available, have these individually linked.
Edit: Just for reference, what I would consider a very large page (the html doc + all css, js and image assets) would be ~ 1MB. An "average" sized page is probably ~ 100k.
Why not "thumbnailing" images via some server side script, preload thumbnails & display full image on thumbnail click (using some kind of lightbox js) This would reduce a lot preloading time while keeping full porfolio preview.
Yeah, definitely don't do this. Rememebr that some users will be connecting with mobile connections and some of them paying by the megabyte - if you do this then you've just used up 20 MB of their allowance with images that they may never see.
20MB is probably too much unless it is a specialized application where you are confident that 1) users will wait and 2) that they will view the majority of those images. Otherwise, you are wasting bandwidth.
I would look at a strategy where your images are cached in server memory to avoid database traffic combined with client-side pre-caching of a few images where you can add it. For example, if the user is on image "A", load "B" and "C" as well.
发布评论
评论(6)
一次性获取 20MB 太多了,这会导致缓慢且烦人的用户体验。您可能应该依次使用 ajax 加载每个图像。
顺便问一下,你的图片有多大? 800 x 600 jpeg 在 90 - 95% 质量下应约为 50k。因此 20 MB 相当于 400 张图像。这对于一页来说似乎很多。我猜你的图像尺寸很大 - 考虑减小它们。如果您想要提供高分辨率的非压缩版本,请单独链接这些版本。
编辑:仅供参考,我认为一个非常大的页面(html 文档 + 所有 css、js 和图像资源)约为 1MB。 “平均”大小的页面可能约为 100k。
20MB to fetch in one go is too much, it will result in a slow and annoying user experience. You should probably ajax-load each image in turn.
Incidently, how big are your images? An 800 x 600 jpeg should be around 50k at 90 - 95% quality. So 20 MB would be 400 images. This seems like a lot for one page. I'm guessing your image sizes are large - consider reducing them. If you want to have hi-res, non-compressed versions available, have these individually linked.
Edit: Just for reference, what I would consider a very large page (the html doc + all css, js and image assets) would be ~ 1MB. An "average" sized page is probably ~ 100k.
为什么不通过某些服务器端脚本“缩略图”图像,预加载缩略图和缩略图?在缩略图点击上显示完整图像(使用某种灯箱js)
这将减少大量预加载时间,同时保持完整的作品集预览。
Why not "thumbnailing" images via some server side script, preload thumbnails & display full image on thumbnail click (using some kind of lightbox js)
This would reduce a lot preloading time while keeping full porfolio preview.
我认为更好的方法是在查看当前照片时预加载接下来的几张照片
I think the better way is to preload the next couple of photos while you are viewing the current one
是的,绝对不要这样做。请记住,有些用户将通过移动连接进行连接,而有些用户则按兆字节付费 - 如果您这样做,那么您就用完了他们可能永远不会看到的图像的 20 MB 配额。
Yeah, definitely don't do this. Rememebr that some users will be connecting with mobile connections and some of them paying by the megabyte - if you do this then you've just used up 20 MB of their allowance with images that they may never see.
我认为这两种解决方案都不实用 - 我建议您缩小图像。
I don't think either solution is practical - I would suggest you scale down your images.
20MB 可能太多了,除非它是一个专门的应用程序,您确信 1) 用户会等待,2) 他们会查看其中的大部分图像。否则,您就是在浪费带宽。
我会考虑一种策略,将图像缓存在服务器内存中,以避免数据库流量,并结合客户端预缓存一些图像(您可以在其中添加图像)。例如,如果用户位于图像“A”上,则也加载“B”和“C”。
20MB is probably too much unless it is a specialized application where you are confident that 1) users will wait and 2) that they will view the majority of those images. Otherwise, you are wasting bandwidth.
I would look at a strategy where your images are cached in server memory to avoid database traffic combined with client-side pre-caching of a few images where you can add it. For example, if the user is on image "A", load "B" and "C" as well.