news 2026/7/23 16:12:07

Vue Vite开发者大会2026

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
Vue Vite开发者大会2026

本次分享围绕Vue框架、VoidZero工具链以及Cloudflare收购后的团队规划展开,重点讨论了AI时代前端框架与工具的设计思路,发布了Vue 3.6 RC、Vite 8、vite-plus等多个版本,明确了后续开源与生态支持方向。

AI对前端生态的影响

  • 主流框架的AI红利:过去一年Vue的用量因为AI推荐翻了一倍,受益于AI生成项目时主流框架语料更丰富,更容易获得推荐。

  • AI时代的框架设计思路:主流框架凭借充足语料获得先发优势,全新非主流框架突破用量难度更高,最新的GPT-5.6、fable 5已经能实现对未训练新方案的触类旁通。

  • 大版本更新的AI体验影响:Vue从v2升级到v3的大版本改动早期因为语料滞后,AI会混淆新旧写法,更新语料后问题解决,因此框架设计优先保证API稳定性,避免给AI用户带来负面影响。

  • API设计的优先级调整:AI不介意代码长度,因此API设计优先保证一致性,优先级高于简洁性;Vue 3组合式API中保留define的完整写法,不需要简化缩写,更符合AI识别需求。

  • 同文件上下文对AI更友好:AI偏好更少文件、更多上下文,tailwind在AI时代走红的核心原因是将样式、结构、逻辑全部放在同一个文件中,降低AI读取上下文的成本,和Vue单文件组件的设计思路契合。

Vue核心版本更新进展

  • Vue 3.6更新方向:Vue 3.6围绕性能和正确性优化,保持API不变,重构了响应式系统,目前已经发布RC版本,欢迎开发者试用。

  • Vapor Mode性能表现:Vapor Mode已经和React功能对齐,在业界通用的js framework benchmark中,性能已经超越Solid,比Vue 2的build速度快很多,是目前可用主流框架中性能最好的。

  • 响应式系统正确性优化:Vue 3.4、3.5、3.6每个小版本都会重构响应式系统,重构过程保证全部测试通过,不会给用户带来回归问题;Vue 3.6是目前唯一一个通过全部React对框架测试套件边界场景测试的框架。

Vue生态更新情况

  • 核心依赖的ESM改造:Pinia 4.0已经发布,目前是ESM only,彻底移除了CommonJS支持;下一步Vite Runner 6.0也会改为ESM only,Vue core 4.0也将因为ESM改造提上议程,但不会做破坏性API改动。

  • Vue语言工具优化进展:Vue语言工具团队今年清理了三百多个open issue,目前只剩十几个open issue,同时改进了跨分支类型推导、透传属性的类型识别等细节体验,主要贡献者包括Johnson、杨俊等。

  • 社区Rust重写探索项目:基于oxc用Rust重写了Vue全部工具链,包括parser、formatter、type checker,目前已经基本可用,属于非官方项目,欢迎开发者测试反馈;团队成员pikas也用Rust重写了Vue的LSP支持,探索不同方案。

  • 多终端渲染方案涌现:最近半年涌现了多个基于Vue的多终端渲染方案,包括运行在Linux上的Vue Native、运行在PSP上的Pocket JS、基于Vue的小程序渲染框架、基于Vapor Mode的Unity渲染方案、多个Terminal UI渲染方案。

Vite 8核心更新

  • 完全迁移到Rolldown:Vite 8核心更新是完全迁移到Rolldown,解决了之前依赖esbuild和Rollup带来的生产环境性能问题、环境行为不一致问题,由同一个团队垂直维护,问题可以直接在流程层面解决。

  • 实验性支持打包模式:Vite 8新增实验性的打包模式,解决原生ESM开发模式下超大型应用首次加载请求过多、浏览器性能瓶颈的问题,可以将模块打包为少数几个包加载,该功能预计今年晚些时候稳定。

