这些前端新技术你很难再忽视了 —— Bun

简介: 这些前端新技术你很难再忽视了 —— Bun

image.png新系列《这些前端新技术你很难再忽视了》,包括:SolidJS、Svelte、Tauri、Bun、Schema等。每一个都引领前端技术演变趋势,很有必要了解。


咱们将采用 5W1H 分析法,即 What(何事)、Why(何因)、Where(何地)、When(何时)、何人(Who)、How(何法)6 个维度来解析这些“新玩意儿”。

本篇带来 —— Bun

闲话少说,冲了~


  • 点赞收藏关注,今晚一夜暴富 👍👍👍


🤔What



什么是 Bun?

答:Bun 是像 Node 或 Deno(OS:话说 Deno 咱都还没看呢!) 一样的现代 JavaScript 运行时。旨在无感替代现有的 JavaScript 运行时并成为 浏览器外执行 JS 的主流环境,为用户带来性能和复杂性的提升的同时,以更好更简单的工具提高开发者的效率。

和传统的 Node.js 这种传统的 javaScript 运行时不同,Bun.js 直接内置了打包器、转译器、任务运行器和 npm 客户端,这意味着你不再需要 Webpack/Rollup/esbuild/Snowpack/Parcel/Rome/swc/babel 就可以直接运行 TypeScript、JSX!另外,Bun.js 原生支持了数百个 Node.js 和 Web API,包括约 90% 的 Node-API 函数(fs、path、Buffer 等)。


  • 科普:Zig 是一门新的系统级编程语言,相当于加强版 C 语言。Node (C++),Deno (Rust) 和 Bun (Zig) 各用各的,非常有趣。

所以 Bun 关注 3 件事:1. 迅速启动;2. 从底层提高性能水平;3. 提供丰富且完整的工具链


🧐Why



Bun 的性能很好吗?

答:是的,官网生图直出。


服务端渲染:每秒处理 HTTP 请求数

image.png


加载一个巨大的 sqlite 表:每秒平均查询次数

image.png


FFI:每秒操作数

image.png


Bun 为什么这么快?

答:Bun 是使用 Zig 写的,这个语言偏底层,可手动控制内存,因此性能可以更强。

同时它并不借助 V8 引擎(chrome),而是借助 JavaScriptCore 引擎(safari),启动和运行的速度都更快。


(追求更高、更快、更强,看来不止于体育界,在编程届同样适用。)


🤫Where



官方文档地址?

答:github.com/oven-sh/bun…

看得出项目还在起步阶段,文档还没完全在主网站上构建,目前是挂在 Gihub 项目 README 上。


🙄When



Bun 什么时候诞生的?

答:2021 年 9 月开始发布第一个版本

还是非常新的一个框架,现在 github 已经 3w+ 了


😄Who



Bun 作者是谁?

答:Jarred Sumner

image.png

这主页又绿又亮,真好看。


😁How



怎么使用?

安装 Bun CLI

官网提供了一键安装脚本,但是只能在 Linux、macOS、WSL 上运行,Windows 桌面环境无法安装,所以你如果要在 windows 上安装,需要先安装 Linux 子系统也就是 WSL。


curl https://bun.sh/install | bash

BunHTTP 服务器基于 RequestResponseWeb 标准构建


// http.js


export default {
    port: 3000,
    fetch(request) {
        return new Response("Hi, ConardLi!Welcome to Bun!");
    },
};


bun 运行(bun run:可以直接运行 JavaScriptTypeScript 文件以及 package.json 中的 scripts 脚本。)


bun run http.js


然后在浏览器中打开 http://localhost:3000

  • 根据测试,bun 运行 package.json 脚本比 npm 运行 package.json 脚本快 30 倍。
  • bun 比 npm 的包安装速度快 20 倍。

image.png


小结:Deno 还没卷到,Bun 究竟又能走到哪一步?拭目以待。


相关文章
|
15天前
|
人工智能 Rust 前端开发
前端界的未来趋势:掌握这些新技术,让你的作品走在时代前沿!
【10月更文挑战第30天】前端开发正以前所未有的速度发展,新技术层出不穷。本文探讨了AI助手(如GitHub Copilot)、低代码/无代码平台、跨平台技术(如React Native)和WebAssembly等未来主流技术,并附上示例代码,帮助你走在时代前沿。
42 1
|
8天前
|
前端开发 JavaScript
前端界的革命:掌握这些新技术,让你的代码简洁到让人惊叹!
前端技术的快速发展带来了许多令人惊叹的新特性。ES6及其后续版本引入了箭头函数、模板字符串等简洁语法,极大减少了代码冗余。React通过虚拟DOM和组件化思想,提高了代码的可维护性和效率。Webpack等构建工具通过模块化和代码分割,优化了应用性能和加载速度。这些新技术正引领前端开发的革命,使代码更加简洁、高效、可维护。
12 2
|
13天前
|
前端开发 开发者 C++
独家揭秘:前端大牛们如何高效学习新技术,保持竞争力!
【10月更文挑战第31天】前端技术飞速发展,如何高效学习新技术成为关键。本文通过对比普通开发者与大牛们的策略,揭示了高效学习的秘诀:明确目标、主动探索、系统资源、实践应用和持续学习。通过这些方法,大牛们能更好地掌握新技术,保持竞争力。示例代码展示了如何通过实践加深理解。
32 4
|
15天前
|
前端开发 JavaScript API
前端界的革命性突破:掌握这些新技术,让你的作品引领潮流!
【10月更文挑战第30天】前端技术日新月异,从传统的HTML、CSS、JavaScript到现代的React、Vue、Angular等框架,以及Webpack、Sass等工具,前端开发经历了巨大变革。本文通过对比新旧技术,展示如何高效掌握这些新技术,助你作品引领潮流。
32 2
|
25天前
|
JavaScript 前端开发 Serverless
前端全栈之路Deno篇:Deno2.0与Bun对比,谁更胜一筹?可能Deno目前更适合serverless业务
在前端全栈开发中,Deno 2.0 和 Bun 作为新兴的 JavaScript 运行时,各自展现了不同的优势。Deno 2.0 重视安全性和多平台兼容性,尤其是对 Windows 的良好支持和原生 TypeScript 支持;而 Bun 则以卓越的性能和简便的开发体验著称,适合快速迭代的小型项目。两者在不同场景下各具特色,Deno 更适合企业级应用和serverless,Bun 则适用于追求速度的项目。
109 1
|
6月前
|
前端开发 JavaScript vr&ar
前端新技术探索:WebAssembly、Web Components与WebVR/AR
【4月更文挑战第12天】WebAssembly、Web Components和WebVR/AR正重塑Web应用的未来。WebAssembly允许C/C++等语言在Web上高效运行,提供接近原生的性能,如游戏引擎。Web Components通过Custom Elements和Shadow DOM实现可复用的自定义UI组件,提升模块化开发。WebVR/AR(现WebXR)则让VR/AR体验无需额外应用,直接在浏览器中实现。掌握这些技术对前端开发者至关重要。
84 3
|
资源调度 前端开发 JavaScript
这些前端新技术你很难再忽视了 —— Monorepo
这些前端新技术你很难再忽视了 —— Monorepo
这些前端新技术你很难再忽视了 —— Monorepo
|
存储 资源调度 前端开发
这些前端新技术你很难再忽视了 —— pnpm
这些前端新技术你很难再忽视了 —— pnpm
|
JSON 前端开发 JavaScript
这些前端新技术你很难再忽视了 —— JSON Schema
这些前端新技术你很难再忽视了 —— JSON Schema
|
1月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
130 2