сделать загрузку моего фонового изображения быстрее?

Question

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

Мой css находится в шапке, большинство моих js-файлов внизу. (Я сохранил jquery из cdn в шапке тоже).

Фоновое изображение размером 1X960 пикселей (2 цветных изображения) довольно маленькое и повторяется вдоль Y.

Могу ли я что-нибудь сделать, чтобы он загрузился быстрее?

Если честно, это заметно в chrome и firefox. В IE8 фон загружается быстро.

Answer 1

Увеличьте изображение

Это всего лишь 1 пиксель в высоту, некоторые браузеры очень часто пытаются повторить изображение.Попробуйте увеличить его до 50px и посмотреть, не улучшит ли это производительность.Я не могу найти ответ, но кто-то однажды показал мне, что некоторые браузеры действительно борются с повторяющимися фонами, и они используют огромное количество вычислительной мощности, чтобы повторять их сотни раз.

Другойдомен

Обслуживание статических данных из домена без файлов cookie может повысить производительность загрузки изображений.

Answer 2

Поскольку вы используете VS Dev Server, это может стоить того, если вы используете Windows 7 (и, может быть, Vista), это связано с какой-то проблемой DNS / IPv6, которую нужно решить навсегда, и это то, что сводило меня с ума. с точно такими же проблемами до 5 дней назад. Загрузка страницы 500 Кб заняла 8 секунд, теперь она занимает 383 мс

.

перейдите к файлу хоста (C: \ Windows \ System32 \ drivers \ etc) и убедитесь, что вторая запись localhost закомментирована следующим образом с символом #:

# localhost name resolution is handled within DNS itself.
127.0.0.1       localhost
#::1             localhost

Комментирование этой строки сразу решило проблему - не совсем точно понял, в чем проблема, но я знаю, что это решило ее.

Answer 3

Комбинация всех этих ответов помогла. Я проголосовал за них всех.

Answer 4

Проверьте метатег кэша, если он присутствует и установлен на «no-cache», он может не кэшировать ваши изображения.

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