Использование предварительной загрузки

Одним малоизвестным нововведением HTML 5 является предварительная загрузка контента в браузер. Идея заключается в том, что пока вы просматриваете содержимое страницы, в браузер подгружается, указываемое внутри страницы содержимое, которое, по мнению вебмастера, посетителю сайта потребуется при последующем переходе (без каких-либо манипуляций AJAX).

Вот как это работает.

Вы добавляете такую строку в свою страницу:

<link rel="next" href="page2.html">

Теперь браузер автоматически загрузит page2.html в фоновом режиме, если компьютер пользователя простаивает. Как только пользователь перейдет по ссылке на page2.html, браузер возьмет страницу из кэша, и загрузка будет практически мгновенной.

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

Вот несколько примеров когда, вы можете использовать ссылку предварительной загрузки:

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

* На стартовой странице проекта или его части где используется аннотация и затем следует кнопка «Далее».

* На странице поиска для предварительной загрузки верхнего результата.

Помимо этого, данный метод можно использовать для предварительной загрузки статического содержимого:

<link rel="prefetch" href="/images/big.jpeg">

Некоторые другие интересные моменты:

* Поддержка предварительной загрузки, вероятно, скоро появится в Опере, Chrome и Safari в ближайшее время, и в Internet Explorer где нибудь в 2020.

* Если эта технология станет популярной, то она может исказить статистику. Дело в том что для сервера такой запрос выглядит как обычное посещение пользователем страницы и далеко не факт, что он ее на самом деле посетит.

Firefox сообщает серверу о таком запросе, отправляя в заголовке HTTP, X-moz: prefetch, поэтому такие запросы можно на сервере особым образом отработать.

Более подробно о данной технологии смотрите на сайте Mozilla.

От себя добавлю, конечно как и всякая технология — данная возможность несет в себе, скрытые угрозы — например скачать то, что вы не желаете, но это уж такая плата за все новое. По крайней мере возможность отключения в браузере FireFox данной функции уже предусмотрена. Для отключения этой функции в FireFox можно воспользоваться директивой:

user_pref("network.prefetch-next", false);

Кстати google во всю это уже пользует. Если зайти на google через FireFox и ввести в поиск «Хабрахабр» то в результате в исходнике можно увидеть:

<link rel=prefetch href="http://yapro.ru/system/redirect?to=http://www.habrahabr.ru/">

Источник: habrahabr.ru

Оцени публикацию:
  • 12,48
Оценили человек: 12
Теги : HTML5

Похожие статьи:

Справочники и учебники:


Комментарии посетителей:
  • Классная статья! Спасибо!
    26 октября 2013, 17:21 коммент полезен : -1 # Ярослав1
Предложения и пожелания:
Ваше имя:
Ваш E-mail:
Сколько будет Οдин + Τри
Главная
X

Новые заметки:

Про что мы забываем когда делаем оценку задачи по времени

Список вопросов для собеседования разработчика по телефону

Symfony2 авторизация без Doctrine2 для чайника

Phpstorm7 LiveEdit

Жесткий хабр или не хабр, тогда кто?

Яндекс.Деньги мошенничество

Как узнать какие страницы в поиске яндекса или это секрет

Последние комменты:

Yapro CMS:

Здравствуйте, Гость | Войти | Регистрация | Карта сайта | RSS ленты | Ошибка в тексте? Выделите её мышкой и нажмите: Ctrl + Enter

youtube.com/watch?v=7hFivbgIEqk

При полном или частичном использовании материалов данного сайта, ссылка на сайт "yapro.ru" обязательна как на источник информации.
Автоматический импорт материалов и информации с сайта запрещен.
Copyrights © 2007 - 2018 YaPro.Ru

Главная » Веб-мастеру » HTML »