« Инфраструктурные домены в индексе Гугла | Домены .ме »
Написал жаба-скриптик, который замедляет загрузку картинок на странице. Дело в том, что если у вас на одной странице много картинок, то ничто кроме здравого смысла не мешает браузеру грузить их все одновременно, сколько бы их ни было. Если при этом отрисовка картинок это ресурсожоркий процесс, например вы показываете не голых блондинок, а что-то полезное, скажем какие-нибудь счётчики бабла трафа, то серверу может резко поплохеть. У меня например есть внутренняя страничка, на которую выведены статусы всех серверов в виде картинок, каждая группа сайтов это 1 или 2 картинки на одной странице их очень много, соответственно когда я делаю обновление этой страницы, сервера начинают одновременно выдавать много результатов, что не идёт им на пользу, а IE на пару секунд подвешивает интернет-канал.
Чтобы загрузка картинок происходила более плавно, придумал такой скрипт:
<script type=”text/javascript”>
var elements1;
var elements2;
var nn;
var ll;
var delayms = 250;if (document.getElementsByTagName)
{
elements1 = document.body.getElementsByTagName(“IMG”);
}
else if (document.body.all)
{
elements1 = document.body.all.tags(“IMG”);
} else
{
elements1 = Array();
}
elements2 = Array();
for (var i = 0; i < elements1.length; i++)
{
elements2[i] = elements1[i].src;
elements1[i].src = ”;
elements1[i].onload = ShowImgs;
}ll = elements1.length;
nn = 0;
setInterval(‘ShowImgs()’, delayms);function ShowImgs()
{
if (nn >= ll)
{
window.status = ”;
clearInterval();
return;
}
sss = elements2[nn];
window.status = ‘Images [' + nn + '/' + ll + '] ‘ + sss;
elements1[nn].src = sss;
nn = nn + 1;
}</script>
Скрипт нужно поместить в конец страницы с картинками. Работает он очень просто – при загрузке он запоминает адреса всех картинок в массиве, а в те места где картинки должны быть, подставляет пустышки. Потом запускается таймер, который начинает загружать картинки одну за другой. Одновременно с этим, в загруженных картинках срабатывает событие, которое тоже загружает оставшиеся картинки, если они загрузились быстрее таймера. В IE загрузка работает плавно, как в ФФ, где это кажется реализовано в браузере.
10 Responses
July 16th, 2008 at 01:38:32
// php gravatar() ?>1Прикольно, возьму на вооружение, правда доработать, имхо, надо – ввести ограничение на количество одновременно загружающихся картинок, очередь, тех же “голых блондинок” лучше смотреть по одной, чем 10 штук одновременно будут грузиться по чуть-чуть
July 16th, 2008 at 07:34:07
// php gravatar() ?>2честно говоря, я не понял в чем именно была проблема, но по-моему решение не очень:) в чем именно косяк когда все одновременно загружаются – это же быстрее – значит лучше?
July 16th, 2008 at 12:46:58
// php gravatar() ?>3MegaS, представь интернет. Представь страницу с картинками в интернете. Самих картинок представь 300 штук. Дошло?
VolCh, там есть переменная которая устанавливает задержку, её можно подкручивать по вкусу.
July 16th, 2008 at 15:11:21
// php gravatar() ?>4Всё равно не понял почему постепенно лучше чем сразу все. Во-первых, на самом сервере любой веб сервер большое число одновременных подключений ставит в очередь, поэтому у него проблем не должно быть. А во-вторых, эксплорер корректно и быстро обрабатывает ситуацию, насколько я понял. Так что в чем проблема, не вижу:) Может быть я что-то неправильно понял?
July 16th, 2008 at 15:51:46
// php gravatar() ?>5Alex, а скриптиком не поделишься, тем что серваки мониторит?
Или хоть темку не много подпали
July 16th, 2008 at 18:28:11
// php gravatar() ?>6Вроде бы браузеры больше двух одновременных соединений к одному домену не используют, так что в один и тот же момент времени больше двух картинок не загружается. Поэтому на многих сайтах по оптимизации скорости загрузки страниц и рекомендуют раскидывать их по разным доменам/поддоменам, чтобы загрузка происходила быстрее.
July 16th, 2008 at 20:57:10
// php gravatar() ?>7Класс! А я до такого и не додумывался даже. Зачем замедлять загрузку? Теперь все понял
July 17th, 2008 at 00:37:27
// php gravatar() ?>8Курский Сео-шник, скрипт самопальный, делиться не стану. Конкретно мониторится состояние сервера так: раз в минуту на сервере дёргается команда uptime, если она показывает меньше 2, то картинка зеленая, если меньше 6 то жёлтая, если больше то красная. Плюс на той же картинке показан счётчик отладочных сообщений.
Physicist, палю тему: на одном сервере может быть больше одного сайта.
July 17th, 2008 at 00:45:09
// php gravatar() ?>9alexf, я про «сервер» ничего и не говорил.
Просто фраза «ничто кроме здравого смысла не мешает браузеру грузить их все одновременно» некорректна. Посмотрите любым сниффером на трафик при загрузке страницы — в каждый момент времени будет не более двух соединений.
July 17th, 2008 at 18:00:52
// php gravatar() ?>10Physicist, а я как раз говорил про сервера. Сервер один, сайтов много. Про 2 соединения, лень искать, на скорую руку находится что в ИЕ8 разрешено 6 соединений, то есть как я написал – полностью зависит от воли разработчиков. В старых виндах значение может быть не установлено.
RSS feed for comments on this post · TrackBack URI
Написать комментарий
Про что писал
Календарь
Куйворды
Архив
Подписка на блог
Статистика подписки
Страницы
Комментарии
Последние посты
Blogroll
Счётчики
Свежие записи
Последние комментарии
Интересное на блоге
Самое комментируемое
SEO блог где палят темы is proudly powered by WordPress - BloggingPro theme modified by alexf