Benchmark: URL vs URLSearchParams

Script Preparation code:

var param = "?id=4&benchmark=5832";
var url = "https://www.measurethat.net" + param;
var loop = 10000;

Tests:

URL
new URL(url).searchParams.get("benchmark");
URLSearchParams
new URLSearchParams(param).get('benchmark');

Historical Performance Data aggregated from 37 community runs

Desktop Results:

Chrome 32 runs

URLSearchParams

1.2M/s

URL

805K/s

Fastest: URLSearchParams (1.5x faster)

View exact numbers

✓ URLSearchParams: 1,204,979 ops/sec
• URL: 805,154 ops/sec

Firefox 5 runs

URLSearchParams

1.2M/s

URL

416K/s

Fastest: URLSearchParams (2.8x faster)

View exact numbers

✓ URLSearchParams: 1,156,348 ops/sec
• URL: 416,433 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
URL
URLSearchParams

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; rv:139.0) Gecko/20100101 Firefox/139.0

Browser/OS: Firefox 139 on Windows

View result in a separate tab

URLSearchParams

1.4M/s

URL

416K/s

View exact numbers

Test name	Executions per second
✓ URLSearchParams	1,401,467 Ops/sec
URL	416,433 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided benchmark.

**Benchmark Definition and Preparation Code**

The benchmark is designed to compare the performance of two approaches: using `new URL()` and `new URLSearchParams()`. The preparation code creates two variables, `url` and `param`, where `param` contains a query string with a specific value (`benchmark=5832`). The variable `loop` represents the number of iterations (10,000) for the benchmark.

**Options Compared**

The two options compared are:

1. **URL**: This approach creates a new URL object using `new URL(url)` and then accesses the `searchParams.get()` method to retrieve the value of the "benchmark" query parameter.
2. **URLSearchParams**: This approach creates a new instance of `URLSearchParams` from the `param` string and then accesses the `get('benchmark')` method to retrieve the value of the "benchmark" query parameter.

**Pros and Cons**

1. **URL**:
	* Pros: Can be more efficient for larger query strings, as it avoids creating an additional object.
	* Cons: May not work well with nested queries or complex string manipulation.
2. **URLSearchParams**:
	* Pros: Supports nested queries, complex string manipulation, and provides a more convenient API for working with query parameters.
	* Cons: May be slower due to the creation of an additional object.

In general, if you need to work with simple query strings, `URL` might be a better choice. However, if you need to handle more complex query strings or require a more convenient API, `URLSearchParams` is likely a better option.

**Library and Purpose**

In this benchmark, the library being used is the `URL` interface (a part of the Web APIs). The `URL` interface provides a way to manipulate and inspect URLs in a standardized manner. In this case, it's used to create a new URL object from the `url` variable and then access its query parameters.

**Special JS Feature or Syntax**

There is no special JavaScript feature or syntax being tested in this benchmark. It's purely focused on comparing the performance of two different approaches for accessing query parameters in URLs.

**Other Alternatives**

If you're looking for alternatives to compare, here are a few options:

1. **URL.createObjectURL()**: This method creates a new URL that can be used as a blob or file URL.
2. **URL.reform():**: This method reforms the URL by changing its protocol and hostname.
3. **URLSearchParams.parse()**: This method parses a query string into an object.

Keep in mind that these alternatives might not directly relate to accessing query parameters, but they demonstrate other use cases for the `URL` interface.

URL vs URLSearchParams (version: 0)

Comparing performance of: `URL vs URLSearchParams`

Created: 4 years ago by: Guest

Go to the latest result

URL

URLSearchParams

Historical Performance Data aggregated from 37 community runs

Desktop Results:

Chrome 32 runs

Firefox 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

URL vs URLSearchParams (version: 0)

Comparing performance of: URL vs URLSearchParams

Created: 4 years ago by: Guest

Go to the latest result

URL

URLSearchParams

Historical Performance Data aggregated from 37 community runs

Desktop Results:

Chrome 32 runs

Firefox 5 runs

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: `URL vs URLSearchParams`