추석 연휴를 모두 보내고난 다음 본격적으로 주특기를 공부하는 주가 시작되었다. 이번주는 리액트와 리덕스, 그리고 파이어베이스를 이용하여 과제를 수행해야한다. 과제 마감일까지 조금 남았지만, 한 주를 마무리하는 시점에서 나의 방향이 똑바로 가고있는지 체크하기 위해 WIL을 작성해본다.
DOM
2013년, 페이스북은 리액트라는 라이브러리를 JSConf를 통하여 세상에 공개하였다. 그들이 내세웠던 리액트의 가장 큰 특징은 Virtual-DOM이라는 개념을 창안하였다는 점. 그리고 VDOM은 RealDOM보다 빠르다는 점이다. VDOM과 Component based rendering, Declarative Paradigm은 리액트가 현재도 가장 인기있는 라이브러리 중 하나가 될 수 있는 좋은 점이라고 생각이 된다. DOM은 VDOM보다 느리다고 이야기하는데, 그 이유는 무엇일까?
노드가 기껏해야 10개 내외인 아주 작은 유닛이 아니라, 10000개 이상의 노드가 존재하는 SPA를 바닐라자바스크립트로 만든다고 생각해보자. 노드 중 하나가 업데이트가 되면, DOM Tree는 이른바 Dirty Checking을 통하여 모든 노드를 순회하여 업데이트가 되었는지 확인한다. 그리고 브라우저는 업데이트된 상태에 기반하여 다시 레이아웃을 그려주어야할 것이다. 단 하나의 노드만을 바꿔주는데, 전체 페이지를 다시 리페인트하는 것은 많은 비용을 수반할 것이다. 이에 반하여 VDOM은 Plain Object Render tree만을 비교하여 업데이트가 되어야 할 부분만 업데이트를 해준다는 점에서 성능상 DOM보다 우위에 있다고 말할 수 있을 것이다.
그러나 케바케라는 말이 있듯이 Render tree를 만드는 과정에 큰 비용이 발생하고, 이를 적절히 처리를 해주지 못한다면 결과물을 렌더링하는 시점에서 DOM과 비교했을 때 그렇게 빠르지 않을 수 있다는 점도 생각을 해보아야겠다고 느꼈다.
서버리스
강의를 들으면서 파이어베이스의 매력에 푹 빠져버렸다. 명쾌하게 설명해주시는 튜터님의 강의력도 물론이지만, 서버 단에서 하는 작업을 하지 않고 사용을 할 수 있다는게 참 좋은 것 같다. 현재는 파이어스토어를 사용하여 정적 데이터만 CRUD하고 있으나, 파이어베이스에서 제공하고있는 서비스들이 좋은게 정말 많아서 이걸 이용해보고 싶은 욕구가 엄청 생겨난다. 이번주 과제에 직접적으로 언급을 하지는 않았지만 파이어베이스에서 제공하는 Authentication 서비스를 이용하여 구글 로그인을 달아보는 것을 최종 목표로 삼으려고 한다.
프론트엔드 개발자에게는 서버리스라는 개념이 삶의 질을 윤택하게 해줄 수 있다고 생각한다. 그러나 내가 회사에 들어가면 그 회사가 파이어베이스를 쓰는지에 대해서는 물음표일 것이다. 파이어베이스를 사용하면서 이 사이트의 가이드라인에 있던 단어가 무엇인지부터 차근차근히 살펴보아야겠다.
