2010-10-25 18 views
0

我有一个以在线聊天应用程序为中心的网站,每个用户可以有多达数百个联系人。每个联系人都有自己的个人资料图片我想要让联系人的个人资料图片加载在那里名称旁边。然而,每次他们加载网站时,让用户下载100张以上的图片似乎都很密集(研究表明,多达40%的用户不使用缓存)。每幅图像的尺寸大约为60x60像素。大量图像的最佳传送方式

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

我想出了可能的方法是:

  • 存储在数据库中的每个用户的配置文件的图像,在一个PHP文件中构建一个图像,比具有,然后使用CSS来显示每个配置文件的用户下载图片。但是,这似乎在服务器上非常激烈,并且引用这么大的文件可能会对用户的浏览器产生影响。
  • 使用nginx而不是apache来为图像提供服务(nginx通常对服务器的静态内容效果更好)。但是,这看起来更像是对解决方案的优化,而不是本身的解决方案。

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

任何建议,解决方案,和/或有关个人经验与相关事项的笔记将不胜感激。可扩展性在这里非常重要,以及跨浏览器支持(IE7 +,Opera,Firefox,Chrome,Safari)

编辑:我没有使用JQUERY。

+1

也许你已经看过这样的东西,但解决“太多的数据立即返回”问题的常见方法是分页。不要一次返回所有联系人。举个例子,看看myspace和facebook如何列出你的朋友。它们不是一次全部提供服务,并且它们具有各种排序和搜索功能,因为用户只是在查看他们的联系人以找到一个或几个人,或者慢慢浏览他们。使用模式并没有真正显示出需要一直显示所有内容。 – 2010-10-25 01:14:05

+0

这很有道理。但是,在我的页面上,联系人列表与所有联系人一起显示,以增强功能。我可以做到这一点,因此只有在聊天窗口打开时才显示图像,但是如果让所有图像一次全部加载就很有好处。 – user396404 2010-10-25 02:02:42

+0

我想你将不得不学习缓存机制如何在浏览器上将所有这些图像提供给用户浏览器并保留在那里。缓存问题主要在网站端发送cookies,然后是用户浏览器。 – Clutch 2010-12-17 21:23:02

回答

0

这里是一个jQuery插件,延迟加载图像,直到他们真正需要(即,只加载“首屏”。图片)

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

另一种可能是使用Flash来显示只是图像。优点是Flash是一个更强大的本地缓存,你有程序

+0

我不使用jQuery。 Flash肯定会很好,但这是我想避免更好的兼容性。 – user396404 2010-10-25 02:03:48

相关问题