Is RxJS faster than imperative?
<p>I'm newer in functional programming and functional reactive programming.</p>

<p>I read a lot of times <strong>the great power of functional reactive programming</strong>. </p>

<p>Okey; is readable, avoid side effects, etc.</p>

<p>But... I don't know how to improve my code in functional/reactive way to execute faster than imperative way. <strong>Is it possible? Maybe I miss something?</strong> Because in my functional programming code is iterating for every task: for filter, map, reduce... And this is slower. <strong>Is possible to do all things iterating once?</strong> Maybe using <code>compose()</code>? </p>

<p>Thanks.</p>

<p><strong>Performance test: Imperative vs FP vs FRP</strong></p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var array = [];
var i, l;

//INIT ARRAY
for (i = 0; i &lt; 15000; i += 1) {
  array[i] = i;
}

// WITH IMPERATIVE
console.time("IMPERATIVE");
var sum = 0;
var a;
var result = [];
for (i = 0, l = array.length; i &lt; l; i += 1) {
  a = array[i];
  if (a % 2 === 0) {
    result.push(a * 10);
    sum += a * 10;
  }
}
console.log(sum);
console.timeEnd("IMPERATIVE");

// WITH DECLARATIVE: FUNCTIONAL PROGRAMMING
console.time("FUNCTIONAL");
var r = array
  .filter(function(x) {
    return x % 2 === 0
  })
  .map(function(x) {
    return x * 10
  })
  .reduce(function(x, y) {
    return x + y
  })

console.log(r);
console.timeEnd("FUNCTIONAL");

//WITH DELARATIVE: FUNCTIONAL REACTIVE PROGRAMMING
console.time("REACTIVE RXJS 4")
Rx.Observable
  .fromArray(array)
  .filter(function(x) {
    return x % 2 === 0
  })
  .map(function(x) {
    return x * 10
  })
  .reduce(function(x, y) {
    return x + y
  })
  .subscribe(function(x) {
    console.log(x)
  });
console.timeEnd("REACTIVE RXJS 4");

console.time("REACTIVE RXJS 6")
rxjs.of(array).pipe(
    rxjs.operators.filter(function(x) {
      return x % 2 === 0
    }),
    rxjs.operators.map(function(x) {
      return x * 10
    }),
    rxjs.operators.reduce(function(x, y) {
      return x + y
    }))
  .subscribe(function(x) {
    console.log(x)
  });
console.timeEnd("REACTIVE RXJS 6");</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.1.0/rxjs.umd.js"&gt;&lt;/script&gt;
&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.all.js"&gt;&lt;/script&gt;</code></pre>
</div>
</div>
</p>

<p><strong>Output:</strong></p>

<p><a href="https://i.imgur.com/MJ1G1az.png" rel="nofollow noreferrer"><img src="https://i.imgur.com/MJ1G1az.png" alt="Output"></a></p>