Orbiton JS 是一个用于创建 UI 的终极 JavaScript 库，是一个用于创建浏览器 UI 的轻量级极简 JavaScript 库，提供了一个易于使用的 API，用于创建快速、无痛的高性能应用程序。
Web 框架的兴起已经改变了 Web 开发，它使得将 Web 概念发送到其他平台（如移动设备作为桌面）成为可能。由于专注于 JavaScript 的前端开发，React、Vue.js 和 Angular 等库在 UI 开发中发挥了重要作用，并占据了开发人员基础的最大部分。而这种情况正在发生变化，像 Svelte JS 这样的新库正在引入新概念，即编译框架。
说到新的，Orbiton JS 出现了。它是一个用于构建 UI 的新 JavaScript 库，被称为“用于构建用户界面的终极 JavaScript 库”。
Orbiton JS 主要关注性能，为了达到这一目标，核心团队编写代码，根据不同的 JavaScript 引擎（如 V8 和 Gecko）编译和运行 JavaScript 的方式，尝试使用尽可能少的内存。其更快并具有高性能，Svelte 首先是 Orbiton，然后是 Vue.js，最后是 React。
Orbiton JS 还使用 JavaScript 生态系统中现有的工具来轻松地从其他框架过渡。
- 它使用 JSX 作为其默认模板语法。
- 还具有将 JSX 转换为有效 JavaScript 的 babel 和 SWC 插件。
这个库有一个主要缺点，那就是它利用了虚拟 Dom。这个库的作者试图保留这一点，因为他们想让 Orbiton 在任何规模的应用程序中都可移植。
开始
下面就根据官方网站的步骤来构建一个示例应用，创建项目：
npx degit Orbitonjs/template orbiton_app
命令完成之后生成基本的项目结构：
cd orbiton_app npm install
启动：
npm run start
接下来创建一个 Avatar 组件：
const Avatar = ( <div class="avatar-box"> <img src="https://p9-passport.byteacctimg.com/img/user-avatar/ee5b3d33c959244bf7b70b28bb3a4d07~300x300.image" /> <span> DevPoint </span> </div> );
在使用中，可以通过 <Avatar /> 引用使用，完整代码如下：
import Orbiton, { append } from "orbiton"; import "../styles/index.css"; const Avatar = ( <div class="avatar-box"> <img src="https://p9-passport.byteacctimg.com/img/user-avatar/ee5b3d33c959244bf7b70b28bb3a4d07~300x300.image" /> <span> DevPoint </span> </div> ); // just reuse it anywhere you need it function App(props) { const style = { margin: "0px auto", maxWidth: "800px", textAlign: "center", }; return ( <div className="app"> <div style={style}> <h1> Welcome To the <span className="highlight">Orbiton</span>{" "} Template. </h1> <p> <Avatar /> </p> <p> You can visit the{" "} <code> <a href="https://orbiton.js.org"> Official Documentation </a>{" "} </code> to Learm Orbiton </p> </div> </div> ); } const root = document.createElement("div"); document.body.appendChild(root); append(<App />, root);
运行后的效果：
