Benchmark: Regex vs Substring vs String manipulation

Script Preparation code:

var color = '#FFFFFF';
var textColor = '';

Tests:

Regex
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(color); if (result !== null) { var R = parseInt(result[1], 16); var G = parseInt(result[2], 16); var B = parseInt(result[3], 16); var luminance = (0.299 * R + 0.587 * G + 0.114 * B) / 255; if (luminance > 0.5) { textColor = '#000000'; } else { textColor = '#FFFFFF'; } }
Substring
if (color.slice(0, 1) === '#') { color = color.slice(1); } var R = parseInt(color.substring(0, 2), 16); var G = parseInt(color.substring(2, 4), 16); var B = parseInt(color.substring(4, 6), 16); if (R && G && B) { var yiq = (R * 299 + G * 587 + B * 114) / 1000; if (yiq >= 128) { textColor = '#000000'; } else { textColor = '#FFFFFF'; } }
Direct string manipulation
if (color.slice(0, 1) === '#') { color = color.slice(1); } var R = parseInt(color[0] + color[1], 16); var G = parseInt(color[2] + color[3], 16); var B = parseInt(color[4] + color[5], 16); if (R && G && B) { var yiq = (R * 299 + G * 587 + B * 114) / 1000; if (yiq >= 128) { textColor = '#000000'; } else { textColor = '#FFFFFF'; } }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Regex
Substring
Direct string manipulation

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/126.0.0.0 Safari/537.36

Browser/OS: Chrome 126 on Windows

View result in a separate tab

Test name	Executions per second
Regex	2185984.8 Ops/sec
Substring	1956624.0 Ops/sec
Direct string manipulation	1547295.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 what is being tested in this benchmark.

The benchmark compares the performance of three different approaches to extract color information from a hexadecimal color code:

1. **Regex**: The first approach uses regular expressions to extract the color values. Specifically, it uses a regex pattern to match the hexadecimal color code and extract the red, green, and blue components.
2. **Substring**: The second approach uses string manipulation to extract the color values. It slices the color code to extract the individual color components.
3. **Direct string manipulation**: The third approach uses direct string manipulation to extract the color values.

Now, let's discuss the pros and cons of each approach:

**Regex**

Pros:

* Flexible and powerful pattern matching capabilities
* Can handle a wide range of input formats

Cons:

* May be slower than other approaches due to the overhead of compiling and executing regular expressions
* Requires careful crafting of the regex pattern to ensure correctness

**Substring**

Pros:

* Simple and straightforward approach that is easy to understand
* Can be fast because it only requires slicing the string

Cons:

* Limited flexibility compared to regex patterns
* May not work correctly for all input formats

**Direct string manipulation**

Pros:

* Fast because it only involves simple arithmetic operations
* Can handle a wide range of input formats without the need for regex or substring manipulation

Cons:

* More complex and error-prone than the other approaches
* May not be as flexible as regex patterns or substring manipulation

The library used in this benchmark is not explicitly mentioned, but based on the code, it appears to be JavaScript. The purpose of the library is to provide a convenient way to work with strings and regular expressions.

As for special JS features or syntax, none are specifically mentioned in the provided code snippets. However, if we were to analyze the latest benchmark results, we might notice that the `exec` method is used with a regex pattern, which suggests that JavaScript's built-in support for regular expressions is being utilized.

Now, let's consider some alternative approaches:

* **Loop-based approach**: Instead of using regex or substring manipulation, an alternative approach could be to use a simple loop to extract the color values.
* **Built-in functions**: Depending on the specific requirements of the benchmark, other built-in JavaScript functions might be used instead of regex or substring manipulation.

Overall, this benchmark provides a good example of how different approaches can be compared and evaluated for performance in a real-world scenario.

Related benchmarks:

Regex vs Substring vs String manipulation (version: 1)

Test what is quickets, 3x substring or 1x regex

Comparing performance of: Regex vs Substring vs Direct string manipulation

Created: 3 years ago by: Registered User

Jump to the latest result

Regex

Substring

Direct string manipulation

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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