返回首页
最新
我创建了一个名为 Domphy 的 UI 框架，因为我多次尝试学习 React，但始终无法掌握。我是说，我无法理解被多层隐藏的 React 代码，尤其是当其中一些使用了 React 生态系统的库时。也许我是一个转行的架构师，所以我没有编程的基础，或者我期待的是一些清晰简洁的东西。
我认为 UI 应该是简单的——HTML 和 JS 足够了，只需要某种方式使其具备状态，而不是让它变得更加复杂。我的想法是：仅使用 JS 对象来反映 HTML，并使用函数来管理状态。当我需要重用一个组件时，我还有一个额外的概念——只需制作一个部分（我称之为 Patch）来向主对象添加属性（但原生属性仍然优先）。采用基于组件的方法会导致深层嵌套和属性膨胀，但使用补丁则不会。下面是一个示例：
```javascript
import { ElementNode, toState } from "@domphy/core";
import { tooltip } from "@domphy/ui";
const count = toState(0);
const App = {
div: [
{ h3: (listener) => `Count: ${count.get(listener)}` },
{
button: "Increment",
onClick: () => count.set(count.get() + 1),
$: [tooltip({ content: "Add one to the count" })],
},
],
style: { display: "flex", gap: "8px", alignItems: "center" },
};
const root = new ElementNode(App);
root.render(document.getElementById("app")!);
```
目前，我是唯一一个使用 Domphy 的人，已经快一年了，主要用于在建筑、工程和施工（AEC）行业创建 SketchUp 和 Revit 插件。我在 AI 代码生成兴起之前就创建了 Domphy，目的是为了生成人类可以清晰阅读和理解的代码，但现在 AI 可以很好地使用 React 构建 UI，所以有时我觉得我的工作毫无意义。不过，我仍然在我的应用中使用 Domphy，因为当 AI 遇到瓶颈时，我在阅读和编辑 UI 代码时会更有信心。
免费票