【大神玩花】借助WASM在浏览器中运行数据库

玩的就是花

不得不说,大神们玩的就是花!把PostgreSQL代码编译成WASM,在浏览器中运行,先不说有用没用,光看效果就挺炸裂。

下图是直接运行在浏览器中的PostgreSQL数据库,由于需要在浏览器中运行一个小型的前端虚拟机,需要下载大约30M的资源,因此第一次打开需要等几秒,感兴趣的可以自己玩一下。

上面这个是两年前的东东了,具体有啥用呢?目前看到老外已经用该技术构建了一个PostgreSQL教程网站,说实话,对于体验过在线学习HTML、JavaScript的同学来说,还是非常实用的,随时可以学习SQL:

这是开源版本的源代码地址:github.com/snaplet/pos...

还有更花的

瞄了一眼上面的的开源项目使用的技术,里面有一个v86项目,可以说没有最花只有更花:

基于v86这个模拟器,可以在浏览器中玩很多花样,比如模拟一些PC上的游戏:

甚至直接在浏览器里面跑windows操作系统:

在线演示的链接:copy.sh/v86/?profil...

上面的搞法都有一个比较明显的缺点,前端代码体积挺大的,打开的时候需要等一会儿,不过足够酷炫。

新玩法

最近又有大神在折腾了,上周才开源的一个前端库,没几天已经2.8K的星星了。

github.com/electric-sq...

仍旧是在前端运行PostgreSQL,相同的目标,不同的思路。

PGlite is a WASM Postgres build packaged into a TypeScript client library that enables you to run Postgres in the browser, Node.js and Bun, with no need to install any other dependencies. It is only 3.7mb gzipped.

依旧是WASM路线,不过体积已经优化到只有3.7mb了,对于一个数据库系统来说,已经足够小了。更为重要的是,前端代码可以操控数据库了:

import { PGlite } from "@electric-sql/pglite"

const db = new PGlite()

await db.query("select 'Hello world' as message;")

// -> { message: "Hello world" }

并且可以使用浏览器的indexedDB来持久化存储数据,一个真正可用的运行在前端的数据库:

const db = new PGlite('idb://my-pgdata')

PostgreSQL免费在线服务

除了上面这种硬花,还有一些比较成熟的花样,可以在前端直接使用数据库。

MemFire Cloud提供免费的PostgreSQL数据库,还提供基于开源Supabase的应用托管服务,直接将数据库转换成API使用,算是另一种前端直接使用数据库的路子,小程序、APP、web开发都可以直接使用,感兴趣的同学可以尝试一下:cloud.memfiredb.com/auth/login?...

相关推荐
三十而立洋10 小时前
Cookie 详解:从产生到安全,一次讲透
前端·javascript
卡布鲁11 小时前
把一个 Vite + Vue3 应用塞进 qiankun (React + Umi3) 主站:十个坑的复盘
前端·javascript·react.js
李少兄11 小时前
JavaScript 隐式全局变量解析
javascript
geovindu12 小时前
sql: Transaction & Concurrency Patterns using postgresql 18
postgresql·数据库开发·数据库架构
沙蒿同学13 小时前
我用 Go 搭了一条 AI Agent 流水线:从 1 张商品图到一整套淘宝详情页
前端·javascript·后端
paopaokaka_luck14 小时前
智慧社区综合服务小程序(人脸识别、AI问答、Echarts图形化分析)
前端·javascript·spring boot·spring·数据分析·echarts
Hilaku15 小时前
为什么死磕 1px 的团队,用户体验反而更差?
前端·javascript·程序员
thinking_talk15 小时前
WorkBuddy应用生成背后的数据层:腾讯云PG
postgresql·腾讯云·云数据库
陈拉斯16 小时前
给公司年会写了个大屏抽奖系统:动画在前端跑,凭什么说结果没被改?
javascript
yzy8516 小时前
Vue中下载或打开文件的JavaScript方法
前端·javascript·vue