VoidZero新一代工具链进展

  • 工具链能力完善:目前VoidZero工具链已经趋于完善,Oxlint实现了ESLint插件兼容和类型敏感检查,Oxfmt实现了100%和Prettier行为一致,Vitest可以替代Jest,tsdown可以替代tsup,整体可以简化项目的配置文件。

  • vite-plus核心能力:vite-plus是统一化工具链,实现了Node版本自动管理、包管理器自动匹配、支持monorepo的任务运行器,还带任务缓存功能,目前已经发布beta版本,全部MIT免费开源。

  • AI时代统一工具链的价值:AI开发中,验证代码正确性、构建、测试会占用大量等待时间,统一工具链可以压缩这部分时间,将整体开发效率提升一倍以上,同时减少AI的上下文消耗,降低AI决策成本。

Void全栈框架规划

  • 核心能力介绍:Void是基于Vite的Cloudflare原生全栈部署平台,添加插件即可获得全套全栈能力,支持多框架,自带文件路由、部分水合、Markdown页面、ISR缓存,实现了从数据库到前端的全链路类型安全。

  • 开源计划调整:Void原本计划商业化,收购后调整规划,会将框架层抽取为和Cloudflare解绑的开源项目,支持部署到其他云平台,今年晚些时候开源,可满足企业内部快速上线全栈小应用的需求,一个prompt即可完成从创建到上线。

Cloudflare收购后的团队规划

  • 开源使命不变:VoidZero加入Cloudflare后,团队架构和工作内容几乎没有变化,继续推进所有开源项目,还会获得更多资源,招聘更多成员支持开源开发。

  • 新生态支持公司成立:收购后个人出资成立了Use Your Think公司,本质类似基金会,目的是给全职参与Vue生态维护的成员提供经济支持,保障生态长期发展。

AI时代的Markdown 渲染器:

https://markstream-vue-slidev.pages.dev/1

传统Markdown渲染方案的问题

  • 全量解析渲染方案缺陷:传统方案采用全量解析、全量替换更新的模式,每次更新都会触发全量的parse和render,会打断用户操作,造成浏览器性能下降。

  • 早期无高亮渲染问题:最早期方案用pre code标签渲染代码,无语法高亮,需要等待markdown标签完全闭合后才会替换DOM,全量替换时CPU会被占满,在GPT-3这类快模型上,渲染层CPU占用会达到100%。

  • 带全量高亮渲染的问题:增加全量语法高亮后,使用Shiki、Monaco这类重量级高亮工具,DOM层级更深,全量更新成本更高,主线程和内存占用会比无高亮方案更重。

  • 框架优化效果有限:即使使用Vue这类带有性能优化策略的前端框架,依然无法解决全量更新带来的问题,最典型的问题就是代码块内的文本选中状态会在更新后丢失。

Markstream View核心优化思路

  • 分层性能优化:Markstream View不仅在渲染层做优化,还在解析层同时做性能优化,仅处理新增的尾部内容,复用已稳定的历史节点,同时将渲染拆分到多帧执行。

  • 极低性能占用:演示demo显示,流式渲染未闭合标签时,主线程CPU占用率不到1%,远低于传统方案。

  • 极简使用方式:项目上手难度极低,安装依赖后仅需要传入content参数和标识模型输出结束的final参数,即可完成流式渲染配置。

底层解析层的优化设计

  • 增量流式解析实现:为了适配流式解析场景并处理异常边界,项目底层自研了基于TypeScript的markdown解析器,面向流式增量解析设计,支持集成现有的focus、latin等标准工具,性能优于原生方案。

  • 性能对比优势:对比remark这类基于AST的解析方案,自研解析器性能可达这类方案的500倍以上。

  • 全量场景也有优化:该解析器不仅适配流式场景,在全量markdown渲染场景也做了性能优化,拆分解析任务,替换原有解析器后性能会更好更快。

长列表渲染优化策略

  • 可视区域优先渲染:针对包含长AI对话历史的全量渲染场景,项目优先保证可视区域内容的渲染。

  • 不阻塞用户交互:通过合理使用if条件控制渲染,所有渲染任务不会阻塞用户的交互行为。

