2010-10-25 50 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

相關問題