草庐IT

javascript - 导航计时 API。 domContentLoadedEventStart 和 domContentLoadedEventEnd 之间发生了什么？

coder 2024-05-12 原文

W3C 指定了一个事件列表及其对应的时间，用户代理如果想要支持 Navigation Timing API 就必须返回这些事件。 .

您可以在此处查看列表:http://www.w3.org/TR/navigation-timing/#process

在大多数情况下，了解哪个过程与哪些事件相关是非常简单的。但有一件事让我感到困惑，那就是 domContentLoadedEventStart 和 domContentLoadedEventEnd 之间发生了什么。

以下是我目前的理解和思考:

  1. domLoading//UA 开始解析文档。
  2. domInteractive//UA 已完成对文档的解析。用户 可以与页面交互。
  3. domContentLoaded//文档已经完全加载并且 已解析和延迟的脚本(如果有)已执行。 (异步脚本， 如果有的话，可能会或可能不会执行？？？)
  4. domComplete//DOM 树已完全构建。异步脚本，如果 任何，已执行。
  5. loadEventEnd//UA 有一个完全完成的页面。所有资源， 图片、swf 等已加载。

通过理解什么触发了事件 #4 (domComplete) 但没有触发之前的事件，应该能够推断出阶段 #3 (domContentLoaded) 之后发生的事情。

所以有人会认为“异步脚本(如果有的话)已执行”意味着异步脚本在阶段 #3 之后但在事件 #4 之前执行。但是根据我的测试，这不会发生，除非我的测试是错误的。 (我试图在 JSFiddle 上复制我的测试，但我无法使延迟/异步脚本工作，因为无法在外部脚本上添加属性。)

所以我的问题是:domContentLoadedEventStart 和 domContentLoadedEventEnd 之间发生了什么过程？

最佳答案

这些时间与 domContentLoaded 事件有关。它类似于带有 loadEventStart 和 loadEventEnd 的 load 事件。您不使用 load，而是使用 DOMContentLoaded。

例如，添加一个 DOMContentLoaded 事件并在其中运行一些代码，应该会给您一个不同的开始和结束。

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

该事件运行后，导航计时 API 将在开始时间和结束时间之间返回不同的时间戳，具体取决于您的事件运行时间。

根据您指出的 W3C 文档，我相信这些时间没有其他进程在进行。

domContentLoadedEventStart attribute

This attribute must return the time immediately before the user agent fires the DOMContentLoaded event at the Document.

domContentLoadedEventEnd attribute

This attribute must return the time immediately after the document's DOMContentLoaded event completes.

关于javascript - 导航计时 API。 domContentLoadedEventStart 和 domContentLoadedEventEnd 之间发生了什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21790023/

domContentLoadedEventStartdomContentLoadedEventEndcodesectionstrongjavascriptdom

