Million.js 1.0.0 发布!

2025-05-27

Million.js 1.0.0 发布!

<1kb编译器增强的虚拟 DOM。速度真快!

我最初创建 Million.js 纯粹是出于一时兴起。我当时只是想随便弄弄,看看如何构建一个简单的虚拟 DOM,或许可以分享给几个朋友。六个月后,Million.js 1.0.0 终于完成了!

虽然过程很艰辛,但我真心享受这个过程的每一刻。终于能拿出一个让我引以为豪的稳定版本,我真是欣喜若狂。

YouTube 视频

什么是Million.js?

它是一个虚拟 DOM,或者说是 React 所基于的架构。它的目标是通过为编译器提供优化 diff 的方法,成为过渡 UI 库的编译目标。

本质上,Million.js 利用虚拟 DOM 的声明性和灵活性,同时在进行优化时推迟到编译器。

它也是可组合的,但默认情况下是合理的,允许您构建可扩展的、日益复杂的逻辑,但如果需要的话,也可以通过简单的 API 享受最佳实践。

// Composable
const diff = node([children(), props()]);
const data = diff(el, newVNode, oldVNode, []);
flush(data.workStack, schedule);

// Equivalent sensible default API
patch(el, newVNode);
Enter fullscreen mode Exit fullscreen mode

默认 API 的更复杂用法:

import { m, createElement, patch } from 'million';

// Initialize app
const app = createElement(m('div', { id: 'app' }, ['Hello World']));
document.body.appendChild(app);
// Patch content
patch(app, m('div', { id: 'app' }, ['Goodbye World']));
Enter fullscreen mode Exit fullscreen mode

为什么?

  • 🦁 专为编译库而构建
  • 📦 轻量级捆绑包大小(<1kb brotli+min)
  • ⚡ 快速运行时操作
  • 🛠️ 使用驱动程序进行组合,默认情况下是合理的

后续步骤

我想使用 babel JSX AST 插件引导编译器,并探索在构建时自动应用标志、增量和键的可能性,以优化不必要的差异。

此外,我想看看可以为新的 UI 库构建哪些新范例和 API,以及更大程度地采用 Million.js 或切向意识形态的可能性。

总而言之,我对过渡 UI 库的未来感到兴奋,我希望 Million.js 能够迈向这个未来!

了解更多:

文章来源:https://dev.to/aidenybai/millionjs-100-release-3pna
PREV
成为全栈开发人员 - 第 0 部分:决策、计划、例程
NEXT
每个 Web 开发人员都必须尝试的 100 多个免费资源