Benchmark: Lodash clamp VS Math.min, Math.max (Conditional)

HTML Preparation code:

<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.7.11/lodash.min.js'></script>

Script Preparation code:

const clamp = (number, boundOne, boundTwo) => {
    if (!boundTwo) {
        return Math.max(number, boundOne) === boundOne ? number : boundOne;
    } else if (Math.min(number, boundOne) === number) {
        return boundOne;
    } else if (Math.max(number, boundTwo) === number) {
        return boundTwo;
    }
    return number;
};

Tests:

Lodash clamp
_.clamp(150, 10, 100);
Manual Math.min Math.max
Math.min(Math.max(150, 10), 100);
Conditional Math clamp
((number = 150, boundOne = 10, boundTwo = 100) => { if (!boundTwo) { return Math.max(number, boundOne) === boundOne ? number : boundOne; } else if (Math.min(number, boundOne) === number) { return boundOne; } else if (Math.max(number, boundTwo) === number) { return boundTwo; } return number; })();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash clamp
Manual Math.min Math.max
Conditional Math clamp

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 months ago)

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

Browser/OS: Chrome 147 on Windows

View result in a separate tab

Manual Math.min Math.max

169.9M/s

Conditional Math clamp

166.8M/s

Lodash clamp

58.6M/s

View exact numbers

Test name	Executions per second
✓ Manual Math.min Math.max	169,907,488 Ops/sec
Conditional Math clamp	166,829,616 Ops/sec
Lodash clamp	58,578,200 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into explaining the benchmark.

**Overview**

The provided JSON represents a JavaScript microbenchmarking test case for the `clamp` function, which is used to limit a value within a specified range. The test compares three different approaches:

1. Using the Lodash library (`_clamp`)
2. Manual implementation of `Math.min` and `Math.max`
3. Conditional implementation of `Math.clamp`

**Lodash Library**

The Lodash library is a popular JavaScript utility library that provides a wide range of functions for tasks like array manipulation, string processing, and more. In this case, the `_clamp` function is used to limit a value within a specified range.

**Manual Implementation**

The manual implementation of `Math.min` and `Math.max` involves using these built-in functions to find the minimum or maximum value between two numbers. This approach requires explicit function calls and comparisons.

**Conditional Implementation**

The conditional implementation of `Math.clamp` is similar to the Lodash `_clamp` function but uses a more concise syntax. It checks for different conditions to determine which bound to return.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

* **Lodash `_clamp`**: Pros:
	+ Shorter code
	+ Easier to read and maintain
	+ Reduces boilerplate code
* Cons:
	+ Adds external library dependency
	+ May incur overhead due to function call and object lookup
* **Manual Implementation**:
	+ Pros:
		- No external dependencies
		- Can be optimized for specific use cases
		- Understood by all developers familiar with `Math.min` and `Math.max`
	+ Cons:
		- Longer code
		- More prone to errors due to increased complexity
		- May require more manual optimization efforts
* **Conditional Implementation**:
	+ Pros:
		- Similar syntax to Lodash `_clamp`
		- Easy to understand for developers familiar with conditional statements
	+ Cons:
		- May not be as concise as Lodash `_clamp`
		- Limited readability for developers unfamiliar with the syntax

**Special JS Feature**

The provided benchmark uses a feature called "arrow functions" (introduced in ECMAScript 2015). An arrow function is a shorthand way of defining small functions. In this case, the conditional implementation uses an arrow function to define the `clamp` function.

**Other Alternatives**

Some other alternatives for implementing `clamp` functions include:

* Using the `Math.floor` and `Math.ceil` functions to achieve similar results
* Implementing a custom binary search algorithm to find the closest bound
* Utilizing GPU acceleration using WebGPU or WebGL

It's essential to note that the choice of implementation depends on specific requirements, such as performance, code readability, and maintainability.

Lodash clamp VS Math.min, Math.max (Conditional) (version: 0)

Comparing performance of: `Lodash clamp vs Manual Math.min Math.max vs Conditional Math clamp`

Created: 4 years ago by: Guest

Go to the latest result

Lodash clamp

Manual Math.min Math.max

Conditional Math clamp

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Lodash clamp VS Math.min, Math.max (Conditional) (version: 0)

Comparing performance of: Lodash clamp vs Manual Math.min Math.max vs Conditional Math clamp

Created: 4 years ago by: Guest

Go to the latest result

Lodash clamp

Manual Math.min Math.max

Conditional Math clamp

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Lodash clamp vs Manual Math.min Math.max vs Conditional Math clamp`