Ping 02/Nov/2020

(functional) reactive 관련들을 다시 찾아 보고 있다.

예전에 webdev은 아니고 백엔드를 위해서 rxjs 을 쓸 일이 있었었고 꽤 재밌었다. node.js에서 async/await 이전에 동시성 처리를 하기에 유용하게 쓸 수 있었었고, 실은 그냥 monad이어서 조금만 이해를 하고 사용하면 여러모로 편리했었다.

https://github.com/stoeffel/awesome-frp-js 여기에 보면 rxjs이외에도 다른 js을 위한 FRP라이브러리들이 많이 생겼었다.

그 중에 흥미가 있어서 bacon.js 을 읽고 rxjs에서 만들어 본 작은 예제 프로젝트를 다시 작성해봤다. 깔끔했다.

rxjs으로 작성했었던 작은 예제는 다음과 같다.

  import { fromEvent, Subject } from 'rxjs';
  // eslint-disable-next-line object-curly-newline
  import { debounceTime, mapTo, scan, map } from 'rxjs/operators';
  import jquery from 'jquery';

  const counter$ = new Subject();
  counter$
    .pipe(
      scan((n, acc) => n + acc, 0),
      debounceTime(100),
    )
    .subscribe((count) => jquery('#count').text(count));

  const counter2$ = new Subject();
  counter2$
    .pipe(scan((n, acc) => n + acc, 0))
    .subscribe((count) => jquery('#count2').text(count));

  const increase$ = fromEvent(jquery('#increase'), 'click').pipe(mapTo(1));
  const decrease$ = fromEvent(jquery('#decrease'), 'click').pipe(mapTo(-1));

  increase$.subscribe(counter$);

  increase$.pipe(map((n) => n * 10)).subscribe(counter2$);

  decrease$.subscribe(counter$);

  decrease$.pipe(map((n) => n * 10)).subscribe(counter2$);

(package.json, webpack.config.js, 관련 html 파일 등은 생략했다.)

Observable을 input/output으로 사용하고 서로 연결하는 여러 가지 패턴들을 잘 수용할 수 있을지 테스트 해보았다.

하지만 어차피 rxjs을 어느 정도 이해하고 있어서 굳이 전환할 생각은 들지 않는다.

여러 가지로 js으로 재밌게 쓸만한 것이 많아진 시대인 것 같다.

더 흥미로운 생각은, 이런 거의 대부분의 것들이 실은 예전에도 가능한 것들이었다. 예를 들어, FRP라이브러리를 만들거나 대부분의 shims 같은 것들이 실은 js이 유연함으로 인해서 예전에도 충분히 구현이 가능했었으리라 생각했다.¹

하지만 당시에(2007~2010년 정도?) js으로 이런 것들을 조금 만들고 있으면, 어떤 이들은 그 자신이 "진지한" 언어라고 생각하는 그런 언어에 비해 다른 루비나 리습, js같은 언어는 열등하다고 생각하고, 또 그런 것들에 내가 열심인 이유는 단지 내가 fanboy이어서 그런 것들으로 코딩을 한다고 믿던 이는 우습게 생각했었던 것 같다. 하지만 내가 지금에 와서 생각해 보면 그런 이가 믿던 '진지한 언어'에 대해서 그런 이가 가장 fanboy였었던 것은 아닌가 싶다.