AI 요약관련 정보

• Async Svelte는 최상위 await, derived 스토어 내 await, 마크업 내 await를 지원하여 비동기 로직을 간소화합니다. 🚀
• 기존 Svelte Boundary가 확장되어 Async Svelte를 처리하며, 로딩 상태 관리를 용이하게 합니다. 🛡️
• svelte.config.js에 experimental.async: true 컴파일러 옵션을 추가하여 활성화할 수 있으며, Svelte 6부터는 표준 기능이 될 예정입니다. ⚙️
• 주요 활용 사례로는 타입이 지정된 데이터 로더, 비동기 컴포넌트 로더(상호작용 시 지연 로드), 블러 처리된 이미지 로더 등이 있습니다. 💡
• 컴포넌트 로더는 선택에 따라 다양한 도형 컴포넌트를 비동기적으로 로드하며, 오류 처리도 시연했습니다. 🧩
• 이미지 로더는 흐릿한 플레이스홀더를 먼저 보여준 후, 실제 이미지가 로드되면 전환하여 사용자 경험을 개선합니다. 🖼️
• 타입이 지정된 데이터 로더는 Svelte의 제네릭(generics) 기능을 활용하여 API 응답 타입과 자식 스니펫의 데이터 타입을 일치시켜 타입 안전성을 보장합니다. 🔢
• @const 문법을 사용하여 마크업 내에서 프로미스를 기다리고, 로딩 중에는 대체 콘텐츠를 표시할 수 있습니다. ⏳
• 현재 실험적인 기능이므로 Svelte Boundary의 특정 동작(한 번 해결되면 pending 상태를 다시 듣지 않음)에 대한 우회책이 필요할 수 있습니다. 🧪