как предварительно загрузить изображения для мобильного сайта (например, http://m.youtube.com/, http://m.zoosk.com/)

Question

Я использовал этот метод: CSS Throwdown - Предварительная загрузка изображений без JavaScript Джефф Старр - http://perishablepress.com/press/2007/07/22/css-throwdown-preload-images-without-javascript/

Он отлично работает, когда я просматриваю его в веб-браузере, однако на мобильном устройстве это не оказывает никакого влияния, значки .png по-прежнему загружаются слишком долго.

Answer 1

Предварительная загрузка не делает все магически быстрее - это просто означает, что запросы иногда выдаются до того, как требуются данные. Предварительная загрузка вообще происходит? Возможно, все просто медленно, потому что мобильная связь не очень хорошая.

Мне кажется, что этот метод предварительной загрузки изображений будет хорошо работать в мобильных браузерах - я очень сомневаюсь, что мобильные браузеры "оптимизируют", не загружая изображения, не видны.

Answer 2

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

Answer 3

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

Я ожидаю, что также неприятно, что предварительная загрузка с использованием javascript будет работать в любом браузере или прокси-сервере, использующем транскодирование или предварительную разметку на сервере.

Пробовали ли вы подход старой школы (90-х годов) к предварительной загрузке, который заключался в том, чтобы включать изображение на домашней странице (или даже на каждой странице), но с размером 1 × 1 × (возможно, также можно попробовать 0 × 0). Это может означать, что пользователь платит за загрузку большего количества контента, чем ему нужно. Что является проблемой для рассмотрения.

Первое, что нужно сделать, это: убедиться, что вам действительно нужно изображение; сделать его как можно меньше (физический размер и сжатие кодировки изображения); и [gzip] сжимают файл при отправке по HTTP. Также убедитесь, что вы делаете все возможное, чтобы браузер пользователя / клиента правильно кэшировал изображения.