介绍

什么是 Vitarx?

Vitarx（读音 /ˈviːtɑːrks/，中文谐音"维塔克"）是一个前端框架。它以信号粒度的精确依赖追踪取代虚拟 DOM 差量比对，通过引擎级视图控制实现最小化更新，从而获得卓越的运行时性能。

与传统的虚拟 DOM 框架不同，Vitarx 不需要整棵树的 diff 比对——当响应式数据变化时，框架精确知道哪些视图节点需要更新，并直接操作对应的 DOM 节点，避免了不必要的计算和渲染开销。

核心特性

🚀 JSX 支持 — 使用熟悉的 JSX 语法构建界面，完整的 TypeScript 类型推导
⚡ 信号级精确更新 — 基于细粒度依赖追踪，数据变化时仅更新关联的 DOM 节点，无虚拟 DOM diff 开销
🔧 完整的响应式系统 — 提供 ref、reactive、computed、watch、effectScope 等丰富的响应式 API
🎯 函数组件 + 生命周期 — 简洁的函数组件模型，搭配 onInit、onMounted、onDispose 等生命周期钩子
📦 丰富的内置组件 — For、Suspense、Lazy、Freeze、Transition、Teleport、Head 等开箱即用
💉 依赖注入 — 应用级和组件级 provide / inject，轻松实现跨层级数据传递
🎯 指令系统 — 内置 v-show、v-html、v-text 指令，支持自定义指令扩展
🌐 SSR 支持 — 内置服务端渲染，支持 renderToString、renderToStream 和客户端水合
📘 TypeScript 优先 — 全量类型定义，开发体验友好

架构概览

Vitarx 采用分层架构设计，各层职责清晰、依赖单向：

text

┌─────────────────────────────────────────────┐
│                   vitarx                    │  ← 聚合包，统一导出
├────────────┬─────────────┬──────────────────┤
│runtime-dom │ runtime-ssr │                  │  ← 平台适配层
├────────────┴─────────────┼──────────────────┤
│        runtime-core      │     utils        │  ← 运行时核心 & 工具
├──────────────────────────┼──────────────────┤
│        responsive        │                  │  ← 响应式系统
└──────────────────────────┴──────────────────┘

包名	说明
`vitarx`	聚合包，统一导出所有子包 API
`@vitarx/responsive`	响应式核心 — `ref`、`reactive`、`computed`、`watch`、`effect`、`effectScope`
`@vitarx/runtime-core`	运行时核心 — 组件系统、视图构建、生命周期、依赖注入、指令、内置组件
`@vitarx/runtime-dom`	浏览器渲染 — DOM 渲染器、`Transition`、`Teleport`、`Head`、内置指令
`@vitarx/runtime-ssr`	服务端渲染 — `renderToString`、`renderToStream`、客户端水合
`@vitarx/utils`	工具函数 — 深拷贝、类型检测、日志、防抖/节流