【问题标题】:Optimal delivery method for a large quantity of images大量图像的最佳交付方法
【发布时间】:2010-10-25 01:00:38
【问题描述】:

我有一个以在线聊天应用程序为中心的网站,每个用户最多可以有数百个联系人。每个联系人都有自己的个人资料图像。我想这样做,以便在名称旁边加载联系人的个人资料图像。然而,让用户每次加载网站时下载 100 多张图片似乎很费力(研究表明,多达 40% 的用户不使用缓存)。每个图像的尺寸约为 60x60 像素。

当我在 google 上搜索或登录 facebook 时,几乎是瞬间提供了数十张图片。除了拥有快速的服务器和良好的连接之外,向用户提供如此多图像的最佳方法是什么?

我想出的可能方法是:

  • 将每个用户的个人资料图像存储在数据库中,在 php 文件中构建一个图像,而不是让用户下载该图像,然后使用 css 显示每个个人资料图像。但是,这在服务器上似乎非常密集,并且多次引用如此大的文件可能会对用户的浏览器造成影响。
  • 使用 nginx 而不是 apache 来提供图像服务(nginx 通常更适合服务于诸如此类的静态内容)。但是,这似乎更像是对解决方案的优化,而不是解决方案本身。

我也知道数据可以通过持久的 http 连接传递,因此不必向服务器发出多个请求以获取多个文件。但是,通过一个持久连接可以传递多少文件。这种持久性模型是否意味着仅将图像作为单独的文件加载不一定是一个坏主意?

非常感谢您对相关问题的个人经验提出任何建议、解决方案和/或注释。可扩展性在这里非常重要,以及跨浏览器支持(IE7+、Opera、Firefox、Chrome、Safari)

编辑:我没有使用 JQUERY。

【问题讨论】:

  • 也许您已经研究过类似的东西,但解决“一次返回的数据过多”问题的常用方法是分页。只是不要一次返回所有联系人。例如,看看 myspace 和 facebook 如何列出您的朋友。它们不是同时提供的,它们具有各种排序和搜索功能,因为用户实际上只是在查看他们的联系人以找到一个或几个人,或者慢慢浏览。使用模式并没有真正表明需要一直显示所有这些。
  • 我最近看到这篇博文可能会有所帮助:blog.teachstreet.com/homepage/…
  • 这是有道理的。但是,在我的页面上,联系人列表会同时显示所有联系人以增强功能。我可以让它只在打开聊天屏幕时显示图像,但我很好奇是否有可能同时加载它们。
  • 感谢您提供信息丰富的博文。在这里使用外部主机(例如 S3)可能是一个不错的选择。我的网站没有图像,文件使用量与用户的比例非常非常小。能够将托管的图像部分与其他所有内容分开缩放会使事情变得更容易。
  • 我认为您必须了解缓存机制如何在浏览器上工作,才能将所有这些图像发送到用户浏览器并保留在那里。缓存的问题主要在于网站端发送 cookie,然后是用户浏览器。

标签: image persistent-connection


【解决方案1】:

这是一个 jquery 插件,它会延迟加载图像,直到真正需要它们(即,只加载“首屏”的图像。)

http://www.appelsiini.net/2007/9/lazy-load-images-jquery-plugin

另一种方法是使用 Flash 仅显示图像。优点是 Flash 是您拥有的更强大的本地缓存

【讨论】:

  • 我没有使用 jQuery。 Flash 肯定会很好,但为了更好的兼容性,我想避免它。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-12-22
  • 2011-09-13
  • 2021-10-23
  • 1970-01-01
  • 2021-01-29
  • 1970-01-01
相关资源
最近更新 更多