Best Practices for Speeding Up Your Web Site / Рекомендации лучших вебоводов для ускорения вашего сайта: Avoid Empty Image src / Избегайте картинок без источника
| Английский оригинал | Перевод на русский | |
|---|---|---|
Сожалеем, но текст оригинала доступен только зарегистрированным пользователям. |
Картинки с пустым атрибутом src встречаются чаще, чем вам может показаться. Они бывают двух видов: Alexasa 24.09.12 в 14:23 |
|
|
чистый HTML Alexasa 24.09.12 в 14:23 |
||
|
<img src=""> Alexasa 24.09.12 в 14:24 |
||
|
JavaScript Alexasa 24.09.12 в 14:24 |
||
|
var img = new Image(); Alexasa 24.09.12 в 14:24 |
||
|
Оба случая приводят к одному и тому же: браузер делает повторный запрос к серверу. Alexasa 24.09.12 в 14:25 |
||
|
Internet Explorer делает запрос к директории, в которой находится страница. Alexasa 24.09.12 в 14:25 |
||
|
Safari и Chrome делают запрос к самой текущей странице. Alexasa 24.09.12 в 14:26 |
||
|
Firefox 3 и предыдущие версии ведут себя подобно Safari и Chrome, однако в версии 3.5 данный вопрос уже рассмотрен [bug 444931] {URL} и браузер больше не посылает запрос. Alexasa 24.09.12 в 14:28 |
||
|
Opera ничего не делает, когда встречается пустая картинка. Alexasa 24.09.12 в 14:28 |
||
|
Чем плохо такое поведение? Alexasa 24.09.12 в 14:29 |
||
|
Перегрузкой ваших серверов отсылкой большого количества бесполезного трафика, особенно на страницах, которые генерируют миллионы просмотров в день. Alexasa 24.09.12 в 15:29 |
||
|
Лишние циклы расчетов сервера генерируются страницами, которые никогда не будут просмотрены. Alexasa 24.09.12 в 15:30 |
||
|
Возможна порча пользовательских данных. Если вы отслеживаете состояние в запросе, куками или другим способом, вы можете нарушить данные. И хотя запрос картинки не возвращает картинку, все заголовки читаются и принимаются браузером, включая все куки. В то время, как остаток ответа отбрасывается, ущерб уже может быть нанесен. Alexasa 24.09.12 в 15:34 |
||
|
Корень проблемы в том, каким способом URI обрабатывается браузером. Указанное поведение определено в RFC 3986 - Uniform Resource Identifiers (универсальные идентификаторы ресурсов). Это происходит когда встречается пустая строка и обрабатывается как URI согласно алгоритмам описанным в пункте 5.2, в то время как данный случай (пустая строка) указан в пункте 5.4. Firefox, Safari, и Chrome обрабатывают пустую строку согласно спецификациям, в то время как IE не совсем правильно, вероятно в соответствии с ранней версией спецификаций, RFC 2396 - Uniform Resource Identifiers (отменено спецификацией RFC 3986). Так что технически, браузеры делают то, что они должны делать для обработки относительных адресов. Проблема в том, что в данном контексте пустая строка совершенно не предусмотрена. Alexasa 24.09.12 в 15:43 |
||
|
HTML5 в пункте 4.8.2 дополняет описание атрибута src, чтобы браузеры не делали дополнительный запрос: Alexasa 24.09.12 в 15:45 |
||
|
Атрибут src обязателен и должен содержать действительный URL указывающий на неинтерактивную, возможно анимированную картинку, которая не является ни страницей, ни скриптом. Если базовый URI элемента такой же, как адрес документа, то значения атрибута src не должно быть пустой строкой. Alexasa 24.09.12 в 15:51 |
||
|
Надеемся браузеры не будут иметь указанную проблему в будущем. К сожалению, подобного пункта нет ни для <script src="">, ни для <link href="">. Возможно еще есть время для корректировки, чтобы браузеры случайно не реализовали подобное поведение. Alexasa 24.09.12 в 15:52 |
||
|
Данное правило было предложено гуру джаваскрипта Yahoo! Николасом Ц. Закасом. Для дополнительной информации обратитесь к его статье "Пустой источник картинки может разрушить ваш сайт"{URL}. Alexasa 24.09.12 в 15:56 |
