불일치와 경계 확인

문항 6개. 정답과 해설은 풀어 본 뒤에 보여 드립니다.

1. 서버와 클라이언트가 다른 텍스트를 그렸을 때 화면에 남는 것은?

   1. 클라이언트가 그린 값 — 나중 것이 이긴다
   2. 서버가 그린 값 — 하이드레이션은 텍스트를 고치지 않는다
   3. 빈 문자열 — 어느 쪽도 믿을 수 없으므로 지운다
   4. 둘이 나란히 — 브라우저가 중복 노드를 만든다

2. React 가 `useId` 를 따로 둔 이유로 문서가 드는 것은?

   1. id 문자열이 짧아 DOM 크기가 줄기 때문에
   2. 전역 카운터는 여러 컴포넌트에서 겹칠 수 있기 때문에
   3. 접근성 속성은 숫자만 받기 때문에
   4. 클라이언트가 하이드레이션하는 순서가 서버 HTML 이 나온 순서와 같다고 보장할 수 없기 때문에

3. 비교기가 자식 수가 다른 자리에서 더 내려가면 무슨 일이 생기나?

   1. 짝이 아닌 노드끼리 견줘 불일치가 쏟아지고 진짜 원인이 묻힌다
   2. 무한 재귀에 빠져 스택이 넘친다
   3. 남는 자식이 조용히 무시돼 불일치를 놓친다
   4. 경로 문자열이 어긋나 중복 보고가 생긴다

4. `suppressHydrationWarning` 에 대해 React 문서가 적는 제약은?

   1. 서버 컴포넌트에서만 쓸 수 있다
   2. 한 겹만 통하는 탈출구이고 남용하지 말아야 한다
   3. 텍스트에는 못 쓰고 속성에만 쓸 수 있다
   4. 개발 빌드에서만 동작하고 배포본에서는 무시된다

5. 경계 **밖**에서 난 하이드레이션 불일치의 비용은?

   1. 그 노드 하나만 다시 그린다
   2. 가장 가까운 부모 요소만 다시 그린다
   3. 페이지 전체를 다시 그리게 만든다
   4. 다음 상태 변경까지 아무 비용도 없다

6. 서버는 UTC 로, 브라우저는 사용자 시간대로 날짜를 그릴 때 옳은 처리는?

   1. 시간대와 로캘을 옵션으로 명시해 두 쪽 결과를 같게 만든다
   2. 서버 렌더에서 날짜를 빼고 클라이언트에서만 그린다
   3. 날짜 문자열을 비교에서 제외하도록 비교기를 고친다
   4. 서버의 시스템 시간대를 사용자 시간대로 바꾼다