Перевод статьи «HTML Imports #include for the web», Eric Bidelman.
От переводчика
Недавно я перевел статью по основам HTML Import. Я обещал, что если эта тема заинтересует хабра-сообщество, то переведу более подробную статью. Я решил разбить перевод на две одинаковые по размеру части, так как, по моему, на одну часть слишком много буков. Вторая часть выйдет спустя несколько дней после публикации этой части. Если, конечно, эта часть более-менее понравится хабра-сообществу.
Для чего нужен HTML-импорт?
Давайте поговорим о том, как мы загружаем различные ресурсы. JavaScript мы загружаем при помощи
<script src>. Для CSS у нас есть
<link rel="stylesheet">. Для изображений
<img>. Для видео есть
<video>. Для аудио —
<audio>… Давайте ближе к сути! Для большинства видов контента есть простые способы его подгрузки. Но не для HTML. Для HTML у нас есть следующие варианты:
<iframe> — испробованный и рабочий, но тяжеловесный способ. Контент iframe'а живет в отдельном от главной страницы контексте. Хоть это и хорошая особенность, она также создает дополнительные трудности: подгонка размера айфрейма к его содержимому, работа с внутренними скриптами и стилями.- AJAX — мне нравится
xhr.responseType="document", но загрузка HTML при помощи JS выглядит как-то неправильно.
- КривыеКостылиTM — html код в виде JS строк или комментариев, например
<script type="text/html">.
HTML код, это самый простой тип контента, но в этом плане, он требует наибольших усилий. Хорошо, что у нас есть Web Components, они помогут нам справиться с этой и другими проблемами.
Читать дальше →
