❌

阅读视图

发现新文章，点击刷新页面。

Bun v1.3.12 深度解析：新特性、性能优化与实战指南

✇掘金 前端
iDao技术魔方

Bun v1.3.12 带来了内置无头浏览器自动化、终端 Markdown 渲染、进程内定时任务等新特性，同时在性能优化和兼容性方面取得了显著进展。本文将通过示例代码和实战指南，帮助开发者快速上手这些新功能。

大家好，我是 iDao。10 年全栈开发，做过架构、运维，也在落地 AI 工程化。这里不搞虚的，只分享能直接跑、能直接用的代码、方案和经验。内容包括：全栈开发实战、系统搭建、可视化大屏、自动化部署、AI 应用、私有化部署等。关注我，一起写能落地的代码，做能上线的项目。

一、Bun.WebView：内置无头浏览器自动化

Bun v1.3.12 引入了 Bun.WebView，这是一个内置的无头浏览器自动化工具，支持 WebKit 和 Chrome 两种后端，提供类似 Playwright 的 API。

主要特性

  • 原生事件模拟：所有输入均以操作系统级别事件分发，无法被网站检测为自动化。
  • 自动等待：支持选择器操作的自动等待，确保元素可见、稳定后再执行。
  • 跨平台支持：WebKit 默认用于 macOS，Chrome 后端支持所有平台。

示例代码

以下代码展示了如何使用 Bun.WebView 进行页面导航、点击和截图：

await using view = new Bun.WebView({ width: 800, height: 600 });
await view.navigate("https://bun.sh");

await view.click("a[href='/docs']"); // 等待元素可点击并执行点击
await view.scroll(0, 400); // 模拟滚轮事件

const title = await view.evaluate("document.title");
const png = await view.screenshot({ format: "jpeg", quality: 90 });
await Bun.write("page.jpg", png);

二、Markdown 渲染：终端直接预览

Bun v1.3.12 支持直接在终端渲染 Markdown 文件，提供了两种方式：

  1. 运行 bun ./file.md。
  2. 使用 Bun.markdown.ansi() API。

示例代码

以下代码展示了如何使用 Bun.markdown.ansi() 渲染 Markdown：

const out = Bun.markdown.ansi("# Hello\n\n**bold** and *italic*\n");
process.stdout.write(out);

// 启用超链接
const linked = Bun.markdown.ansi("[docs](https://bun.sh)", { hyperlinks: true });
process.stdout.write(linked);

三、Bun.cron：进程内定时任务

Bun.cron 新增了回调函数支持，适合长时间运行的服务和容器。

示例代码

以下代码展示了如何使用 Bun.cron 定时执行异步任务：

Bun.cron("* * * * *", async () => {
  console.log("每分钟执行一次");
});

四、性能优化与新特性

URLPattern 性能提升

URLPattern.test() 和 URLPattern.exec() 的性能提升了最高 2.3 倍。

const pattern = new URLPattern({ pathname: "/api/users/:id/posts/:postId" });
pattern.test("https://example.com/api/users/42/posts/123");

Bun.stripANSI 和 Bun.stringWidth 的 SIMD 优化

Bun.stripANSI 和 Bun.stringWidth 的性能显著提升，处理速度最高提升 11 倍。

bun build 构建优化

修复了线程池问题，使低核机器上的构建速度提升了 1.43 倍。

五、Bug 修复与兼容性改进

  • 修复了多个 Node.js 兼容性问题，例如 process.env 在某些情况下为空的问题。
  • 改进了 Bun.serve 的 TCP_DEFER_ACCEPT 支持，降低了 HTTP 请求延迟。

六、升级指南与验证步骤

升级到 v1.3.12

运行以下命令升级到最新版本：

bun upgrade

验证新功能

验证 Bun.WebView 是否正常工作：

await using view = new Bun.WebView();
await view.navigate("https://example.com");
console.log(await view.title);

七、总结

Bun v1.3.12 带来了众多令人兴奋的新特性和性能优化，尤其是 Bun.WebView 和 Bun.cron 的引入，为开发者提供了更多可能性。通过本文的示例代码和实战指南，相信你已经掌握了这些新功能的使用方法。

关注 【iDao技术魔方】，获取更多全栈到AI可落地的实战干货。

❌