전문가를 위한 리액트 도서 리뷰(한빛미디어)

“한빛미디어 서평단 <나는리뷰어다> 활동을 위해서 책을 협찬 받아 작성된 서평입니다.”

출처: 한빛미디어

책 소개

“전문가를 위한 리액트”는 단순히 리액트의 기본 사용법을 넘어 고급 패턴과 성능 최적화, 확장 가능한 아키텍처를 구축하는 방법을 다루는 책이다. 이 책은 리액트를 이미 사용해 본 개발자가 더 깊이 있는 이해와 실무적인 기술을 습득하는 데 초점을 맞추고 있다.

인상 깊었던 내용

리액트를 오래전에 다뤄봤던 터라 버전이 올라가면서 내부 동작 원리도 많이 바뀌었다는 것을 느꼈다.

파이버 데이터 구조

리액트는 16 미만 버전 ‘스택 재조정자’를 사용했었다고 한다. 작업을 일시 중지하거나 연기하지 않고 쌓여 있는대로 렌더링하기 때문에 업데이트의 우선순위를 설정할 수 없었다. 그래서 덜 중요한 업데이트가 더 중요한 업데이트를 방해하는 문제가 생겼다. 그래서 파이버라는 데이터 구조를 사용해 이 문제를 해결했다고 한다. 파이버 재조정자를 활용한 재조정 과정을 깊이있게 학습할 수 있었다.

메모화

컴포넌트에 메모화를 적용하면 내부적으로 어떤 일이 일어나는지 학습할 수 있었다.

고차 컴포넌트 패턴

고차 컴포넌트는 컴포넌트를 입력으로 받아 새로운 컴포넌트를 반환하는 함수다. 이 책에서는 고차 컴포넌트를 활용한 다양한 패턴을 소개한다. 특히 컴포넌트 합성, 고차 컴포넌트, 렌더 프롭스, 커스텀 훅 등을 활용한 다양한 패턴과 각각의 장단점이 비교되어 있어 상황에 맞는 패턴을 선택하는 데 도움이 되었다.

리액트 동시성

동시성 렌더링을 사용해 렌더링 과정에서 어떻게 우선순위를 설정하고 구성하는지 학습할 수 있었다. 처음 보는 훅도 있었는데 useDeferredValue 훅은 특정 UI 업데이트를 나중으로 미룰 수 있어서 실무에서 사용해 볼 수 있겠다는 생각이 들었다.

프레임워크

Next.js는 계속 써보고 있지만 Remix는 따로 사용해 볼 일이 없었다. Remix에 대한 글도 점점 많이 보이고 기업에서 채택하는 경우도 있었는데 뭐가 좋길래 그렇게 채택을 하는지 궁금했는데 대략적으로나마 Remix가 추구하는 방향을 알 수 있었다. Remix는 코드가 프레임워크 안에 숨겨져 있지 않고 외부로 드러나 있기 때문에 사용자가 입맛대로 수정할 수 있는게 인상적이었다. 그리고 웹의 기본적인 기능들을 적극적으로 활용하려고 한다. 폼을 사용할 때도 따로 input값을 상태값으로 저장하지 않고 native input 자체로 활용한다.

추천 대상

이 책은 다음과 같은 분들에게 추천한다:

• 리액트의 기본을 이미 알고 있고 더 깊이 이해하고 싶은 개발자
• 대규모 리액트 애플리케이션의 설계와 구현에 고민이 있는 개발자
• 성능 최적화와 코드 품질 향상에 관심이 있는 프론트엔드 개발자
• 리액트 아키텍처 패턴을 학습하고 싶은 프론트엔드 리드 개발자

마무리

“전문가를 위한 리액트”는 단순한 리액트 입문서를 넘어서, 실제 복잡한 애플리케이션 개발에 필요한 고급 기술과 패턴을 체계적으로 정리한 책이다. 요즘에 내부 구현 및 원리에 관심이 많아서 입문서 이상의 책을 찾고 있었는데 마침 좋은 기회로 이 책을 만나서 좋았고 한번에 내용들을 완전히 이해하긴 어려웠기 때문에 여러번 반복숙달하면서 내 것으로 만들어 보려고 한다. 리액트를 사용하는 개발자라면 한 번쯤 읽어볼 가치가 있는 책이라고 생각한다.