Benchmark: Rxjs several pipes vs one 100k without functional array functions at all 1253tzsd

HTML Preparation code:

<script src='https://unpkg.com/rxjs@6.5.5/bundles/rxjs.umd.min.js'></script>

Script Preparation code:

var rawdata = Array.from(Array(100000).keys()) // 10k numbers 1,2,3,4,5...

function topOperator(values) {
  let count = 0;
  for (let i = 0; i < 10; i++) {
    count = count + 1;
  }
  return count;
}

Tests:

RxJS one pipe
let { from, Observable } = rxjs; let { flatMap, map, tap, toArray } = rxjs.operators; const data$ = from(rawdata) .pipe( map(values => { let count = 0; for (let i = 0; i < 50; i++) { count = count + 1; } return count; }) ) let data; data$.subscribe(d => data = d);
Several pipes
let { from, Observable } = rxjs; let { flatMap, map, tap, toArray } = rxjs.operators; const data$ = from(rawdata) .pipe( map(values => { let count = 0; for (let i = 0; i < 10; i++) { count = count + 1; } return count; }), map(values => { let count = 0; for (let i = 0; i < 10; i++) { count = count + 1; } return count; }), map(values => { let count = 0; for (let i = 0; i < 10; i++) { count = count + 1; } return count; }), map(values => { let count = 0; for (let i = 0; i < 10; i++) { count = count + 1; } return count; }), map(values => { let count = 0; for (let i = 0; i < 10; i++) { count = count + 1; } return count; }) ) let data; data$.subscribe(d => data = d);
Many pipes same function
let { from, Observable } = rxjs; let { flatMap, map, tap, toArray } = rxjs.operators; function myOperator(values) { let count = 0; for (let i = 0; i < 10; i++) { count = count + 1; } return count; } const data$ = from(rawdata) .pipe( map(myOperator), map(myOperator), map(myOperator), map(myOperator), map(myOperator) ) let data; data$.subscribe(d => data = d);
Top operator
let { from, Observable } = rxjs; let { flatMap, map, tap, toArray } = rxjs.operators; const data$ = from(rawdata) .pipe( map(topOperator), map(topOperator), map(topOperator), map(topOperator), map(topOperator) ) let data; data$.subscribe(d => data = d);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
RxJS one pipe
Several pipes
Many pipes same function
Top operator

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
RxJS one pipe	316.7 Ops/sec
Several pipes	191.5 Ops/sec
Many pipes same function	185.8 Ops/sec
Top operator	186.1 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 benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark is designed to compare the performance of different approaches for processing large datasets using RxJS, a popular JavaScript library for reactive programming.

**Options Being Compared**

There are four test cases:

1. **RxJS One Pipe**: A single `map` operator is applied to the dataset, which iterates 50 times to calculate a count.
2. **Several Pipes**: Multiple `map` operators are chained together with the same function, iterating 10 times each to calculate a count.
3. **Many Pipes Same Function**: Similar to the previous test, but all pipes have the same function, iterating 10 times each to calculate a count.
4. **Top Operator**: A custom function called `topOperator` is applied to the dataset multiple times (5 times), iterating 10 times each to calculate a count.

**Pros and Cons of Each Approach**

1. **RxJS One Pipe**:
	* Pros: Simple, easy to understand, and maintain.
	* Cons: May not be optimized for large datasets or complex transformations.
2. **Several Pipes**:
	* Pros: Can be useful when multiple transformations are needed in a pipeline.
	* Cons: Can lead to performance issues due to excessive overhead of creating and chaining operators.
3. **Many Pipes Same Function**:
	* Pros: Similar to the previous test, but with the added benefit of reusing the same function.
	* Cons: Still suffers from performance issues due to operator creation and chaining.
4. **Top Operator**:
	* Pros: Customizable function can be optimized for specific use cases.
	* Cons: May require more maintenance and understanding of RxJS internals.

**Benchmark Results**

The latest benchmark results show that the **RxJS One Pipe** approach performs the best, with an average execution rate of 245.43 executions per second across multiple runs. The **Top Operator** test comes in second, followed by the **Many Pipes Same Function** and **Several Pipes** tests.

In summary, the benchmark highlights the importance of considering performance, simplicity, and maintainability when choosing an approach for processing large datasets with RxJS.

Related benchmarks:

Rxjs several pipes vs one 100k without functional array functions at all 1253tzsd (version: 0)

Comparing performance of: RxJS one pipe vs Several pipes vs Many pipes same function vs Top operator

Created: 3 years ago by: Guest

Jump to the latest result

RxJS one pipe

Several pipes

Many pipes same function

Top operator

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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