사용 방법
- 1
SVG 마크업 붙여넣기 또는 열기
SVG 파일을 불러오거나 작업 영역에 마크업을 붙여넣습니다. 원본은 원격 cleanup 서비스로 전송되지 않고 브라우저에서 처리됩니다.
- 2
위험한 내용 sanitize
웹 프로젝트에 더 적합하도록 스크립트형 마크업, 이벤트 핸들러, 불필요한 메타데이터를 제거합니다.
- 3
정리 규칙으로 최적화
SVGO 방식의 최적화를 적용해 시각 결과를 유지하면서 불필요한 속성, 공백, 주석, 편집기 노이즈를 줄입니다.
- 4
정리된 SVG 복사 또는 다운로드
출력을 검토한 뒤 컴포넌트, 자산 폴더, 아이콘 세트, 문서 예시에 정리된 마크업을 사용합니다.
주요 사용 사례
보안 및 개인정보
브라우저 기반 SVG sanitation
SVG는 단순 도형 이상의 내용을 담을 수 있으므로 cleanup은 용량과 안전성을 함께 다루는 단계입니다. Frisbly는 원본을 브라우저에서 처리하고, sanitation 중심 정리를 사용하며, 파일명, 마크업 내용, 사용자 식별자를 수집하지 않는 흐름을 유지합니다. 신뢰할 수 없는 출처의 SVG는 배포 전에 여전히 직접 검토해야 합니다.
지원 입력과 출력
지원 SVG cleanup 입력
- 로컬 SVG 파일 또는 붙여넣은 SVG 마크업.
- 스크립트형 또는 안전하지 않은 속성을 줄이는 sanitize 정리.
- 편집기 메타데이터, 주석, 공백, 중복 속성 최적화.
- 복사하거나 다운로드할 수 있는 정리된 SVG 출력.
자주 묻는 질문
SVG cleanup을 위해 파일이 업로드되나요?
아니요. SVG 마크업은 브라우저에서 처리되므로 원본 파일이나 붙여넣은 소스에 서버 업로드 경로가 필요하지 않습니다.
왜 SVG를 sanitize해야 하나요?
SVG는 XML 기반이며 위험하거나 불필요한 마크업을 포함할 수 있습니다. sanitize는 자산을 페이지에 사용하기 전 명백히 안전하지 않은 부분을 줄이는 데 도움이 됩니다.
최적화가 이미지 모양을 바꾸나요?
목표는 시각 결과를 유지하면서 중복 마크업을 제거하는 것입니다. 중요한 브랜드 자산은 배포 파일을 교체하기 전에 반드시 미리보기로 확인하세요.
정리된 SVG를 React나 Next.js에서 쓸 수 있나요?
검토 후 사용할 수 있습니다. 프레임워크와 보안 정책에 따라 컴포넌트나 자산 폴더에 정리된 SVG를 복사할 수 있습니다.
cleanup만으로 신뢰할 수 없는 SVG가 충분히 안전해지나요?
어떤 자동 cleanup도 완전한 보안 보장으로 보면 안 됩니다. 신뢰할 수 없는 SVG는 배포 전 검토하고 앱의 콘텐츠 보안 정책을 따라야 합니다.