简体   繁体   English

函数初始化位置之间的性能差异[JavaScript]

[英]Performance difference between function initialization locations [JavaScript]

I am curious about the performance difference between initializing a function outside a loop vs inline: 我对循环外初始化与内联初始化之间的性能差异感到好奇:

Outside the loop: 循环外:

const reducer = (acc, val) => {
  // work
};

largeArray.reduce(reducer);

Inline: 排队:

largeArray.reduce((acc, val) => {
  // work
});

I encounter this kind of situation regularly, and, unless I'm going to reuse the function, it seems useful to avoid introducing another variable into my scope by using the inline version. 我经常遇到这种情况,除非我要重用该函数,否则避免使用内联版本将另一个变量引入我的作用域似乎很有用。

Is there a performance difference in these two examples or does the JS engine optimize them identically? 这两个示例在性能上是否存在差异,或者JS引擎是否对它们进行了相同的优化?

For example: is the inline function being created every time the loop runs and then garbage collected? 例如:是否在每次循环运行时创建内联函数,然后进行垃圾回收? And if so: 如果是这样:

  • What kind of effect does this have on performance, and 这会对性能产生什么样的影响,并且
  • Does the size of the function affect this? 函数的大小是否会对此产生影响? For example, a function that is 200 vs 30_000 unicode characters. 例如,一个200与30_000 Unicode字符的函数。

Are there any other differences or things I'm not considering? 还有其他差异或我不在考虑的事情吗?

Hopefully you understand my train of thought and can provide some insight about this. 希望您理解我的思路,并可以对此提供一些见识。 I realize that I can read all of the docs and source code for V8 or other engines, and I would get my answer, but that seems like an overwhelming task to understand this concept. 我意识到我可以阅读V8或其他引擎的所有文档和源代码,并且可以得到答案,但这似乎是理解该概念的一项艰巨任务。

I did run test on jsben 我确实在jsben上进行了测试

SET1(random used twice): http://jsben.ch/8Dukx SET1(随机使用两次): http : //jsben.ch/8Dukx

SET2:(used once): http://jsben.ch/SnvxV SET2 :(使用一次): http : //jsben.ch/SnvxV

Setup 设定

const arr = [ ...Array(100).keys() ];
const reducer = (acc, cur) => (acc + cur);

Test 1 测试1

let sumInline = arr.reduce((acc, cur) => (acc + cur), 0);
let sumInlineHalf = arr.slice(0, 50).reduce((acc, cur) => (acc + cur), 0);

console.log(sumInline, sumInlineHalf);

Test 2 测试2

let sumOutline = arr.reduce(reducer, 0);
let sumOutlineHalf = arr.slice(0, 50).reduce(reducer, 0);

console.log(sumOutline, sumOutlineHalf);

Be surprised 惊奇

What kind of effect does this have on performance, and 这会对性能产生什么样的影响,并且

None. 没有。

Does the size of the function affect this? 函数的大小是否会对此产生影响? For example, a function that is 200 vs 30_000 unicode characters. 例如,一个200与30_000 Unicode字符的函数。

Functions aren't executed as "unicode characters". 函数不会作为“ unicode字符”执行。 It doesn't matter how "long" the code is. 代码有多“长”无关紧要。

Are there any other differences or things I'm not considering? 还有其他差异或我不在考虑的事情吗?

A very important one: Code is written for humans , not computers. 一个非常重要的代码:代码是为人类而不是计算机编写的。 And why do you even ask me? 为什么还要问我?

is the inline function being created every time the loop runs and then garbage collected? 每次循环运行时都会创建内联函数,然后再进行垃圾回收吗?

That would be unneccessary and slow. 那将是不必要和缓慢的。 So probably: no. 大概吧:不。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM