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

Одним малоизвестным нововведением 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

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

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



Предложения и пожелания:
Ваше имя: Ваш E-mail:
Введите изображенные цифры:
Captcha

HTML (19)

CSS (36)

PHP (21)

MySQL (14)

JavaScript (57)

Flash (6)

XML (3)

Apache (34)

Дизайн (35)

Продвижение (30)

Программы (25)

Unix (11)

Интересное (37)


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


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

07.02.2012 13:27, 11 комментов
07.02.2012 00:29, 4 коммента
02.02.2012 15:31, 4 коммента

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

Защита сервера от ошибок в phpMyAdmin

HTML5 - новые виды атак

Социальные рекомендации Twitter в Google

Ашманов про стартапы

Skype Distributed Database Architecture

Erlang - лекарство при высоких нагрузках

Amazon Web Services: инструменты обеспечения масштабируемости и отказоустойчивости

Обсуждения на форуме:

Новый раздел

Шаблонизация

YaPro - Полная сборка системы

Дубли файлов, эскизы изображений, редактирование шаблонов

Общая регистрация в CMS и phpBB3

Помощь в разработке шаблона

Идея модуля музыкальной системы

Ошибка в тексте? Выделите её мышкой и нажмите: Ctrl + Enter| Здравствуйте, Гость | Войти | Регистрация| Карта сайта | RSS ленты
О проекте | Скачать CMS | Видеоуроки | Документация | Плагины | Форум | Идеи | Новости | Веб-мастеру | Контакты

YaPro CMS в Живом Журнале

YaPro CMS в Твитере

YaPro CMS в Одноклассниках

YaPro CMS в Яндекс.Блогах


youtube.com/watch?v=7hFivbgIEqk

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


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