하나의 명시적인 주기.
상태 의존 값만 있습니다. 의존성 그래프나 스케줄러는 없습니다. 실행 시점을 직접 결정하며, 데이터에서 화면까지의 경로를 예측할 수 있습니다.
- 01변경
데이터를 변경합니다
상태는 일반 JavaScript 변수, 배열, 객체입니다. 원하는 방식으로 원하는 만큼 변경할 수 있습니다.
todos.push(newTodo) user.name = 'Ada' - 02적용
update()를 호출합니다
전역 함수 하나로 변경 사항을 적용합니다. 여러 번 변경한 다음 한 번만 적용하세요. 직접 요청하기 전에는 아무것도 렌더링되지 않습니다.
update() - 03패치
Nuclo가 DOM을 동기화합니다
모든 동적 표현식이 다시 평가됩니다. 실제로 변경된 값만 DOM에 기록합니다. 트리 비교나 재렌더링은 없습니다.
// 노드 2개 패치, // 나머지는 그대로 유지
상태를 변경해도 아무 일도 일어나지 않습니다. update()를 호출하면 Nuclo가 요청한 작업만 정확히 수행합니다. 그 이상도, 이하도 아닙니다.암묵적인 것보다 명시적인 것이 낫습니다
프록시가 모든 동작을 추적하지 않습니다. 상태를 변경한 다음
update()를 호출합니다. 원인과 결과가 명확하고 예측 가능합니다.자유롭게 변경하고, 한 번만 업데이트합니다
열 번 변경한 다음
update()를 한 번 호출합니다. DOM에는 최종 상태만 반영되므로 불필요한 렌더링이 없습니다.컴포넌트 대신 함수
일반 JavaScript 함수로 만듭니다. 클래스, 데코레이터, 특수 문법이 필요하지 않습니다. 각 함수는 DOM 노드를 반환합니다. 필요한 경우에만
onMount와onDestroy를 일반 수정자로 추가합니다.
명확함을 위한 설계.
마법도 예상 밖의 동작도 없습니다. 모든 업데이트는 의도적입니다.
- 01명시적
업데이트 주기를 직접 제어합니다
자유롭게 변경한 다음
update()를 한 번 호출합니다. 구독이나 스케줄러가 필요하지 않으며 예상하지 못한 비교 작업도 없습니다. DOM은 결정한 시점에 동기화됩니다. - 02경량
외부 의존성 없음
코어 런타임은 gzip 압축 시 약 18.4 KB입니다. 컴파일러나 빌드 플러그인이 필요하지 않습니다. import 하나를 추가하고 바로 시작하세요.
- 03타입 지정
TypeScript 중심 설계
타입이 완전히 지정된 175개의 HTML 및 SVG 빌더가 모든 속성, 스타일 속성, 이벤트에 자동 완성을 제공합니다.
- 04정밀함
세밀한 패치
동적 표현식은
update()에서 다시 평가됩니다. 실제로 변경된 값만 DOM에 반영됩니다.
중요한 작업에서 빠르게.
수천 개 행의 생성, 업데이트, 교환, 삭제를 측정한 js-framework-benchmark의 독립적인 결과입니다.
- Nuclo0.2.241.12
- Solid1.9.31.13
- Svelte5.42.11.17
- Vue3.5.391.31
- Riot10.1.21.54
- React19.2.01.58
- Angular22.0.01.58
- Stencil4.23.01.81
- Ember7.3.0-alpha.52.06
- Knockout3.5.12.26
- Qwik1.11.03.29