본문으로 건너뛰기
pele-animate
문서
아이콘
플레이그라운드
변경 내역
GitHub
npm
English
☀
플레이그라운드
편집
미리보기
Mermaid 소스
flowchart LR %% pa: 1=C 2=C>L 3=L>S 4=S>L 5=L>C C@{ icon: "http-get", form: "square", h: 88, label: "Request" } L@{ icon: "load-balancer", form: "square", h: 88, label: "Load balancer" } S@{ icon: "cloud-computing", form: "square", h: 88, label: "Cloud service" } C -->|request| L L -->|forward| S S -->|response| L L -->|reply| C
예제 불러오기…
아이콘: 요청, 로드 밸런서, 클라우드 서비스
플로차트: 캐시 적중과 미적중, 핀과 엣지 핀
시퀀스: 캐시 미적중이 발생한 API 요청
아키텍처: CDN, API, 캐시, 데이터베이스, 워커를 지나는 요청 경로
상태: 로딩, 오류, 재시도가 있는 미디어 플레이어
C4 컨텍스트: 플레이어 앱과 주변 시스템
블록: 저장소 분기가 있는 영상 파이프라인
클래스: 미디어 타입, 플레이어, 라이선스
ER: 고객 주문과 상품 공급업체
타임라인: 두 단계로 나눈 제품 연혁
사용자 저니: 보호된 영상 시청
깃 그래프: 기능 브랜치, 병합, 릴리스
간트: 계획, 구축, 출시
아이콘: 노트북이 서버에 요청 보내기
핀: 요청, 검증, 지름길로 응답
엣지 핀: 회신을 별도 단계로
선 두께
1.5
미리보기 너비
100%
색상
선과 아이콘
그룹 배경
노드 배경
배경
글자
색상 초기화
공유 링크 복사
Mermaid 복사
코드 복사
라이트와 다크 모드는 사이트 테마(헤더의 버튼)를 따릅니다.