Benchmark: sumOfEventNumbers-vanilla-vs-rxjs-7

HTML Preparation code:

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

Script Preparation code:

function onlyEven(value) {return value % 2 == 0;}
function timesTwo(value) {return value * 2;}
function sum(a, b) {return a + b;}

Tests:

vanilla
Array.from(Array(1000000).keys()) .filter(onlyEven) .map(timesTwo) .reduce(sum, 0);
rxjs
let { from } = rxjs; let { filter, map, reduce } = rxjs.operators; from(Array.from(Array(1000000).keys())).pipe( filter(onlyEven), map(timesTwo), reduce(sum, 0) );

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

rxjs

62/s

vanilla

31/s

Fastest: rxjs (2.0x faster)

View exact numbers

✓ rxjs: 62 ops/sec
• vanilla: 31 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
vanilla
rxjs

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

rxjs

64/s

vanilla

34/s

View exact numbers

Test name	Executions per second
✓ rxjs	64 Ops/sec
vanilla	34 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 Overview**

The benchmark is comparing two approaches to summing up even numbers from 0 to 1,000,000 using JavaScript:

1. **Vanilla JavaScript**: This approach uses only built-in JavaScript functions and no external libraries.
2. **RxJS (Reactive Extensions for JavaScript)**: This approach uses the RxJS library, which provides a reactive programming model.

**Test Cases**

There are two test cases:

1. **Vanilla JavaScript**: The test case uses an array of 1,000,000 numbers generated by `Array.from(Array(1000000).keys())`. It then applies three functions to this array:
	* `onlyEven`: filters out odd numbers.
	* `timesTwo`: doubles each remaining number.
	* `sum`: adds up all the doubled even numbers using a custom implementation (`a + b`).
2. **RxJS**: The test case uses the RxJS library and applies the same three functions to an observable stream generated from the array:
	* `from(Array.from(Array(1000000).keys()))`: creates an observable stream from the array.
	* `filter(onlyEven)`, `map(timesTwo)`, and `reduce(sum, 0)`: apply the filtering, mapping, and reduction operations to the stream.

**Library and Purpose**

RxJS is a library for reactive programming in JavaScript. It provides a way to handle asynchronous data streams and events in a declarative, composable manner. In this benchmark, RxJS is used to create an observable stream from an array and apply transformations to it using its operators (`filter`, `map`, and `reduce`).

**Special JS Features or Syntax**

None of the test cases use any special JavaScript features or syntax.

**Pros and Cons of Different Approaches**

1. **Vanilla JavaScript**:
	* Pros: No external dependencies, easy to understand and implement.
	* Cons: May be slower due to the need for explicit looping and manual data processing.
2. **RxJS**:
	* Pros: Provides a declarative, composable way of handling asynchronous data streams and events, which can lead to more efficient and elegant code.
	* Cons: Requires knowledge of RxJS and its operators, may introduce overhead due to the creation and management of observable streams.

**Other Alternatives**

If you're looking for alternative libraries or approaches for reactive programming in JavaScript, consider:

1. **Lodash**: Provides a large collection of functional helpers, including those similar to RxJS operators.
2. **Preact**: A lightweight alternative to React that provides a similar reactive programming model.
3. **RxJava** and **Rx.NET**: Similar reactive programming libraries for Java and .NET, respectively.

Keep in mind that the choice of library or approach depends on your specific use case, project requirements, and personal preference.

sumOfEventNumbers-vanilla-vs-rxjs-7 (version: 0)

Comparing performance of: `vanilla vs rxjs`

Created: 4 years ago by: Guest

Go to the latest result

vanilla

rxjs

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 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):

sumOfEventNumbers-vanilla-vs-rxjs-7 (version: 0)

Comparing performance of: vanilla vs rxjs

Created: 4 years ago by: Guest

Go to the latest result

vanilla

rxjs

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 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: `vanilla vs rxjs`