有关javascript - 导航计时 API。 domContentLoadedEventStart 和 domContentLoadedEventEnd 之间发生了什么？的更多相关文章

  1. ruby - 为什么我可以在 Ruby 中使用 Object#send 访问私有(private)/ protected 方法？ - 2

    类classAprivatedeffooputs:fooendpublicdefbarputs:barendprivatedefzimputs:zimendprotecteddefdibputs:dibendendA的实例a=A.new测试a.foorescueputs:faila.barrescueputs:faila.zimrescueputs:faila.dibrescueputs:faila.gazrescueputs:fail测试输出failbarfailfailfail.发送测试[:foo,:bar,:zim,:dib,:gaz].each{|m|a.send(m)resc

  2. ruby-on-rails - Rails - 子类化模型的设计模式是什么？ - 2

    我有一个模型:classItem项目有一个属性“商店”基于存储的值，我希望Item对象对特定方法具有不同的行为。Rails中是否有针对此的通用设计模式？如果方法中没有大的if-else语句，这是如何干净利落地完成的？ 最佳答案 通常通过Single-TableInheritance. 关于ruby-on-rails-Rails-子类化模型的设计模式是什么？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.co

  3. ruby - 什么是填充的 Base64 编码字符串以及如何在 ruby​​ 中生成它们？ - 2

    我正在使用的第三方API的文档状态:"[O]urAPIonlyacceptspaddedBase64encodedstrings."什么是“填充的Base64编码字符串”以及如何在Ruby中生成它们。下面的代码是我第一次尝试创建转换为Base64的JSON格式数据。xa=Base64.encode64(a.to_json) 最佳答案 他们说的padding其实就是Base64本身的一部分。它是末尾的“=”和“==”。Base64将3个字节的数据包编码为4个编码字符。所以如果你的输入数据有长度n和n%3=1=>"=="末尾用于填充n%

  4. ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2

    我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i

  5. ruby - 为什么 4.1%2 使用 Ruby 返回 0.0999999999999996？但是 4.2%2==0.2 - 2

    为什么4.1%2返回0.0999999999999996？但是4.2%2==0.2。 最佳答案 参见此处:WhatEveryProgrammerShouldKnowAboutFloating-PointArithmetic实数是无限的。计算机使用的位数有限(今天是32位、64位)。因此计算机进行的浮点运算不能代表所有的实数。0.1是这些数字之一。请注意，这不是与Ruby相关的问题，而是与所有编程语言相关的问题，因为它来自计算机表示实数的方式。 关于ruby-为什么4.1%2使用Ruby返

  6. ruby-on-rails - Rails 应用程序之间的通信 - 2

    我构建了两个需要相互通信和发送文件的Rails应用程序。例如，一个Rails应用程序会发送请求以查看其他应用程序数据库中的表。然后另一个应用程序将呈现该表的json并将其发回。我还希望一个应用程序将存储在其公共(public)目录中的文本文件发送到另一个应用程序的公共(public)目录。我从来没有做过这样的事情，所以我什至不知道从哪里开始。任何帮助，将不胜感激。谢谢! 最佳答案 无论Rails是什么，几乎所有Web应用程序都有您的要求，大多数现代Web应用程序都需要相互通信。但是有一个小小的理解需要你坚持下去，网站不应直接访问彼此

  7. ruby - ruby 中的 TOPLEVEL_BINDING 是什么？ - 2

    它不等于主线程的binding，这个toplevel作用域是什么？此作用域与主线程中的binding有何不同？>ruby-e'putsTOPLEVEL_BINDING===binding'false 最佳答案 事实是，TOPLEVEL_BINDING始终引用Binding的预定义全局实例，而Kernel#binding创建的新实例>Binding每次封装当前执行上下文。在顶层，它们都包含相同的绑定(bind)，但它们不是同一个对象，您无法使用==或===测试它们的绑定(bind)相等性。putsTOPLEVEL_BINDINGput

  8. ruby - Infinity 和 NaN 的类型是什么？ - 2

    我可以得到Infinity和NaNn=9.0/0#=>Infinityn.class#=>Floatm=0/0.0#=>NaNm.class#=>Float但是当我想直接访问Infinity或NaN时:Infinity#=>uninitializedconstantInfinity(NameError)NaN#=>uninitializedconstantNaN(NameError)什么是Infinity和NaN？它们是对象、关键字还是其他东西？ 最佳答案 您看到打印为Infinity和NaN的只是Float类的两个特殊实例的字符串

  9. ruby-on-rails - 如果 Object::try 被发送到一个 nil 对象，为什么它会起作用？ - 2

    如果您尝试在Ruby中的nil对象上调用方法，则会出现NoMethodError异常并显示消息:"undefinedmethod‘...’fornil:NilClass"然而，有一个tryRails中的方法，如果它被发送到一个nil对象，它只返回nil:require'rubygems'require'active_support/all'nil.try(:nonexisting_method)#noNoMethodErrorexceptionanymore那么try如何在内部工作以防止该异常？ 最佳答案 像Ruby中的所有其他对象

  10. ruby - 为什么 SecureRandom.uuid 创建一个唯一的字符串？ - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗？通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion为什么SecureRandom.uuid创建一个唯一的字符串？SecureRandom.uuid#=>"35cb4e30-54e1-49f9-b5ce-4134799eb2c0"SecureRandom.uuid方法创建的字符串从不重复？

随机推荐