반응형 마이크로모듈

$mol — 반응형마이크로모듈프레임워크

반응성은 프레임워크의 토대에 자리하며, 나중에 덧붙인 것이 아닙니다.의존성 배열, 수동 구독, 수동 캐시 무효화, 이펙트 정리 — 어느 것도 여기엔 없습니다. 더 쉬워진 게 아니라, 필요 없어진 것입니다.시작하기 플레이그라운드 체험 $mol 이란view.tree$my_hello $mol_view guest \stranger sub / <= Name $mol_string value? <=> name? \mol hint @ \Type a name <= Greeting $mol_paragraph title <= greeting \view.tsclass $my_hello extends $.$my_hello { greeting() { return `Hello, ${ this.name() || this.guest() }!` }}view.css.tsnamespace $ { $mol_style_define( $my_hello, { gap: $mol_gap.block, flex: { direction: 'column' }, Greeting: { font: { size: '2rem', weight: 600 }, }, } )}→실시간Hello, mol!파일 세 개, 마크업과 로직과 스타일.이 예제 실행해 보기미니멀점진적으로 도입할 수 있는 에코시스템. 단일 컴포넌트부터 풀스택 local-first 앱까지 확장됩니다.최적UI를 컴포넌트 트리로 구성합니다. 반응성은 자동이고 부수 효과는 명시적입니다.레이지완전한 렌더링 가상화 — 뷰포트 밖의 컴포넌트는 아예 존재하지 않습니다.구조

기본값이 마이크로모듈 구조

프로젝트는 폴더이고, 폴더는 저장소이며, 프레임워크는 코드 안이 아니라 옆에 놓입니다. 첫 컴포넌트든 프로젝트가 서른 개인 회사든 배치는 같습니다.mam/ 워크스페이스├── .meta.tree 레지스트리├── mol/ 프레임워크└── my/ 당신의 패키지 ├── my.meta.tree 당신의 레지스트리 └── hello/ 당신의 프로젝트 ├── index.html 진입점 └── hello.view.tree 마크업내 프로젝트까지 다섯 걸음1MAM을 한 번 클론합니다. 모든 프로젝트가 사는 작업 공간입니다.git clone https://github.com/hyoo-ru/mam.git2자신을 위한 짧은 이름의 폴더를 만들고 저장소로 올립니다.mam/my/3그 옆에 자기 프로젝트의 레지스트리를 둡니다.my/my.meta.tree4그 안에 프로젝트를 만들고, 전용 저장소를 줍니다.my/hello/5등록해 두면 새로 체크아웃할 때 이름으로 가져옵니다.pack hello git \https://github.com/you/hello.git프로젝트가 자기 저장소를 갖는 이유프로젝트는 어떻게 놓이는가비교하나의 시나리오를 React, Vue, $mol에서 나란히, 여러분의 브라우저에서 바로 실행합니다.비교 열기 $mol vs React부터 보기