여기까지 읽어 주셔서 감사합니다!
동작하는 모습을 보세요:
### 모바일 웹
#### 온보딩
온보딩은 모바일 웹 버전에서도 쓸 수 있습니다:
#### 시계열 차트
> UI 컴포넌트: https://airi.moeru.ai/ui/#/story/src-components-gadgets-timeserieschart-story-vue
값이 변하는 것을 보여 준다는 점은 레벨 미터와 비슷하지만, 특히 과거 데이터에 유용합니다.
이 밖에도 추가한 컴포넌트가 많습니다...
- [x] `` (@Menci 님 감사합니다 [2cb602aa](https://github.com/moeru-ai/airi/commit/2cb602aa3eac456a479b622a5ecf043831597ffe))
- [x] `
### 번역 워크플로 변경
이른바 `i18n` 또는 로케일 파일을 저희 거대한 모노레포 안의 전용 패키지로 분리했습니다.
새 로케일을 추가하거나 번역을 추가·수정해 기여하실 때는 먼저
https://github.com/moeru-ai/airi/tree/main/packages/i18n/src/locales 로 가 주세요.
여기서 언어별 디렉터리를 찾을 수 있습니다. 원하는 것을 골라 진행하세요.
영어를 예로 들면 디렉터리 구조는 이렇습니다:
```bash
└── en
├── docs
├── tamagotchi
#
├── base.yaml
├── settings.yaml
├── stage.yaml
└── index.ts
```
`docs` 와 `tamagotchi` 는 서로 구별되는 두 모듈을 위한 디렉터리입니다:
- 문서 사이트
- 데스크톱 버전 (Tamagotchi)
문서 사이트(글이나 실제 문서가 아니라 UI)의 번역을 돕고 싶으시다면 `docs` 디렉터리로 가서
문서 사이트의 UI 문자열이 담긴 `theme.yaml` 파일을 편집하시면 됩니다.
`tamagotchi` 디렉터리는 조금 특별해서 모든 번역 문자열을 찾을 수는 없습니다. 데스크톱 버전에서만
쓰이는 특별한 번역 몇 가지를 담고 있고, 나머지는 모두 루트 디렉터리에 있습니다.
`docs` 와 `tamagotchi` 외의 것들은:
- `base.yaml` 은 언어와 버튼 기본 상태 등 필수 문자열을 담습니다
- `settings.yaml` 은 설정 페이지의 문자열을 담습니다
- `stage.yaml` 은 스테이지(모델이 표시되는 UI)의 문자열을 담습니다
언어를 더 추가하고 싶으시다면 기존 언어 로케일 디렉터리 하나를 복사해 새 언어 코드로 이름을 바꾸세요.
예를 들어 프랑스어를 추가하려면 `en` 디렉터리를 `fr` 로 복사한 뒤 `base.yaml`, `settings.yaml`,
`stage.yaml`, `index.ts` 파일을 편집해 번역을 추가하면 됩니다. Pull Request 리뷰 과정에서
일부만 번역해도 괜찮습니다.
::: info 도움을 구합니다!
좀 우습게 들릴 수 있지만, 저희 i18n 패키지를 [Crowdin](https://crowdin.com) 이나
[Weblate](https://weblate.org/en/) 같은 번역 자동화 도구와 통합해 주실 경험 있는 분을 찾고 있습니다.
저희는 이 분야 전문가가 아니니, 도와주실 Pull Request 를 열거나 논의를 위한 이슈를 편하게 열어 주세요.
:::
언어 코드는 아래 도구 중 하나로 작업 중인 언어의 코드를 찾아 사용해 주세요:
- [Language subtag lookup app](https://r12a.github.io/app-subtags/)
- [iana.org/assignments/language-subtag-registry/language-subtag-registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)
```bash
.
├── packages
├── i18n
├── package.json
└── src
├── index.ts
└── locales
├── en
│ ├── base.yaml
│ ├── docs
│ │ ├── index.ts
│ │ └── theme.yaml
│ ├── index.ts
│ ├── settings.yaml
│ ├── stage.yaml
│ └── tamagotchi
│ ├── index.ts
│ ├── settings.yaml
│ └── stage.yaml
├── index.ts
└── zh-Hans
├── base.yaml
├── docs
│ ├── index.ts
│ └── theme.yaml
├── index.ts
├── settings.yaml
├── stage.yaml
└── tamagotchi
├── index.ts
├── settings.yaml
└── stage.yaml
```
이에 대한 자료는 여기서 더 읽어 보실 수 있습니다:
- https://developer.mozilla.org/en-US/docs/Glossary/BCP_47_language_tag
- https://en.wikipedia.org/wiki/IETF_language_tag
- https://en.wikipedia.org/wiki/ISO_15924
## 엔지니어링
### 워크플로를 몇 배 빠르게 만든 툴체인
요약:
- 여러 패키지를 **buildless** 구성으로 전환했습니다
- `unbuild` 의 `stub` 를 걷어냈습니다
- `rolldown-vite` 로 전환했습니다
- `unbuild` 를 `tsdown` 으로 교체했습니다
- 더 빠르고 캐시되는 빌드를 위해 `turborepo` 를 도입했습니다
좀 더 자세히 말하면:
이전에는 모노레포 아키텍처를 택하면서 매끄러운 개발 경험을 위해, 컨트리뷰터가 프로젝트를 클론한 뒤
의존성을 설치할 때마다 `postinstall` 스크립트로 각 패키지의 `jiti` export 와 `.d.ts` 모듈을 스텁으로
만들어 부트스트랩해야 했습니다.
덕분에 컨트리뷰터가 모노레포 동작 방식을 배우지 않아도 기여할 수 있었습니다. 하지만 `pnpm install`
때마다 다시 빌드하고 다시 스텁을 만드는 건 분명 영리한 전략이 아니었죠.
[@kwaa](https://github.com/kwaa) 가 도입한 buildless 아키텍처 변경 덕분에, 시간이 가장 오래 걸리던
최대 패키지 `stage-ui` 를 타입 체크나 의존성 해석 문제 없이 건너뛸 수 있게 됐습니다.
이후 [@kwaa](https://github.com/kwaa) 는 `unbuild` 가 가져오던, 때때로 문제를 일으키는 중복
`stub` 스크립트도 제거해 주었습니다. 덕분에 성가신
`The requested module './dist/index.mjs' does not provide an export named 'foo'`
오류와 더는 씨름하지 않는 훨씬 깔끔한 워크플로가 됐습니다.
가장 큰 변화는 두 달 전, [@kwaa](https://github.com/kwaa) 가 `vite` 를 `rolldown-vite` 로 교체해
**워크플로를 2배 빠르게** 만든 것입니다.
여기서 멈추지 않고 `unbuild` 를 `tsdown` 으로 교체해 **추가로 4.2배 속도 향상**을 얻었고,
이제 각 하위 패키지 빌드가 250ms 미만으로 끝납니다.
> `tsdown` 으로 옮기면서 얻은 이점은 더 있습니다...
>
> - 사용하지 않는 의존성 검사
> - CSS 번들링
> - Vue SFC 컴포넌트 번들링
`postinstall` 스크립트는 여전히 필요하지만, 의존성을 인식해 빌드 결과를 캐시할 방법을 찾으면
중복 빌드를 많이 피할 수 있습니다. 여기서 `turborepo` 가 빌드를 더 빠르게 만들어 줍니다.
`turborepo` 덕분에 AIRI 빌드 시간이 **평균 4분에서 25초로 줄었습니다**.
### 이제 Nix 를 지원합니다
[@Weathercold (Weathercold)](https://github.com/Weathercold) 덕분에 AIRI 를 빌드하는 Nix flake 가
생겼습니다. 크로스 플랫폼 호환성에 훌륭한 보탬이 되죠. macOS 에서도 동작합니다.
nix-pkgs 로 들어갈 최종 Pull Request 가 머지되기를 기다리고 있지만, 다음 명령으로 미리 써 보실 수 있습니다:
```bash
nix run --extra-experimental-features 'nix-command flakes' github:moeru-ai/airi
```
### 통합된 빌드 파이프라인
이전에는 테스트, 스테이징, 릴리스의 빌드 파이프라인이 전부 달라서, 파이프라인이 성공할지 확신할 수 없어
새 버전을 낼지 결정하는 게 저에게는 악몽이었습니다.
Tauri 가 크로스 플랫폼 호환성과 Rust 로 syscall 을 하고 네이티브 OS 기능에 통합하는 강력한 능력이라는
이점을 많이 준 건 사실이지만...
v0.7 개발 초기에 저는 ASR/STT 파이프라인의 추론 엔진 구현으로
[huggingface/candle](https://github.com/huggingface/candle) 을 도입했는데, NVIDIA CUDA 에 의존해서
빌드가 정말 엉망이었고 호환성 문제가 도처에 있었습니다.
하지만 이제 훨씬 나아졌습니다. 릴리스와 동일한 스크립트와 워크플로 단계를 매일 실행하는 예약 빌드
파이프라인이 생겼습니다. (`canary` 나 `nightly` 빌드라고 들어 보셨을 겁니다.)
그래서 최신 릴리스에서 문제를 겪으신다면, `main` 브랜치의 최신 빌드를 받아 문제가 고쳐졌는지
언제든 확인해 보실 수 있습니다.
나이틀리 빌드는 https://github.com/moeru-ai/airi/actions/workflows/release-tamagotchi.yml 에서 찾을 수 있습니다.
## 마치기 전에...
이번 릴리스 사이에 태어난 새 패키지들:
> [@sumimakito](https://github.com/sumimakito) 에게 큰 박수를. 정말 환상적인 일을 너무 많이 해서
> 다 세지도 못하겠네요...
- [`@proj-airi/chromatic`](https://github.com/proj-airi/chromatic) ([@sumimakito](https://github.com/sumimakito))
- [`@proj-airi/unocss-preset-chromatic`](https://github.com/proj-airi/chromatic) ([@sumimakito](https://github.com/sumimakito))
- [`@moeru-ai/jem`](https://github.com/moeru-ai/inventory/tree/main/packages/jem-validator) ([@LemonNekoGH](https://github.com/LemonNekoGH)), 통합 모델 카탈로그
- [`clustr`](https://github.com/sumimakito/clustr) ([@sumimakito](https://github.com/sumimakito))
- [`@proj-airi/drizzle-orm-browser`](https://github.com/proj-airi/drizzle-orm-browser) (제가 만들었습니다)
이번 릴리스 사이에 태어난 사이드 프로젝트들:
- [HuggingFace Inspector](https://hf-inspector.moeru.ai/) (https://github.com/moeru-ai/hf-inspector)
- [whisper & VAD, candle, burn, ort 에 관한 더 많은 candle 예제](https://github.com/proj-airi/candle-examples)
- [(모델 카탈로그) Inventory 제출!](https://github.com/moeru-ai/inventory/pull/1) ([@LemonNekoGH](https://github.com/LemonNekoGH))
이 DevLog 에 모든 것을 담을 수는 없습니다. 자세한 내용은 저희 로드맵의
[Roadmap v0.7](https://github.com/moeru-ai/airi/issues/200) 에서 언제든 확인하실 수 있습니다.