한빛미디어 서평단 <나는리뷰어다> 활동을 위해서 책을 협찬 받아 작성된 서평입니다.
최근 CSV나 User-Agent 관련 글을 쓰면서 기술 변화의 흐름을 알게 되면 현재의 기술을 이해하는 데에 도움이 된다는 걸 느꼈다. Windows에서 CSV의 한글이 깨지는 것은 초기 Windows의 유니코드 채택과 관련이 있었고, User-Agent가 난잡해진 것은 초기의 브라우저 경쟁과 기업의 욕망이 얽혀 있었다. 내가 처음 모던 웹 개발 환경에서 프레임워크를 접한 건 Vue 2를 통해서였는데, 당시 공식 문서에서 라이프사이클을 봐도 이해하기 어려웠다. 만약 그때 DOM이 어떻게 그려지고, 왜 가상 DOM을 사용하게 되었는지에 대한 간략한 히스토리를 알고 있었다면 더 쉽게 이해할 수 있지 않았을까 싶다. 여전히 React의 재조정(Reconciliation)과 같은 개념들은 다소 까다롭게 느껴지지만, 기술의 흐름을 알게 되면 좀 더 쉽게 이해할 수 있을 것 같다는 기대가 있었다. 이 책을 읽게 된 것도 그런 기대의 연장선에 있다.
프레임워크를 사용하다 보면 왜 React나 Vue, 혹은 다양한 빌드도구를 사용하게 되었을까 싶은 궁금증이 생긴다. 사실 웹사이트는 메모장 하나로도 만들 수 있다. 하지만 라이브러리나 프레임워크를 사용하는 데에는 다 이유가 있고, 그 이유는 보통 히스토리를 따라가다 보면 자연스럽게 보이는 경우가 많았다. 첫 번째 챕터에서는 바로 그 히스토리에 대한 이야기를 한다. React가 등장하기 이전의 세계를 설명하며 어떤 점이 불편했고, 이를 어떻게 개선하기 위해 React를 사용하게 되었는지를 다룬다. jQuery는 실제로 사용했고 최근에도 일부 레거시가 있는 프로젝트에서 사용하고 있어 익숙하지만, Backbone과 같은 라이브러리는 이름만 들어 본 정도였다. 이 챕터에서 그러한 라이브러리들의 등장 배경을 천천히 설명해 주어 이해하는 데 도움이 되었다. 최근에도 라이브러리를 적용하면서 느끼지만 기술은 필요에 의해서 나오는 것이고, 그 필요성을 이해하면 기술을 더 본질적으로 이해하는 데에 도움이 된다. 그런 면에서 첫 번째 챕터는 React를 더 잘 쓰기 위한 구체적인 무언가를 배운다기보다는 전체의 큰 흐름을 이해하는 데에 도움이 되는 챕터라고 생각한다.
다음 챕터로 JSX를 이야기한다. 프론트엔드 개발자라면 기술 면접을 준비하면서 JSX에 대해 한 번쯤 정리해 본 경험이 있을 것이고 나 역시 그런 과정을 겪었다. 막연히 처음 React를 접했을 땐 JSX를 무조건 사용해야 하는 줄 알았는데, 이후 JSX 없이 사용하는 걸 보고 좀 더 이해의 폭을 넓혔던 기억이 있다. 그 지점을 이 챕터에서 설명하고 있다. 구문 분석기가 JSX 프라그마를 확인하고 분석하는 방식과 최종적으로 변환된 JavaScript 코드에 대한 설명, 그리고 JSX 없이 사용되는 방식에 대한 설명을 이어간다.
가상 DOM에 대한 설명도 흥미롭다. document.querySelector보다 document.getElementById가 별도의 유효성 검사가 필요 없고 특정성이 높아 더 효율적인 작업이라는 설명에서 시작하는데, 막연히 ID는 고유하기 때문에 그러겠거니 하는 짐작을 넘어서 명확하게 인지하지 못하던 부분을 긁어주는 느낌이 있다. 가상 DOM을 단순히 기술적인 개념으로서의 설명이 아닌 왜 사용하게 되었는지 그 효율에 대한 이야기로 풀고 있어서 좀 더 이해하기 수월했다.
5장부터는 React 기술에 대한 구체적인 내용을 다룬다. ReactMemo, Lazy Loading, Suspense와 같은 개념부터 useState, useReducer를 활용하는 방식까지 실제 실무와 직접적으로 연결된 내용이 나온다. 기존에는 특정 패턴을 실무에 적용하면서도 어떻게 작동하는지, 왜 이걸 적용하는지, 이 상황에서 이게 최선인지 명확히 파악 못 하는 경우가 있었는데, 이 챕터를 통해 좀 더 면밀하게 과정을 이해할 수 있었다. 재차 읽는다면 이 챕터를 좀 더 집중해서 볼 생각이다.
이 책의 제목에 ‘전문가를 위한’ 혹은 ‘Fluent’라는 표현이 들어간 이유는 후반부 챕터에서 더욱 드러난다. 서버 사이드로 구현하는 React의 구성부터 동시성에 대한 이야기를 그다음 챕터로 이어 나가고 있고, 그 이후에는 다른 프레임워크를 소개하고 그에 따른 트레이드오프 등의 설명을 덧붙이면서 좀 더 폭넓은 시각을 제공한다. 개인적으로는 대체제에 대한 설명은 좀 더 간결해도 괜찮지 않았을까 하는 생각이 든다. 트레이드오프는 실제로 사용하면서 느끼는 편이 좋다고 생각하고, 독자의 목적이 React에 대한 심화적인 이해라면 특별히 메리트를 느끼지 못할 수도 있다. 물론 다른 프레임워크를 이해하는 것이 React 자체를 더 깊이 이해하는 데 도움이 되기도 하니 이러한 내용이 포함된 것도 나름의 의도가 있다고 생각한다.
책 제목이 나 같은 주니어 개발자에게는 부담스럽게 느껴질 수도 있지만, 실제로는 ‘전문가가 되고 싶은 사람을 위한 리액트’라는 제목이 어울리기도 한 책이다. 사실 React를 깊이 이해하는 것이 곧 모던 웹 생태계를 이해하는 것과 크게 다르지 않고, 웹 개발자로서 계속 성장하고 싶은 사람에게 유용한 책이라고 생각한다. 읽고서도 온전히 이해하진 못한 모던 리액트 Deep Dive는 자그마치 952쪽으로 꽤 방대한 내용을 담고 있다. 이 책은 400페이지라는 상대적으로 가벼운 분량으로 유사한 구성을 가지고 있기에 부담이 적고, 한번 정도 딥다이브를 하고 싶은데 두꺼운 책이 부담스러운 사람에게 이 책을 권하고 싶다.
