Benchmark: callbacks: inline function vs inline arrow vs global

Tests:

global add
function addGlobal(a, b) { return a + b; } function myFunc(num) { return addGlobal(num, num+1); } for (let i = 0; i < 10000; i++) { myFunc(i); }
inline add
function myFunc(num) { function addInline(a, b) { return a + b; } return addInline(num, num+1); } for (let i = 0; i < 10000; i++) { myFunc(i); }
inline arrow add
function myFunc(num) { const addInlineArrow = (a, b) => { return a + b; } return addInlineArrow(num, num+1); } for (let i = 0; i < 10000; i++) { myFunc(i); }
global add 2
// same as first one, just to ensure benchmarks are valid function addGlobal(a, b) { return a + b; } function myFunc(num) { return addGlobal(num, num+1); } for (let i = 0; i < 10000; i++) { myFunc(i); }
inline add 2
// same as first one, just to ensure benchmarks are valid function myFunc(num) { function addInline(a, b) { return a + b; } return addInline(num, num+1); } for (let i = 0; i < 10000; i++) { myFunc(i); }
inline arrow add 2
// same as first one, just to ensure benchmarks are valid function myFunc(num) { const addInlineArrow = (a, b) => { return a + b; } return addInlineArrow(num, num+1); } for (let i = 0; i < 10000; i++) { myFunc(i); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
global add
inline add
inline arrow add
global add 2
inline add 2
inline arrow add 2

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36

Browser/OS: Chrome 128 on Windows

View result in a separate tab

Test name	Executions per second
global add	261183.1 Ops/sec
inline add	163484.1 Ops/sec
inline arrow add	206247.7 Ops/sec
global add 2	259380.8 Ops/sec
inline add 2	164230.8 Ops/sec
inline arrow add 2	83061.8 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested.

**Benchmark Definition**

The benchmark measures the performance of three different ways to define a simple addition function inside another function: using an inline function, an arrow function, and a global function reference.

**Options Compared**

1. **Inline Function**: A traditional JavaScript function defined inside another function using the `function` keyword.
2. **Arrow Function**: A concise way of defining small functions using the `=>` operator.
3. **Global Function Reference**: Using a global variable to store the addition function and then referencing it inside another function.

**Pros and Cons**

* **Inline Function**:
	+ Pros: Easy to read and write, can be used in any context where a function is needed.
	+ Cons: Can lead to code bloat if not used carefully, and may cause issues with scope and closure behavior.
* **Arrow Function**:
	+ Pros: Concise, easy to read, and can help avoid explicit `this` references. Also, it's a good way to create small, one-time-use functions.
	+ Cons: Limited control over syntax, may not be suitable for complex logic or conditional statements.
* **Global Function Reference**:
	+ Pros: Simple, fast, and easy to use in certain situations (e.g., when you need to reuse the same function across multiple places).
	+ Cons: Can pollute the global namespace, makes debugging harder due to scope issues, and may lead to naming conflicts.

**Test Cases**

The test cases are designed to measure the performance of each option by running a loop that calls the addition function with different inputs. The differences in performance will likely be small because the operations being performed (addition) are simple and lightweight.

The presence of multiple test cases for each option (`global add`, `inline add`, etc.) is meant to eliminate any variations in results due to minor optimizations or caching effects.

**Other Considerations**

* The use of `const` and `let` variables to define the addition function suggests that the benchmark aims to minimize memory allocation and garbage collection overhead.
* The repeated execution of the same function in a loop (10,000 times) is likely chosen to highlight any performance differences between the options.

**Alternatives**

Other alternatives for defining small functions or adding functionality include:

* Using `methods` on objects
* Creating anonymous functions using `new Function()`
* Leveraging template literals or string interpolation

Keep in mind that these alternatives might not be suitable for all use cases and may have different performance characteristics compared to the options being tested.

Related benchmarks:

callbacks: inline function vs inline arrow vs global (version: 0)

Comparing performance of: global add vs inline add vs inline arrow add vs global add 2 vs inline add 2 vs inline arrow add 2

Created: one year ago by: Guest

Jump to the latest result

global add

inline add

inline arrow add

global add 2

inline add 2

inline arrow add 2

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):