时间戳

首页 > 解决方案 > 定义浏览器性能的 Javascript 函数

javascript - 定义浏览器性能的 Javascript 函数

问题描述

在加载 DOM 之前和之后定义 javascript 函数之间是否存在浏览器性能差异？

我通常像这样在 DOM 加载后定义函数

// Example-1

$(document).ready(function(){
  function foo(){
    alert("foo");
  }

  foo();
});

有些人用这种方式

// Example-2

function foo(){
  alert("foo");
}

$(document).ready(function(){
  foo();
});

Theory-1：他们说 Example-1 比 Example-2 慢，因为 Example-1 等待 DOM 加载然后开始定义函数，然后页面开始以全功能工作。然而，在示例 2 中，在加载 DOM 的同时定义了函数，因此页面在加载 DOM 的同时成为完整功能。结果，示例 2 在示例 1 尝试定义函数时获得了一些时间。

Theory-2: $(document).ready 函数本身很慢。为了更快地获得相同的结果，请使用这种方式

(function() {

})();

我找不到与这个理论相关的任何东西。有人可以解释一下幕后发生了什么吗？

谢谢。

标签： javascripthtmljquerydombrowser

解决方案

示例 #1 和示例 #2 之间的任何性能差异都无关紧要。有意义的差异是范围问题。

至于您的“理论 2”功能，您所做的只是创建一个闭包。这和jQuery的完全不同.ready()，相当于等待DOMContentLoaded事件。

推荐阅读