구조와 기능

Strudel 은 브라우저에서 코드를 써서 음악을 만드는 라이브 코딩 환경이다. Haskell 로 된 TidalCycles 를 JavaScript 로 옮긴 것이고, strudel.cc 에 접속하면 설치 없이 바로 쓸 수 있다. 화면 왼쪽에 코드를 쓰고 play 를 누르면 소리가 나고, 고친 뒤 update 를 누르면 끊김 없이 바뀐다.

저장소는 pnpm 모노레포이고 packages/ 아래에 32개 패키지가 있다. 코어 패턴 엔진(core), 따옴표 안 짧은 표기를 읽는 파서(mini), 웹 오디오 신시사이저와 샘플러(superdough·webaudio), 피아노롤 같은 시각화(draw), MIDI·OSC 연결이 각각 패키지로 나뉜다.

• 줄 수가 가장 많은 확장자: mjs 48,485줄(225개 파일)
• 의존성: dependencies 7개, devDependencies 18개
• 데스크톱판용 src-tauri/ 와 문서 사이트 website/ 도 같은 저장소에 있다

2025-06 에 GitHub 에서 Codeberg 로 옮겼다. 옛 tidalcycles/strudel 은 보관 처리됐고, README 는 「GitHub 로 다시 포크하지 말아 달라」고 적고 있다.

하이라이트

따옴표 한 줄이 한 마디가 된다

s("bd <hh oh>*2") 처럼 따옴표 안에 소리 이름을 늘어놓으면 한 마디(cycle)를 그 개수만큼 똑같이 나눠 채운다. ~ 는 쉼, *2 는 두 번, <a b> 는 마디마다 번갈아 쓰기다. 이 표기는 packages/mini/krill.pegjs 의 PEG 문법 303줄로 정의돼 있고, 파서가 이를 패턴 객체로 바꾼다.

박자를 숫자로 세지 않고 칸 수로 나누는 방식이라, 칸을 하나 더 넣기만 해도 리듬이 바로 촘촘해진다. 화면에서 숫자 하나 바꿔 소리가 달라지는 경험이 짧은 영상으로 잘 퍼지는 이유도 여기에 있다.

패턴은 시간을 받으면 사건을 돌려주는 함수다

코어의 Pattern 은 값을 들고 있지 않고 query 함수 하나만 들고 있다(packages/core/pattern.mjs).

constructor(query, steps = undefined) {
  this.query = query;

queryArc(begin, end, controls = {}) {
  return this.query(new State(new TimeSpan(begin, end), controls));

재생기는 앞으로 올 짧은 시간 구간을 계속 물어보고, 패턴은 그 구간에 들어가는 소리 사건(hap)만 돌려준다. 그래서 .fast(2) 나 .hpf(...) 같은 변환은 데이터를 고치는 게 아니라 질의를 감싸는 함수가 된다. 시간은 분수(fraction.mjs)로 다뤄 반올림 오차가 쌓이지 않는다.

주의점

라이선스는 AGPL-3.0 이다. README 는 Strudel 코드를 같은 라이선스의 자유 소프트웨어 안에서만 공유할 수 있다고 적고 있다. 기본 소리 묶음의 라이선스는 별도 저장소(dough-samples)에 정리돼 있으니, 소리를 쓰려면 그쪽도 확인해야 한다.

POLICY.md 에 AI 정책이 있다. LLM 이 만든 코드나 글이 담긴 기여는 거절하고, LLM 이 쓴 이슈·댓글은 표시한 뒤 지운다. 기업 AI 플랫폼으로 프로젝트를 옮겨 가는 것도 강하게 말린다. AI 코딩 도구로 고쳐서 기여하려는 사람이라면 시작 전에 꼭 읽어야 한다.

GitHub 를 떠났기 때문에 GitHub 기준 지표(스타, 이슈 응답 시간)는 이 리포트의 실측에 없다. 스타·이슈 수는 Codeberg API 로 따로 읽었다. 첫 화면 실측에서 strudel.cc 는 첫 화면까지 13.3초가 걸렸는데, 소리 묶음을 미리 불러오는 시간이 포함된 수치로 보인다(추정).

실측 정보

커밋 / 최근 90일

6,631건 / 161건 (전체 이력, 2022-01-22 ~ 2026-10-26)

참여 저자 / 원격 태그

155명 / 533개

Codeberg 스타 / 포크

1,282 / 362 (옛 GitHub 저장소는 3,041, 2025-06 보관 처리)

열린 이슈 / 열린 PR

406건 / 141건

파일 / 텍스트 줄 수

702개 / 138,417줄 (mjs 48,485)

테스트 파일 / CI

26개 / Forgejo 워크플로 4개

라이선스

AGPL-3.0

사이트 실측

주소

strudel.cc

응답 · 첫 화면

200 · 13.3초 (데스크톱)

요청 · 전송량

46개 · 2.4MB

깨진 요청 · 콘솔 오류

0개 · 0개

폰(390px)

가로 넘침 없음

디자인

어두운 화면

홈페이지를 실제 크롬으로 띄워 첫 화면까지만 쟀습니다(2026-10-29 · 데스크톱 1440px · 폰 390px). 로그인 · 입력 같은 동작은 하지 않았고, 사이트 상태는 리포 품질과 따로 봅니다. 색 칸은 바탕 · 면 · 글자 · 흐린 글자 · 강조 · 선, 점선은 「못 잼」.

적용점

• P0 · 비용 낮음strudel.cc 에서 예제 하나를 열고 숫자 하나만 바꿔 update 를 눌러 본다. 설치 없이 「코드를 고치면 소리가 바로 바뀐다」를 체감하는 데 1분이면 된다
• P1 · 비용 중간패턴을 상태가 아니라 「시간 구간을 받으면 사건 목록을 돌려주는 함수」로 두는 설계(packages/core/pattern.mjs)는 애니메이션·타임라인처럼 시간을 다루는 다른 도구에도 옮겨 볼 만하다
• P2 · 참고코드를 쓰거나 기여할 계획이면 AGPL-3.0 과 POLICY.md 의 AI 정책을 먼저 읽는다. LLM 이 만든 코드나 글은 기여로 받지 않는다

의견

판정에 대한 반론, 도입 경험, 정정 제보를 환영합니다. GitHub 계정으로 참여합니다.