Inertiajs는 서버 측 라우팅을 클라이언트 측 렌더링과 혼합하는 고유 한 접근 방식을 통해 단일 페이지 애플리케이션 (SPA)의 상태 관리를 처리하여 React 또는 VUE 단독과 같은 프레임 워크로 구축 된 기존 스파에서 전형적인 별도의 클라이언트 측 상태 관리 시스템이 필요하지 않습니다. 다음은 SPA 컨텍스트에서 Inertiajs가 상태를 관리하는 방법에 대한 포괄적 인 설명입니다.
Inertiajs는 본질적으로 전체 페이지 재 장전없이 페이지 방문을 허용하는 클라이언트 측 라우팅 라이브러리 역할을합니다. 브라우저가 각 탐색에서 완전한 HTML 페이지를 가져 오는 대신 링크가 클릭하고 서버에서 JSON 응답을 가져옵니다. 이러한 응답에는 페이지 구성 요소 이름과 페이지의 상태 데이터 (Props)가 포함됩니다. 이 데이터 중심의 접근 방식은 서버가 각 페이지의 클라이언트에 전송되는 상태 또는 데이터를 제어하여 관성이 인터페이스의 필요한 부분 만 동적으로 렌더링하고 업데이트하여 스파인 경험을 원활하게합니다.
핵심 상태 관리 메커니즘은 현재 "페이지 객체"를 보유하는 것을 중심으로 진행됩니다. 여기에는 렌더링 할 구성 요소와 전달할 소품이 포함됩니다. 서버는 주어진 경로에 대한 관련 상태 데이터 로이 페이지 객체를 생성합니다. 탐색이 발생하면 관성은 전체 페이지 재 장전이 아닌 XHR (AJAX) 요청을 수행합니다. 새 페이지 객체를 수신하고 현재 객체와 비교하고 적절한 경우 이전 상태를 잃지 않고 구성 요소와 소품을 교환하여 프론트 엔드를 업데이트합니다.
내비게이션 또는 양식 입력 보유와 같은 경우 상태를 보존하기 위해 관성은`useremember '라는 기능을 제공합니다. 이 유틸리티는 구성 요소 상태 (종종 형태 상태)를 브라우저의 히스토리 상태로 저장하므로 사용자는 입력을 잃지 않고 다시 탐색 할 수 있습니다. `useremember`는 모든 데이터 객체에 적용될 수 있으며 고유 키를 제공함으로써 관성은 사용자가 해당 페이지 나 구성 요소를 다시 방문 할 때 어떤 저장된 상태를 복원 할 수 있는지 알고 있습니다. 이것은 클라이언트 측 전용 상태의 동작을 모방하지만 SPA의 내비게이션 라이프 사이클을 통해 관리합니다.
양식을 다룰 때, 관성은 형태 상태를 관리 할뿐만 아니라 명시 적으로 지우지 않는 한 페이지 방문 사이의 상태를 자동으로 기억하는 향상된 양식 도우미`useform '을 제공합니다. 이는 사용자가 내비게이션에 대한 양식 데이터를 잃지 않아 복잡한 클라이언트 측 상태 솔루션없이 UX를 향상시킵니다.
관성은 또한 모든 요청에서 서버에서 전달 된 공유 소품을 사용하여 페이지 전체에서 글로벌 데이터를 공유하는 것을 지원합니다. 여기에는 인증 상태, 사용자 정보 또는 플래시 메시지와 같은 데이터가 포함됩니다. 이 공유 소품은 모든 페이지 구성 요소의 소품으로 자동 병합되어 추가 수동 관리없이 앱 전체에서 일관되고 중앙 상태를 사용할 수 있도록합니다.
프로토콜 관성 사용에는 또한 클라이언트 및 서버 자산 동기화를 처리하는 버전 작성 기능도 포함되어 있으며, 오래된 JavaScript 또는 CSS 파일로 인한 상태 불일치를 피합니다. 서버가 버전 변경을 감지하면 전체 페이지 재 장전을 강제하여 앱 상태를 재설정하고 최신 자산을로드합니다.
관성 상태는 서버 측 경로 및 컨트롤러와 밀접하게 통합되어 있으므로 서버 로직이 데이터 가용성을 지시하는 사용 패턴을 장려하고 프론트 엔드는 해당 데이터를 선언적으로 소비합니다. 결과적으로 비동기 데이터 가져 오기 및 동기화 처리와 같은 클라이언트가 많은 스파에 내재 된 대부분의 국가 관리 복잡성이 서버 측 프레임 워크에 오프로드됩니다. 이로 인해 클라이언트 코드가 단순화되고 상태 동기화 주변의 보일러 플레이트가 적습니다.
요약하면, Inertiajs는 스파의 상태를 다음과 같이 처리합니다.
- 서버 경로에서 전송 된 JSON 페이지 객체를 사용하여 현재 페이지 상태를 나타냅니다.
- 전체 HTML 페이지가 아닌 최소한의 JSON 데이터를 가져 오기 위해 내비게이션을 가로 채립니다.
- 각 경로 변경에서 소품으로 적절한 클라이언트 측 구성 요소를 동적으로 렌더링합니다.
- 브라우저 이력을 통해 탐색 전반에 걸쳐``사용자 ember ''를 지속적으로 제공합니다.
- 특수 양식 도우미 (`useform`)를 사용하여 양식 상태를 관리하고 기억합니다.
- 스파 전역의 글로벌, 일관된 상태에 대한 공유 서버 데이터 (공유 소품) 허용.
- 자산 버전 관리 클라이언트와 서버를 동기화하여 앱 상태 무결성을 유지합니다.
- 비즈니스 및 데이터 로직을 서버 측에 오프로드하여 클라이언트 측 복잡성을 최소화합니다.