В чем разница между `` HTMLImports.whenReady` и window.addEventListener ('WebComponentsReady', функция (е) { `

Question

В чем разница между HTMLImports.whenReady и window.addEventListener('WebComponentsReady', function(e) {

Polymer's official documentation говорит:

«Для того, чтобы определить элемент в основной HTML-документа, определим элемент из HTMLImports.whenReady (обратного вызова). Обратный вызов вызывается, когда весь импорт в документе по завершении загрузки.»

Webcomponents.org's official documentation on imports говорит:

В соответствии с собственными импортными тегами в основном документе блокируется загрузка импорта. Это делается для того, чтобы импорт загрузился, и все зарегистрированные элементы в них были обновлены. Это естественное поведение сложно полилизовать, поэтому полис заполняет HTML-файл. Вместо этого событие WebComponentsReady является подставкой для такого поведения:

В чем разница между этими двумя?

Answer 1

Это почти * То же самое: оба запускаются одновременно.

Таким образом, вы можете выбрать свой любимый аромат между callback и Event.

Nota Bene: если по каким-то причинам, вы ссылаетесь на CustomElement.js polyfill отдельно (т.е. без HTMLImports.js функции), только WebComponentsReady событие будет сгенерировано.

(я предпочитаю использовать Event Handler, потому что в первом случае вы должны быть уверены, что HTMLImports определена, и потому, что он является единственным документально API here)

---

*: Конечно, они отличаются ! Разница указана в цитированных определениях.

• Последнее ожидание выполнения пользовательских элементов. Он запускается на полифоне CustomElement.js.
• Первый ждет только для того, чтобы Импорт был загружен и проанализирован. Он вызывается HTMLImports.js polyfill, сразу после отправки {HTMLImportsLoaded}.

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

Последовательность

1. <link rel=import>.onload(),
2. {HTMLImportsLoaded} событие,
3. HTMLImports.whenReady()
4. {WebComponentsReady} событие

Больше here.