自定义组件集成能力

  • 适配业务自定义需求:企业业务中存在自定义格式需求,比如自定义XML格式的通知、业务自定义组件,都可以轻松集成到Markstream View中。

  • 简单API实现自定义:通过CSCustomer Component API,只需要对应XML的type,就能将流式输出的参数传入自定义组件,完成自定义渲染。

多框架多端适配能力

  • 底层解析器多端可用:底层的解析器不限制浏览器端使用,可以支持Angular、React等不同前端框架,也可以在GUI层面做解析。

  • 支持按type自定义渲染:解析器可以快速识别未完全闭合的markdown语法,输出对应内容的type,开发者可以针对不同type指定不同的渲染器,实现差异化渲染。

  • TUI场景适配验证:演讲者最近开发的View TUI项目也使用了该解析器,性能表现优异,还可以支持流式图形数据的处理。

项目落地与致谢

  • 已落地的知名项目:目前已有多个知名产品使用Markstream View,包含pcode、deep check,微软也在使用该项目。

  • 赞助与贡献致谢:演讲者所在公司开发的agent产品也在使用该项目,本次分享由该公司赞助,项目的成熟离不开所有贡献者的支持。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/7/23 16:11:12

B2B外贸询盘管理白皮书:询盘接收·智能回复·客户跟进全流程

摘要 B2B外贸询盘管理正在经历从"人工驱动"到"AI智能体驱动"的范式转移。据IDC发布的《2026年全球智能客服市场半年报》数据,2026年全球智能客服市场规模预计达186亿美元,年复合增长率58%。与此同时,Gartner 2026年企业采…

作者头像 李华
网站建设 2026/7/23 16:06:05

2026化工厂人员定位系统怎么选?这5个维度的排名比品牌更重要

品牌可以包装,但防爆合规、定位精度、融合定位、系统联动、运维成本这五个硬指标,才是决定系统能否真正落地的关键。2026年7月1日,AQ 3064.3-2025《“工业互联网危化安全生产”建设规范 第3部分:人员定位》正式实施。这意味着&…

作者头像 李华
网站建设 2026/7/23 16:05:34

iPhone17护眼钢化膜怎么选?悟赫德三大黄金标准避坑指南

刚拿到iPhone 17,贴膜几乎是每个人的第一反应,但打开购物软件搜“护眼钢化膜”,各种蓝光、绿光、紫光膜让人瞬间头大。iPhone17护眼钢化膜怎么选才能不踩坑、不花冤枉钱、又能真正让眼睛舒服一点?这篇文章不堆参数、不念说明书&am…

作者头像 李华
网站建设 2026/7/23 16:04:19

RAG技术:解决LLM幻觉问题的关键实践

1. 为什么RAG技术正在重塑AI原生应用开发三年前我第一次尝试将检索增强生成(RAG)技术应用到智能客服系统时,客户问"你们产品的保修政策是什么",系统竟然编造出一套根本不存在的条款。这个尴尬经历让我意识到&#xff1a…

作者头像 李华
网站建设 2026/7/23 15:56:30

AI工具全景地图:200+实用工具分类与选型指南

1. AI工具全景地图:200工具的终极分类指南当我们需要处理一份合同摘要时,Claude的表现往往优于ChatGPT;当要快速生成产品原型图时,Midjourney和Stable Diffusion各有擅长领域;而在代码补全场景,GitHub Copi…

作者头像 李华
网站建设 2026/7/23 15:55:57

AI微调技术:从通用模型到行业专家的关键路径

1. 微调技术:从通用AI到行业专家的蜕变之路在AI领域,我们常常遇到一个有趣的现象:那些表现优异的通用大模型,在实际业务场景中往往显得"水土不服"。就像一位博学多才的教授走进工厂车间,虽然满腹经纶&#x…

作者头像 李华