Подтвердить что ты не робот

API навигационного тайминга. Что происходит между domContentLoadedEventStart и domContentLoadedEventEnd?

W3C указывает список событий и их соответствующие тайминги, которые должны возвращать пользовательские агенты, если они хотят поддерживать API синхронизации навигации.

Список вы можете посмотреть здесь: http://www.w3.org/TR/navigation-timing/#process

Понимание того, какой процесс связан с тем, какие события в большинстве случаев довольно прямолинейны. Но одна вещь, которая ускользает от меня, это то, что происходит между domContentLoadedEventStart и domContentLoadedEventEnd.

Вот что я понял до сих пор и основываю свои размышления на:

  • domLoading//UA начинает разбор документа.
  • domInteractive//UA завершил разбор документа. пользователей может взаимодействовать со страницей.
  • domContentLoaded//Документ полностью загружен и разобранные и отложенные сценарии, если они есть, выполнены. (Асинхронные скрипты, если таковые имеются, могли или не могли быть выполнены???)
  • domComplete//Дерево DOM полностью построено. Асинхронные скрипты, если любые, выполнены.
  • loadEventEnd//У UA есть полностью заполненная страница. Все ресурсы, например изображения, swf и т.д.

Вы должны иметь возможность определить, что происходит после фазы №3 (domContentLoaded), понимая, что вызвало событие №4 (domComplete), но не инициировало предыдущие события.

Итак, можно было бы подумать, что "сценарии Async, если они были выполнены" означает, что асинхронные скрипты выполняются после фазы №3, но до события №4. Но, согласно моим тестам, это не то, что происходит, если только мой тест не прав. (Я пытался реплицировать свой тест на JSFiddle, но я не могу сделать работу с отложенным/асинхронным script, так как не существует способа добавить атрибут во внешние скрипты.)

Итак, мой вопрос: какой процесс происходит между domContentLoadedEventStart и domContentLoadedEventEnd?

4b9b3361

Ответ 1

Эти тайминги связаны с событиями domContentLoaded. Он похож на событие load с loadEventStart и loadEventEnd. Вместо использования load вы используете domContentLoaded.

Например, добавление события domContentLoaded и запуск в нем некоторого кода должно дать вам другое начало и конец.

document.addEventListener("DOMContentLoaded", function(event) {
    var j = 0;
    for (var i = 0; i < 10000000; i++) {
        j = i;
    }
});

Как только это событие будет запущено, API синхронизации навигации вернет другую временную метку между временем начала и окончания, в зависимости от того, сколько времени займет ваше событие (ы).

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

domContentLoadedEventStart

Этот атрибут должен возвращать время непосредственно перед тем, как агент пользователя запускает событие DOMContentLoaded в документе.

Свойство domContentLoadedEventEnd

Этот атрибут должен возвращать время сразу после завершения события документа DOMContentLoaded.