Valtio, 세 번째 아이의 탄생

주말이었다. 세상이 잠시 숨을 고르는 시간, 다이시 카토의 방 안은 키보드 소리만이 규칙적으로 울려 퍼지고 있었다. 그의 온 신경은 모니터 화면 속 코드에 집중되어 있었다. 머릿속에서 번뜩였던 '반응형 프록시 상태'라는 혁신적인 아이디어를 현실로 빚어내는 시간이었다.

"좋아, 시작해볼까."

그의 손가락이 날렵하게 움직였다. 핵심은 단연 proxy() 함수. 이 함수는 평범한 자바스크립트 객체를 받아, 마법의 망토처럼 Proxy로 감싸는 역할을 해야 했다.

function proxy(obj) {
  return new Proxy(obj, {
    get(target, prop) {
      // 속성 접근 감지. 필요하다면 추적한다.
      return Reflect.get(target, prop);
    },
    set(target, prop, value) {
      // 속성 변경 감지! 여기가 핵심!
      const success = Reflect.set(target, prop, value);
      if (success) {
        // 변경 알림 시스템 작동! 아직은 간단한 형태.
        notifySubscribers();
      }
      return success;
    },
    deleteProperty(target, prop) {
      // 속성 삭제 감지!
      const success = Reflect.deleteProperty(target, prop);
      if (success) {
        // 변경 알림!
        notifySubscribers();
      }
      return success;
    },
    // ... 다른 트랩들도 필요에 따라 추가 ...
  });
}

let subscribers = new Set();
function subscribe(callback) {
  subscribers.add(callback);
}
function notifySubscribers() {
  subscribers.forEach((cb) => cb());
}

코드는 단순했지만, 그 안에 담긴 잠재력은 엄청났다. set 트랩과 deleteProperty 트랩이 객체에 가해지는 모든 변경과 삭제를 감시하는 눈이 되었다. 변경이 성공적으로 이루어지면, notifySubscribers() 함수를 호출하여 이 변화를 '구독'하고 있는 모든 이들에게 신호를 보낸다. 성벽 위의 파수꾼이 적의 움직임을 발견하면 봉화를 올리는 것이다.

그는 간단한 테스트 코드를 작성했다.

const state = proxy({ count: 0, message: 'Hello' });

subscribe(() => {
  console.log(`상태 변경 감지! 현재 카운트: ${state.count}, 메시지: ${state.message}`);
});

console.log('카운터 증가 시도...');
state.count++; // set 트랩 작동 -> notifySubscribers 호출

console.log('메시지 변경 시도...');
state.message = 'World'; // set 트랩 작동 -> notifySubscribers 호출

console.log('메시지 삭제 시도...');
delete state.message; // deleteProperty 트랩 작동 -> notifySubscribers 호출

실행 결과는 놀라웠다. 콘솔 창에는 그의 의도대로 상태 변경이 감지될 때마다 로그가 찍혔다. set() 함수 없이, produce() 없이, 그저 평범한 자바스크립트 코드로 상태를 변경했을 뿐인데, Proxy가 모든 것을 알아서 처리해주었다.

"됐다…! 움직인다!"

카토의 입가에 만족스러운 미소가 번졌다. 아직은 거칠고 다듬어야 할 부분이 많은 프로토타입이었지만, 핵심 메커니즘은 성공적으로 작동했다. '직관적인 변경'이라는 그의 비전이 코드로서 생명을 얻는 순간이었다.

이제 이 새로운 창조물에 이름을 붙여줄 차례였다. Zustand는 '상태'라는 독일어에서, Jotai는 '상태'라는 일본어에서 따왔다. 이번에는 어떤 이름이 좋을까? 그는 이 라이브러리가 가진 핵심 가치를 떠올렸다. 개발자에게 '가치 있는' 경험을 제공하고, Proxy라는 '강력한' 기술을 기반으로 한다는 점.

'Value', 'Valuable', 'Potent'… 여러 단어가 머릿속을 스쳐 지나갔다. 그러다 문득, 스페인어나 이탈리아어에서 '가치 있는', '유효한', '강력한' 등의 의미를 내포하며 어감이 좋은 단어를 찾고 싶어졌다.

"Valtio (발티오)."

마침내 결정된 이름이었다. 짧고 기억하기 쉬우면서도, 그 안에 담긴 철학 – 직관적인 강력함, 가치 있는 개발 경험 – 을 은은하게 풍기는 이름이었다.

Zustand가 미니멀리즘과 중앙 집중 관리의 길을 걸었다면, Jotai는 아토믹 상태와 분산 관리의 길을 열었다. 그리고 이제 Valtio는, Proxy를 이용한 '직관적인 변경(Intuitive Mutation)'이라는, 완전히 새로운 깃발을 내걸 준비를 마쳤다.

다이시 카토에게는 세 번째 아이가 태어난 것과 같은 감격이었다. Zustand와 Jotai와는 또 다른 개성과 철학을 가진 아이. 이 아이가 세상에 나가 어떤 평가를 받고, 어떤 개발자들에게 사랑받게 될지 기대와 설렘이 교차했다.

하지만 동시에, 그의 마음 한편에는 넘어야 할 다음 허들에 대한 인식이 자리 잡고 있었다. 바로 React와의 통합 문제였다. Proxy 상태는 가변적(Mutable)인데, React는 불변성(Immutability)을 사랑한다. 이 모순적인 두 세계를 어떻게 조화롭게 연결할 것인가?

Valtio의 탄생은 끝이 아니라, 또 다른 위대한 도전의 시작이었다. 카토의 시선은 벌써 다음 단계를 향하고 있었다.