상태와 렌더링의 간극

상태가 바뀌어도 화면이 즉시 반영되지 않는 이유를 이해해, 백엔드 사고를 프론트온보딩의 렌더링 관점으로 전환한다.

이 문서의 출발점

백엔드에서 익숙한 모델은 보통 요청 -> 처리 -> 응답입니다.
프론트에서 익숙하지 않게 느껴지는 지점은 여기서 시작됩니다.

여기서는 질문이 바뀝니다.

사용자 입력이 들어오고 → 상태가 바뀌고 → 화면이 바로 바뀌는가?

답은 거의 항상 "아니오"입니다.
백엔드는 곧바로 반환되는 응답을 기준으로 정합성을 보장한다면, 브라우저는 여러 단계의 중간 상태를 거치며 최종 페인트를 합니다.

이 간극이 바로 이 문서의 핵심입니다.

브라우저는 화면을 “계산해서 그리는” 시스템입니다.
즉, 상태가 바뀐 직후에도 즉시 화면으로 가기보다, 여러 단계를 통과합니다.

문제의 원인은 특정 단계에 한정되지 않고, 입력/계산/스케줄링/페인팅 전 구간 어디에서나 생길 수 있습니다.
“데이터는 맞는데 화면이 다르다”는 말은 결국 상태에서 화면으로 넘어가는 경계의 동기화가 깨졌을 때 나타납니다.

백엔드 관점에서의 사고가 완전히 쓸모없어지는 게 아닙니다. 오히려 더 강해집니다.

이 차이를 받아들이는 순간 백엔드 개발자는 프론트엔드의 “예측 불가능한 버그”를 덜 신뢰하게 됩니다.

프론트엔드 실무에서의 핵심 철학은 하나입니다.

상태는 즉시 정답이 아니라, 렌더링으로 수렴하는 과정이다.

그래서 문서를 만들거나 리팩터링할 때 이런 기준이 생깁니다.

정확성은 “지금 당장 바뀜”이 아니라 “최종적으로 일관되게 바뀜”으로 정의합니다.

이 문서의 개념은 다음 트랙과 연결됩니다.