下一代全栈框架:Deno + Vite 的结合体!

写给还在纠结用 Next 还是 Nuxt 的你

如果你已经厌倦了:

  • 每次 npm install 都要等半天
  • 打包体积动不动就几百 KB 起步
  • 想部署到边缘节点还得研究 VercelNetlify 各种配置

那可以花三分钟了解一下 Fresh

它是 Deno 官方做的全栈框架 ,口号简单粗暴:"不写一行配置,也能跑得快。"

只需要一条命令,就能拥有 React 的开发体验、Next.js 的 SSR 能力,以及 Vite 的秒级热更新------这就是 Fresh 2 带来的全新范式。

Fresh 是什么?

FreshDeno 官方团队 打造的全栈 Web 框架,主打 零配置、零客户端 JS 默认、边缘部署

  • 运行时 :直接跑在 Deno(而非 Node.js)上,天然支持 TypeScript。
  • 渲染 :基于 Preact ,首屏纯 HTML,零 JS;交互区域采用 Islands 架构 按需 Hydrate,体积最小化。
  • 部署 :官方推荐 Deno Deploy,一键推送到全球 30+ 边缘节点;也可自建 Docker。

Fresh 2 Beta:从「尝鲜版」到「准正式版」

2024 年 9 月,Fresh 宣布 2.0 进入 Beta(RC)阶段

  • API 已冻结,向后兼容得到保证;
  • 稳定性 接近正式版,鼓励生产试用;
  • 里程碑 :内置 Vite 插件模式,把开发体验再提一档。

Vite 模式:三大升级,一键开启

只需在 fresh.config.ts 里加一行:

ts 复制代码
export default {
  build: { target: "vite" },   // 打开 Vite 模式
};
升级点 体验变化
HMR 热更新 保存即刷新,毫秒级反馈,告别整页重载。
极速冷启动 Dev Server 从秒级降到毫秒级,低端机也能秒开。
插件生态 直接复用 Vite 全量插件:UnoCSS、mdx、svg、PWA......随装随用。

30 秒上手体验

bash 复制代码
# 1. 创建项目
deno run -A -r https://fresh.deno.dev my-app

# 2. 进入目录
cd my-app

# 3. 启动开发服务器
deno task start          # 默认 Deno 原生模式
# 或
deno task start:vite     # 进入 Vite 模式(HMR & 极速冷启)

浏览器打开 http://localhost:8000 即可看到首页。

部署:Deno Deploy vs Cloudflare Pages

  • Deno Deploy(官方推荐)
bash 复制代码
  deno deploy       # 一键推送,全球边缘节点
  • Cloudflare Pages / Workers (Vite 模式专享)
    推送到 GitHub 后,Pages 自动识别 vite.config.ts 并构建,5 分钟上线。

写在最后

Fresh 2Deno 的简洁Vite 的极速 合二为一:

  • 开发Vite 一样爽快;
  • 产物Deno 一样轻量;
  • 部署边缘函数一样无服务器。

现在就把 build.target 设为 "vite",提前体验 "下一代全栈框架" 的终极形态!

  • Fresh 官网https://fresh.deno.dev/
  • Fresh 2.0https://deno.com/blog/fresh-and-vite
  • Github 地址https://github.com/denoland/fresh
相关推荐
十一.3668 分钟前
79-82 call和apply,arguments,Date对象,Math
开发语言·前端·javascript
霍格沃兹测试开发学社-小明13 分钟前
测试左移2.0:在开发周期前端筑起质量防线
前端·javascript·网络·人工智能·测试工具·easyui
用户990450177800916 分钟前
若依工作流-包含网关
前端
by__csdn26 分钟前
Vue 中计算属性、监听属性与函数方法的区别详解
前端·javascript·vue.js·typescript·vue·css3·html5
on_pluto_1 小时前
【debug】关于如何让电脑里面的两个cuda共存
linux·服务器·前端
Victor3561 小时前
Redis(154)Redis的数据一致性如何保证?
后端
r***86981 小时前
springboot三层架构详细讲解
spring boot·后端·架构
Victor3561 小时前
Redis(155)Redis的数据持久化如何优化?
后端
r***F2621 小时前
Go-Gin Web 框架完整教程
前端·golang·gin
许泽宇的技术分享1 小时前
AgentFramework-零基础入门-第08章_部署和监控代理
人工智能·后端·agent框架·agentframework