Svelte를 위한 분석

Svelte를 위한 제품 분석

스크립트 태그 하나로 Svelte 또는 SvelteKit 앱에 이벤트, 퍼널, 세션 리플레이, 히트맵 등 완전한 제품 분석을 추가하고, 클라이언트 내비게이션을 자동으로 추적하세요.

무료로 시작하기 설치 가이드

왜 중요한가

Svelte 팀이 마침내 볼 수 있는 것

클라이언트 라우트가 집계되지 않습니다

SvelteKit은 브라우저에서 이동합니다. PulsePanda는 각 전환을 추적하여 페이지뷰가 실제 사용을 반영하도록 합니다.

도입에 대한 시야 없음

커스텀 이벤트를 추적하여 각 릴리스 후 사용자가 어떤 기능과 라우트에 도달하는지 측정하세요.

UI 문제가 보이지 않습니다

세션 리플레이와 히트맵은 사용자가 컴포넌트 내에서 어디서 어려움을 겪는지 드러냅니다.

설정

Svelte에 PulsePanda 추가하기

SvelteKit이 모든 페이지에 사용하는 HTML 템플릿인 src/app.html에 스니펫을 추가하세요.

SvelteKit — src/app.html

<!doctype html>
<html lang="en">
  <head>
    %sveltekit.head%
    <script
      src="https://pulsepanda.dev/sdk.js"
      data-project="YOUR_PROJECT_ID"
      defer></script>
  </head>
  <body>
    <div>%sveltekit.body%</div>
  </body>
</html>

일반 Svelte(Vite) 앱에서는 대신 index.html에 동일한 스니펫을 추가하세요.

워크플로

설치에서 인사이트까지

스니펫 설치

Svelte 프로젝트에 스크립트를 한 번만 추가하세요. 웹 분석, 자동 캡처 클릭, 세션 리플레이, 히트맵이 즉시 수집을 시작합니다.

중요한 것을 추적하세요

주요 액션에서는 pulsepanda.track()을, 로그인 후에는 pulsepanda.identify()를 호출해 이벤트, 세션, 피드백을 각 사용자와 연결하세요.

데이터로 행동하기

퍼널을 구축하고, 이탈 뒤의 리플레이를 보고, 히트맵을 읽고, 제품 내 피드백을 수집하세요 — 모두 하나의 워크스페이스에서.

제공 내용

스니펫 하나로 전체 그림을

스니펫 하나로 전체 그림을
분석 레이어	페이지뷰, 커스텀 이벤트, 전환 퍼널, 그리고 리텐션.
행동 레이어	세션 리플레이, 클릭 및 스크롤 히트맵, 그리고 오류 맥락.
피드백 레이어	제품 내 설문, 피드백 위젯, 폼, 그리고 기능 투표 보드.

자주 묻는 질문

Svelte 관련 질문

SvelteKit 내비게이션을 추적하나요?

예. SDK는 History API 변경을 수신하므로, SvelteKit 클라이언트 측 라우트 전환이 자동으로 페이지뷰로 기록됩니다.

SvelteKit에서 스니펫을 어디에 넣나요?

src/app.html의 <head> 안에서. 그러면 모든 서버 렌더링 및 클라이언트 내비게이션 페이지에 로드됩니다.

Svelte 컴포넌트에서 이벤트를 전송할 수 있나요?

예. 모든 핸들러나 라이프사이클 함수 내에서 pulsepanda.track("event", { props })를 호출하세요.

더 살펴보기

Svelte 앱에 분석 추가하기

한 번 설치하고 몇 분 만에 분석, 세션 리플레이, 히트맵, 퍼널, 피드백을 연결하세요.

무료로 시작하기