소피가 훅을 통해 ‘현재’의 개발자 경험 향상이라는 가치를 보았다면, 세바스티안 마크바게는 훅을 통해 리액트가 탄생했던 ‘최초’의 비전에 한 걸음 더 다가섰다고 평가했다.
그의 머릿속에는 언제나 리액트의 근본 철학을 담은 하나의 공식이 자리 잡고 있었다.
UI = f(state)
‘UI는 상태(state)의 함수(function)다.’
이것은 지극히 순수하고 수학적인 아이디어였다. 어떤 시점의 상태를 함수에 넣으면, 언제나 예측 가능한 동일한 UI가 나와야 한다는 선언적인 이상.
하지만 클래스 컴포넌트는 이 순수한 이상을 완벽하게 구현하지 못했다.
클래스는 단순히 state와 props만으로 작동하지 않았다. componentDidMount, componentDidUpdate 같은 생명주기 메서드들은 ‘시간(time)’이라는 또 다른 보이지 않는 입력 값에 의존했다. 또한, 클래스 ‘인스턴스(this)’라는 개념 자체가, 렌더링 사이에 계속 유지되는 부수 효과 덩어리였다.
클래스는 UI = f(state)가 아니라, UI = f(state, time, this)에 가까운, 불순물이 섞인 모델이었던 셈이다.
“훅은 이 불순물들을 제거하는 과정이었습니다.”
세바스티안이 팀원들에게 자신의 생각을 설명했다.
“함수형 컴포넌트는 그 자체로는 인스턴스를 가지지 않습니다. 렌더링될 때마다 처음부터 다시 실행되는, 훨씬 더 순수한 존재죠.”
“useState는 상태를 컴포넌트 ‘안’이 아닌, 리액트의 관리 영역, 즉 ‘밖’에 두도록 만들었습니다. 컴포넌트는 그저 상태 값을 빌려 쓸 뿐, 소유하지 않습니다.”
“useEffect는 componentDidMount와 같은 부수 효과들을 렌더링이라는 순수한 계산 과정으로부터 명확하게 ‘격리’시키는 역할을 합니다.”
그의 관점에서, 훅으로 향한 모든 여정은 리액트를 UI = f(state)라는 본래의 순수한 비전으로 되돌리기 위한, 거대한 정화(purification) 과정이었다.
이 ‘순수함’을 향한 집착은 단순한 학문적 유희가 아니었다.
함수가 더 순수해질수록, 리액트는 그 함수의 실행을 더 자유롭게 제어할 수 있게 된다.
순수한 계산은 중간에 멈췄다가 나중에 다시 시작해도 아무런 문제가 없다. 이전의 계산 결과에 영향을 주지 않기 때문이다.
바로 이것이 동시성 모드를 가능하게 하는 핵심 열쇠였다.
리액트가 렌더링을 멈추고, 재개하고, 심지어는 우선순위를 바꿀 수 있는 힘은, 바로 훅이 가져다준 이 ‘순수함’에 대한 근사치로부터 나왔다.
세바스티안은 더 먼 미래를 보고 있었다.
그가 꿈꾸는 리액트는, 개발자가 시간의 흐름이나 부수 효과의 복잡함에 대해 전혀 신경 쓰지 않고, 오직 ‘어떤 상태일 때 어떤 UI가 보여야 하는가’라는 본질적인 선언에만 집중할 수 있는, 완벽하게 예측 가능한 시스템이었다.
훅은 그 위대한 비전을 향한, 가장 중요하고도 결정적인 한 걸음이었다.
그것은 리액트를 더 단순하게 만드는 동시에, 역설적으로 더 깊고 원칙적인 길로 이끌고 있었다.
