RxJS 에 대한 고민과 Quick start RxJS 서평

책도 읽은 겸rxjs 의 도입에 대한 고민과, 책에 대한 후기를 남긴다.

RxJS 도입의 어려움

대부분의 작업을 혼자 함에도 불구하고유독 rxjs 만이 더욱 도입하기가 어려웠다. 공식 문서를 통해 메서드들을 영어 단어 외우는 느낌으로 출, 퇴근 길에 보면서 다니기도 했으나 역시 코드를 작성하는 것이 아니면 기억이 나지 않는다.

rxjs 는 접근하기도 사용하기도 어려웠다. rxjs 의 도입 허들에는 3가지 정도의 이슈가 있을 것이라 생각됐다.

  • 필요성
  • 러닝 커브
  • 감염적 코드

필요성

일단 필요성이다. rxjs 가 없이도 잘 구현할 수 있으며 오히려 도입했는데도 불구하고 지식이 모자라면 유지 보수에서 어려움을 겪는다. 편리한 메서드들이 많이 있지만 lodash 에서도 충분히 지원되며 EventEmitter 클래스등을 이용하면 독립성을 가지는 코드를 가질 수 있다. 코드가 길어지는 경향이 있지만 충분했고, 익숙했다.

하지만 ramda 의 도입 필요성과 마찬가지로 rxjs 를 통해 많은 비동기 처리를 독립적으로 처리하고, 직관적이면서도 더 적은 코드를 통해 생산성에 니즈는 언제나 있다.

러닝 커브

일단 홈페이지를 열면 너무 많은 메서드들이 나온다. rxjs 의 도입 이슈는 FP(ramda.js) 를 도입할 때와 같다. 코드가 줄어들고 가독성이 확보되며 직관적이다. 반면 이를 위한 많은 메서드들도 방대해서 도입이 쉽지않다.

그러나 ramda 를 통해 꽤나 익숙해진 메서드들이 있었고, FRP 라이브러리로 불리는 rxjs 에서도 많이 쓰였다.

pluck, map, tap, take, first 등등

감염적 코드

어쩌다 보니 영문을 번역한 듯한 문구가 됐는데, 비동기 처리는 관련 코드를 시작하면 상용하는 측에서도 패턴이 강제되는 연속성이 있다. 이에 대한 가장 유명한 예가 Callback hell 이다.

Callback hell, Promise, Async-Await

1
2
3
4
5
6
7
asyncWork(_, (err, data) => {
asyncWork(data, (err, data) => {
asyncWork(data, (err, data) => {
// Callback hell
}
})
})

Promise 도 다르지 않다.

1
2
3
asyncWork
.then(data => asyncWork(data))
.then(data => asyncWork(data))

async-await 을 보자.

1
2
3
4
5
async function asyncWork(data) {
data = await asyncWork(data)
data = await asyncWork(data)
return data // Promise 반환
}

코드가 보기 좋은가, 안좋은가 대한 이야기가 아니라 패턴의 강제성에 대한 이야기다. 가독성은 좋아지고 있다. 그럴드 수 밖에 없지만 어쨋건 Promise 에 한번 발을 들이면 Promise 체인 패턴에 묶인다.

RxJS 는?

이 부분에 있어서 오히려 rxjsPromise 체인의 형태와 유사한데 뭐 워낙 익숙해서 이제 이런 감염성은 문제가 되지 않는 것 같기도하다.

Quick start RxJS

rxjs

출근 버스에서 3일 봤다. 3장은 다 보지 못했으나 버스내에서 주어진 시간이 45분 정도인데 그 시간에 한장을 다 읽을 수 있었다(3장으로 구성 되어 있다).

책 읽는 속도가 느린 편임에도 불구하고 잘씌여진 책은 잘 읽히는구나 라고 생각했다. 아는 개념들에 대해서는 패스하고 RxJS 자체에 집중에서 책을 읽었을 때의 얘기다.

1장은 RxJS 가 나오게 된 배경, 2장은 RxJS 자체에 대해 작은 프로젝트를 진행해가며 그때마다 필요한 메서드를 추가하면서 설명이 진행된다. 3장은 배운 것을 바탕으로 실제 RxJS를 사용하는 프로젝트를 구현하는데 초점을 맞춘다.

또 좋았던 점은 책이 최신을 반영하기 위해 RxJS 6.x 를 반영했다는 점이다. 잘은 모르지만 큰 변화중 하나는 체인형태의 메서드 콜 방식에서 파이프라인 형태로 사용 방식이 변경됬다는 점이라고 생각되며 코어의 가벼움을 유지하면서 순수함수인 오퍼레이터를 프로토타입 체인에 유지할 필요가 없다고 생각했던 것 같다. 개인적으로 매우 바람직한 방향이라고 생각된다.

독서의 순서

책을 읽을때도 프로젝트를 진행할때도 에너지가 있어서 에너지가 많은 초반을 서론에서 빼고싶지 않았다. 대충 훑어보고 바로 2장으로 들어갔다. 1장은 깃헙에 공개되어 꽤나 읽은 내용이 있는 것도 한 몫했다.

Observable 이 무엇인지, Subject 와는 어떻게 다른지 잘 설명해주고 있다. rxjs 를 이해함에 있어서 대단히 중요한 개념이고 이를 가지고 여러 메소드 들이 파생된다. 책에서 진행하는 프로젝트가 진행됨에 따라 필요한 메서드들을 적시 설명하며 지루하지 않으면서도 필요한 설명은 모두 하고 있다.

2장 -> 1장 -> 3장 순서로 읽었는데 메인은 2장이다. 3장은 실제 프로젝트인데 2장에서 배운 범위를 넘어가지 않는 점이 정말 좋았다. 공부와 프로젝트와 완전히 분리되어있다. 부록들도 훌륭하다 이해를 높일 수 있는 결코 가볍지 않은 주제를 표로 잘 풀어준다. 꼭필요한 메소드는 설명하고간다.

2장은 두번 읽어야한다.

https://www.youtube.com/watch?v=3LKMwkuK0ZE 추가적으로 벤 아저씨의 영상을 보면 이해에 더 많은 도움이 된다.

코드를 넘어