Оптимальный способ доставки для большого количества изображений

У меня есть веб-сайт, сосредоточенный вокруг приложения для онлайн-чата, где каждый пользователь может иметь до нескольких сотен контактов. У каждого контакта есть свое изображение профиля. Я хочу сделать так, чтобы изображение профиля контакта загружалось рядом с его именем. Однако наличие у пользователя загрузки более 100 изображений при каждой загрузке сайта кажется интенсивным (исследования показали, что до 40% пользователей не используют там кэш). Каждое изображение имеет размер около 60x60 пикселей.

Когда я выполняю поиск в Google или регистрируюсь в Facebook, десятки изображений обслуживаются практически мгновенно. Помимо наличия быстрых серверов и хорошего соединения, каковы оптимальные методы доставки такого количества изображений пользователю?

Возможные подходы, которые я придумал:

  • Сохранение изображения профиля каждого пользователя в базе данных, создание одного изображения в php-файле, затем его загрузка пользователем, а затем использование css для отображения каждого изображения профиля. Тем не менее, это кажется чрезвычайно интенсивным на сервере, и обращение к такому большому файлу столько раз может отразиться на браузере пользователя.
  • Использование nginx вместо apache для сервера изображений (nginx обычно лучше работает для сервера статического контента, такого как этот). Однако это больше похоже на оптимизацию решения, чем на само решение.

Мне также известно, что данные могут доставляться через постоянные http-соединения, поэтому не нужно отправлять несколько запросов на сервер для нескольких файлов. Тем не менее, сколько именно файлов может быть доставлено через одно постоянное соединение. Означает ли эта постоянная модель, что загрузка изображений в виде отдельных файлов не обязательно будет плохой идеей?

Будем весьма благодарны за любые предложения, решения и / или замечания по личному опыту в соответствующих вопросах. Здесь очень важна масштабируемость, а также кросс-браузерная поддержка (IE7+, Opera, Firefox, Chrome, Safari).

РЕДАКТИРОВАТЬ: Я не использую JQUERY.

Источник

1 ответ

Вот плагин jquery, который задерживает загрузку изображений до тех пор, пока они на самом деле не нужны (т.е. загружает изображения только "выше сгиба").

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

Альтернативой может быть использование Flash для отображения только изображений. Преимущество в том, что Flash - намного более сильный локальный кеш, чем у вас есть программа

Источник
Другие вопросы по тегам