小编Meg*_*iae的帖子

'显示:无;' 提高或恶化性能?

我有一个包含大量垂直滚动和数千个 DOM 元素的页面。为了提高性能,我考虑设置display: none;为视口上方和下方的 div 的内容,即不可见的 div(同时保持高度,显然):

在此处输入图片说明

为了检查我的想法是否有意义,我搜索了 SO 并发现了这个问题。根据评论和接受的答案,最好的策略是什么都不做,因为display: none;触发回流并可能产生相反的效果:

如果您想要避免回流,则将 display 设置为 none 会触发回流,这与您想要的完全相反。不做任何事情不会触发回流。将可见性设置为 hidden 也不会触发回流。然而,没有做任何事情容易得多。

然而,最近一个答案(不幸的是,它看起来更像是一个评论甚至是一个问题)声称这display: none;是 Facebook 等网站当前使用的策略,其中垂直滚动几乎是无限的。

值得一提的是,与 OP 在该问题中的描述不同,我网站中的每个可见 div 都是交互式的:用户可以单击、拖动以及对 div 的内容执行其他操作(我相信这会使浏览器重新绘制页面)。

鉴于所有这些信息,我的问题是:display: none;应用于视口上方/下方的 div 会提高性能还是会降低性能?或者它可能没有效果?

html javascript css performance web-performance

19
推荐指数
2
解决办法
4316
查看次数

性能:常规 vs 箭头函数

我们都知道常规函数和箭头函数之间的区别。这不是关于这些差异的问题,而是关于他们的表现的问题。

由于箭头函数既不必创建它们自己的this值,也不必创建它们的arguments,因此它们似乎(至少在直觉上)应该很快。在一个非常简化的基准测试中:

let i;

console.time("regular");
const regular = function(a) {
  return a * a
};
i = 10000;
while (--i) regular(i);
console.timeEnd("regular");

console.time("arrow");
const arrow = a => a * a;
i = 10000;
while (--i) arrow(i);
console.timeEnd("arrow");
Run Code Online (Sandbox Code Playgroud)

在其他条件相同的情况下,箭头函数是否比常规函数更快?而且,如果“是”,差异是否与现实世界相关,或者我们可以将其作为不必要的微观优化而忽略吗?

javascript

7
推荐指数
0
解决办法
155
查看次数

哪些网站在使用我的 GitHub 托管脚本?

假设我有一个foo.js在 GitHub 存储库中命名的 JavaScript 脚本。我需要知道哪些站点(域)正在使用此脚本。因此,例如,如果一个网站www.example.com正在引用我的脚本......

<html>
  <head>
    <script src="https://myGitHubRepo/foo.js"></script>
  </head>
  etc...
</html>
Run Code Online (Sandbox Code Playgroud)

我想获取、跟踪或example.com列为域。更明确地说,我不想跟踪访问的实际用户,www.example.com也不想跟踪他们的 IP 或类似的东西,我只想跟踪或列出在 HTML 中引用我的脚本的站点(域)。那可能吗?


PS:一些假设的解决方案及其问题:

  1. 想到的第一个想法是使用分析工具;然而,尽管我是我的代码的所有者,但我不是包含 repo 的站点的所有者:GitHub 是所有者。因此,使用分析工具似乎是不可能的。
  2. 我无法调用我的服务器:同样,我没有服务器,它是一个 GitHub 存储库。
  3. window.location.hostname脚本中的一个简单将得到我想要的,但它会在客户端得到它。我不知道是否可以将这些信息发回给我……实际上,我什至不知道这是否合法。

html javascript github

7
推荐指数
1
解决办法
294
查看次数

在Safari的控制台中显示数组属性

给出以下代码段:

const myArray = ["foo", "bar", "baz"];
myArray.someProperty = "foobar";
console.log(myArray)
Run Code Online (Sandbox Code Playgroud)

在Safari中,它将仅显示以下内容:

["foo", "bar", "baz"] (3)
Run Code Online (Sandbox Code Playgroud)

在其他浏览器(例如Chrome和Firefox)中,它将显示该someProperty属性以及本机属性,例如length

Array(3)
  0: "foo"
  1: "bar"
  2: "baz"
  someProperty: "foobar"
  length: 3
Run Code Online (Sandbox Code Playgroud)

值得一提的是喜欢的东西console.dirconsole.tableconsole.log(JSON.stringify(myArray))不会为了显示这种性质的工作。

Safari中是否有针对此限制的解决方法?显然我可以做console.log(myArray.someProperty),但是我的主要目标是检查数组具有哪些属性(我不是创建数组的人,而是由JS库创建的),所以这些属性对我来说是未知的。

javascript safari console.log

5
推荐指数
1
解决办法
179
查看次数

isNaN() 真的有必要吗?

根据MDN 第1关于isNaN(强调我的):

与 JavaScript 中所有其他可能的值不同,不可能依靠相等运算符(== 和 ===)来确定一个值是否为 NaN,因为 NaN == NaN 和 NaN === NaN 的计算结果都是错误的。因此, isNaN 函数的必要性

然而,由于它NaN是 JavaScript 中唯一一个与自身不相等的值,因此实际上可以依靠严格相等运算符来明确确定一个值是否为NaN

const value = NaN;
console.log(value === value)
Run Code Online (Sandbox Code Playgroud)

也就是说,对那个 MDN 句子的解释是什么?


PS:我确实理解 MDN 不是官方文档(即 ECMA),这很像 wiki,任何人都可以编辑它。尽管如此,它仍然是一个非常可靠的来源。

1:回答者所述,在发布此问题后,该段已被编辑。

javascript nan

3
推荐指数
1
解决办法
76
查看次数