Simon-He95/markstream-vue

Multi-framework streaming Markdown renderers for AI apps: Vue/Nuxt, React/Next.js, Octane, SolidJS, Svelte, Angular, and Vue 2. Mermaid, KaTeX, streaming code blocks, SSR, and virtualized histories.

해결하는 문제

Markstream은 AI 채팅 인터페이스나 실시간 데이터 스트림의 응답과 같이 생성 중인 Markdown 콘텐츠를 렌더링할 때 발생하는 문제를 해결합니다. 표준 Markdown 렌더러는 정적 문서를 위해 설계되었기 때문에 콘텐츠가 점진적으로 업데이트될 때 발생하는 "깜박임"이나 레이아웃 불안정성 문제를 겪는 경우가 많습니다.

작동 방식

부분적이고 불완전한 Markdown 문자열을 처리하는 특수 렌더링 엔진을 제공합니다. 두 가지 주요 모드를 지원합니다. 주의를 산만하게 하는 애니메이션 없이 안정적인 실시간 스트리밍에 최적화된 "채팅" 모드와 더 크고 정적이거나 일괄 처리된 콘텐츠를 렌더링하기 위한 "문서" 모드입니다. Mermaid 다이어그램, KaTeX 수식, 코드 블록과 같은 복잡한 요소의 점진적 렌더링을 지원하여 기본 데이터 스트림이 업데이트되어도 안정적으로 유지되도록 합니다.

대상 사용자

Vue, React, Svelte, Angular 또는 Octane을 사용하여 AI 기반 애플리케이션, 채팅 인터페이스 또는 문서 플랫폼을 구축하는 개발자를 위한 도구입니다. LLM 토큰 스트림이나 SSE/WebSocket 출력을 표시하기 위한 안정적이고 고성능인 방법을 찾는 모든 분에게 이상적입니다.

주요 특징

  • 시각적 깜박임과 메모리 사용량을 최소화하기 위해 스트리밍 Markdown 전용으로 구축되었습니다.
  • 채팅(실시간) 및 문서(일괄 처리)를 위한 전용 렌더링 모드가 포함되어 있습니다.
  • 점진적 다이어그램(Mermaid), 수식(KaTeX), 스트리밍 코드 블록과 같은 고급 기능을 지원합니다.
  • Vue, React, Svelte, Angular 및 Octane을 위한 프레임워크별 패키지를 제공합니다.
  • TypeScript 우선 설계이며, 안정적이고 즉시 사용 가능한 기본 설정과 CSS 스타일이 포함되어 있습니다.

관련

  • 프로젝트
  • 프로젝트
  • 프로젝트
  • 프로젝트