some description not accurate in the article of 《onload-ondomcontentloaded》

article

article Link 《onload-ondomcontentloaded》

may not accurate

document.readyState becomes interactive right before DOMContentLoaded. These two things actually mean the same.

interactive – the document is parsed, happens at about the same time as DOMContentLoaded, but before it.

reason

if a page containers some "defer" script, then it will cost some time to execute the "defer" script after interactive but before DCL.

Reference

https://calendar.perfplanet.com/2012/deciphering-the-critical-rendering-path/

If you add a script and tag it with “defer”, then you unblock the construction of the DOM: the document interactive state does not have to wait for execution of JavaScript. However, note that this same script will be executed before DCL is fired. Further, recall that JavaScript may query CSSOM, which means that the DCL event may be held until the CSSOM is ready, at which point the script will be executed. In short: we’ve unblocked the “document interactive” state, but we’re still potentially blocking DCL.

https://html.spec.whatwg.org/multipage/dom.html#current-document-readiness

The DOMContentLoaded event fires after the transition to "interactive" but before the transition to "complete", at the point where all subresources apart from async script elements have loaded.

リンク先の onload-ondomcontentloaded の記事を開き、引用されている readyState と DOMContentLoaded の説明を、WHATWG の readiness リファレンスおよび defer スクリプトの説明と比較してください。記事を更新し、interactive への遷移と、その後に発生する DOMContentLoaded イベントを区別するようにしてから、これらのリファレンスに照らして改訂した文言を確認してください。