一份从 npm 下载量、GitHub stars、Stack Overflow 调研、招聘数据多维度交叉的”国外前端框架地图”。每个框架给”流行度 + 定位 + 趋势 + 适用场景”。含 React/Vue/Angular 第一梯队、Next.js/Nuxt/Astro 等 meta-frameworks、Tailwind/shadcn/ui CSS 革命、构建工具/测试/移动端等周边生态。结论：React + Next.js + shadcn/ui + Vite + Tailwind 是 2026 欧美新项目”默认套件”；Svelte/Qwik 是”性能派 + 开发者最爱”；Angular 仍是企业大项目的中流砥柱；Astro 是内容站/营销页/文档站的不二之选。
目录
- 梯队总览
- 第一梯队：UI 框架（React / Vue / Angular / Svelte / Solid / Qwik）
- 第二梯队：Meta-frameworks（Next.js / Nuxt / SvelteKit / Astro 等）
- 第三梯队：跨端与移动（React Native / Expo / Flutter / Tauri / Electron）
- 第四梯队：CSS-first 革命（Tailwind / UnoCSS / Panda CSS / Vanilla Extract）
- 第五梯队：状态管理（Zustand / Jotai / Redux Toolkit / Pinia）
- 第六梯队：UI 组件库（Material UI / Chakra / Mantine / shadcn/ui / Element Plus）
- 第七梯队：构建工具（Vite / Webpack / esbuild / SWC / Turbopack / Rspack / Bun）
- 第八梯队：数据获取 / 缓存（TanStack Query / SWR）
- 第九梯队：测试（Vitest / Jest / Playwright / Cypress）
- 第十梯队：3D / 可视化（Three.js / Babylon.js / D3）
- 2025-2026 关键变化
- 理念分类：为什么这些框架长得不一样
- 按”使用场景”的选择决策树
- 新项目”默认套件”（2026 答案）
- 数据来源与方法
1. 梯队总览
怎么定义”流行”？没有单一指标能说清楚，我用四组数据交叉看：
| 指标 | 反映什么 | 局限性 |
|---|---|---|
| npm 周下载量 | 实际安装使用量 | 重复装、CI 装、bot 都算 |
| GitHub stars | 关注度 + 社区活力 | 收藏党也点 star |
| Stack Overflow 调研（年度开发者调查） | 开发者”使用 + 想用” | 偏欧美英语区 |
| 招聘 JD 数量（LinkedIn / Indeed） | 商业需求 | 反映当下，不是趋势 |
2025-2026 综合排名（欧美为主）：
1. React —— UI 库事实标准
2. Next.js —— React 全栈框架事实标准
3. Vue / Nuxt —— 渐进式 / 亚洲更强
4. TypeScript —— （已不是"框架"，但默认必备）
5. Tailwind CSS —— utility-first CSS 事实标准
6. Angular —— 企业中坚
7. Svelte / SvelteKit —— 性能派最爱
8. Vite —— 构建工具事实标准
9. Astro —— 内容站首选
10. shadcn/ui —— 组件新范式（不是 npm 包）
下面逐梯队详细拆解。
2. 第一梯队：UI 框架
UI 框架 = 只负责”视图层”的库（区别于含路由/数据获取/SSR 的 meta-framework）。
| 框架 | npm 周下载 | GitHub stars | 定位 | 趋势 |
|---|---|---|---|---|
| React | ~5,000 万 | ~233k | UI 库（不是完整框架） | 稳坐 #1，2024 起 Server Components 推 |
| Vue | ~480 万 | ~208k | 渐进式框架 | 稳，3.x 生态成熟 |
| Angular | ~280 万 | ~97k | 完整企业框架（Google） | 略降但企业还在用 |
| Svelte | ~70 万 | ~82k | 编译时框架 | 涨，Svelte 5 runes 是突破 |
| Solid | ~25 万 | ~33k | 细粒度响应式 | 小众但快（性能 #1） |
| Qwik | ~7 万 | ~22k | Resumable（不 hydrate） | 新锐，缓慢涨 |
2.1 React（Meta/Facebook）
位置：UI 库，不是完整框架。Meta 维护，全球最大生态。
核心特征：
– JSX 语法：JS 里写 HTML-like 表达式
– Virtual DOM：diff 算法高效更新
– Hooks 范式（16.8+）：useState / useEffect 等函数式 API
– Server Components（RSC）：2024 起的革命性特性，组件可跑在服务端
– 跨端：React Native（移动）、React Three Fiber（3D）、React PDF
2025-2026 状态：
– 生态无敌：组件库、工具链、文档、StackOverflow 答案都是最多
– 争议：RSC 推动”全栈 React 化”，但学习曲线陡（client/server 边界模糊）
– 替代品压力：Svelte 5、Qwik 都在”性能 + DX”上挑战，但生态规模差距太大
适用：几乎所有场景（除了”团队就要 Vue”那种强约束）
2.2 Vue（Evan You）
位置：渐进式框架（从库到完整方案可伸缩）。Evan You（尤雨溪）独立维护。
核心特征：
– 单文件组件（SFC）：.vue 文件包含 template/script/style
– Composition API（3.0+）：类似 React Hooks 的函数式 API
– 响应式系统：ref / reactive / computed
– 学习曲线比 React 缓：模板语法对设计师友好
2025-2026 状态：
– Vue 3.5+：性能大幅提升，响应式系统重写
– 中国/亚洲市场份额 > 欧美（国内用 Vue 习惯，Element Plus 生态很成熟）
– 欧美仍稳：Vue 3 + Nuxt 3 是 Vue 圈首选组合
适用：内容站、SaaS 后台、移动 Web、对中文开发者更友好
2.3 Angular（Google）
位置：完整企业框架（含路由、表单、HTTP、依赖注入、测试、CLI 一站式）。
核心特征：
– TypeScript 原生（强类型）
– DI（依赖注入）是核心设计模式
– 装饰器：@Component @Injectable 等
– RxJS：反应式编程标配
– 学习曲线最陡
2025-2026 状态：
– 企业仍是主战场：银行/政府/医疗/大型 SaaS（大项目/长生命周期需要这种”框架级”约束）
– 新项目不选：创业公司、SaaS 初创几乎不选 Angular
– Angular 17+：standalone components、Signals（响应式）、新的控制流语法
适用：大企业后台、长期维护（5-10 年）的大型应用、政府项目
2.4 Svelte（Rich Harris）
位置：编译时框架——不打包运行时，编译成原生 JS。
核心特征：
– 零运行时：bundle size 极小（比 React/Vue 小 50%+）
– .svelte 文件：类 Vue SFC 但更简洁
– Svelte 5 runes（2024）：$state / $derived / $effect —— 真正的细粒度响应式
– 性能接近 Solid：DOM 直接更新，无 Virtual DOM
2025-2026 状态：
– Svelte 5（2024-10） = 重大突破。runes 范式让 Svelte 重新有了”杀手特性”
– SvelteKit：完整全栈方案（路由、SSR、数据获取）
– 开发者喜爱度第一：State of JS 多年 #1
– 企业采用慢：仍是个人/小团队/性能敏感项目首选
适用：性能敏感应用、SPA、希望最小 JS bundle 的项目
2.5 Solid（Ryan Carniato）
位置：跟 Svelte 类似的”无 VDOM 细粒度响应式”，但 API 更接近 React。
核心特征：
– JSX + 函数组件，API 跟 React 几乎一样（学习成本低）
– 真·细粒度响应式：只有用到的 DOM 节点更新
– 性能 #1：benchmark 跑分全场景领先
– SolidStart：全栈框架
2025-2026 状态：
– 极小众：~25k 周下载，~33k stars
– 极受推崇：用过的人都说好
– 企业几乎不用：招聘需求很少
适用：性能极致敏感（动画、可视化、嵌入式 Web）
2.6 Qwik（Builder.io）
位置：Resumable 框架——服务端序列化状态，客户端不 hydrate，只在需要时加载 JS。
核心特征：
– “0 hydration”：首屏不下载/不执行任何 JS
– $ 符号：所有事件 handler 以 $ 结尾，编译器在需要时懒加载对应代码
– Resumability：客户端从 SSR 序列化点继续执行，不重做
2025-2026 状态：
– 理念先进：理论上首屏性能无敌
– 生态小：~7k 周下载
– 企业试水多，落地少
适用：内容站、营销页、TTI（Time to Interactive）最敏感的项目
3. 第二梯队：Meta-frameworks
Meta-framework = 在第一梯队 UI 框架之上加了路由、SSR、数据获取、构建、部署一体化的框架。
| 框架 | 基础 | 定位 | 流行度（npm 周下载） |
|---|---|---|---|
| Next.js (Vercel) | React | React 生态”官方”全栈框架 | 绝对第一，~600 万 |
| Nuxt | Vue | Vue 生态”官方”全栈框架 | Vue 圈首选，~150 万 |
| SvelteKit | Svelte | Svelte 全栈 | 涨，跟 Svelte 同步 |
| Remix（现 React Router 7） | React | 路由优先的 web 标准派 | 降（被 Next.js 压） |
| SolidStart | Solid | Solid 全栈 | 极小众 |
| Astro | 多框架支持 | 内容站 / 静态优先 | 大涨，~50 万 |
| TanStack Start (前身 tRPC Start) | React / TS | 全栈 TS，路由/数据 | 2025 新，涨 |
3.1 Next.js（Vercel）
位置：React 圈”默认”全栈框架。Vercel 公司维护。
核心特征：
– App Router（13+）：基于 React Server Components 的新路由系统
– Pages Router（旧）：传统的 pages/ 目录
– Server Components / Server Actions（2024+）：服务端组件 + 服务端 action（表单处理等）
– 内置优化：图片、字体、Script、Edge runtime
– Vercel 一键部署：零配置上线
2025-2026 状态：
– React 生态”标准答案”：新 React 项目首选
– 学习曲线陡：RSC、client/server boundary、streaming 概念复杂
– Vercel 锁定争议：能跑别处但 Vercel 上部署最舒服
– Next 15+（2025）：更稳定的 RSC、更快的 Turbopack
适用：几乎所有 React 全栈场景
3.2 Nuxt（Vue 生态）
位置：Vue 3 圈”默认”全栈框架。
核心特征：
– 约定式路由（pages/ 目录）
– Nuxt 3+（2023 GA）：基于 Vue 3 + Vite + Nitro（跨端 server engine）
– Server Engine（Nitro）：可部署 Node / Bun / Deno / Workers
– 内置：SSR/SSG、数据获取、SEO、模块系统
2025-2026 状态：
– Vue 圈默认答案
– 生态略弱于 Next.js：但差距在缩小
– 国内使用率高于欧美：阿里、字节、腾讯内部都有大量 Nuxt 项目
适用：Vue 全栈项目
3.3 SvelteKit
位置：Svelte 圈”官方”全栈方案。
核心特征：
– 基于 Svelte 5 runes（2024+）
– 文件路由 + load 函数（约定式数据获取）
– adapter 概念：可适配 Vercel / Netlify / Cloudflare / Node / 静态
– 表单 action：服务端 action 模式
2025-2026 状态：
– 小而美：性能 + DX 平衡
– 生态小：但 Svelte 5 之后明显加速
3.4 Astro
位置：“内容站/营销页”领域的事实标准。支持任何 UI 框架（React / Vue / Svelte / Solid 都能用）。
核心特征：
– Islands Architecture：默认零 JS 输出，只有标了 client:* 的组件才发 JS
– Content Collections（2024+）：类型安全的内容/MDX 管理
– 多框架混合：一个项目里 React + Vue + Svelte 共存
– Astro 5+（2024-12）：Server Islands（按需 SSR 单个组件）
2025-2026 状态：
– 内容站首选：博客、文档站、营销页、Landing page
– 与 Next.js 互补：Astro 做静态/内容，Next.js 做重交互应用
– 社区猛涨：npm 周下载 ~50 万，增速第一
适用：博客、文档站、营销页、官网、电商详情页
3.5 Remix → React Router 7
位置：web 标准派（依赖浏览器原生 form/loader 模式）。
2024 关键变化：Remix 团队加入 React Router，Remix v3 改名为 React Router v7（2024-12）。Remix 精神保留为 RR7 的 framework mode。
核心特征：
– loaders / actions：基于浏览器原生 form
– 嵌套路由
– 数据并行的 SSR
2025-2026 状态：
– 被 Next.js 压：理念好但生态/招聘不如
– RR7 转型：通过 React Router 名义延续生命
3.6 TanStack Start（新）
位置：TanStack Query 团队 2025 年 GA 的全栈框架。
核心特征：
– type-safe 全栈：端到端 TypeScript
– 基于 TanStack Router（极强类型路由）
– 服务端函数：RPC 模式
2025-2026 状态：
– 新项目，增速快
– 小众但被看好（TanStack Query 团队信誉 + 创新性）
4. 第三梯队：跨端与移动
| 框架 | 出品方 | 备注 | 流行度 |
|---|---|---|---|
| React Native + Expo | Meta / 6502 | 跨端 #1 | ~50 万 npm 周下载（Expo） |
| Flutter | Dart 语言 | ~16 万 | |
| Ionic + Capacitor | Ionic 团队 | Web 技术栈 | 略降 |
| NativeScript | nStudio | 老牌 | 极小众 |
| Kotlin Multiplatform Mobile (KMM) | JetBrains | 跟 Compose Multiplatform 合并 | 涨 |
| SwiftUI | Apple | iOS 专属 | 必用 |
| Jetpack Compose | Android 专属 | 必用 | |
| Tauri | Tauri 团队 (Rust) | 桌面应用，Electron 替代 | ~15 万 |
| Electron | GitHub (原 Atom) | 桌面应用 | 仍 #1，~1100 万 |
| Neutralino.js | Neutralinojs | 轻量桌面 | 极小众 |
4.1 React Native + Expo
位置：跨 iOS + Android 移动开发的事实标准。用 React 写原生 UI。
Expo（2016-，独立公司 6502）= RN 的”现代发行版”：
– Expo CLI 一键初始化
– EAS Build（云端构建 iOS/Android，开发者无需 Mac）
– Expo Router（基于文件的路由）
– Expo SDK 50+（Camera/Location/Notifications 一行集成）
2025-2026 状态：
– 事实标准：跨端创业公司首选
– 新架构（Fabric/TurboModules） 2024 稳定：性能大幅提升
– 与 Web 边界模糊：Expo Router 支持 universal app
4.2 Flutter
位置：Google 自绘 UI 框架，跨移动 / Web / 桌面 / 嵌入式。
核心特征：
– Dart 语言
– 自绘 Skia 引擎：跟 OS 控件脱钩，UI 完全一致
– Impeller 渲染器（2023+）：iOS 性能大幅提升
– Hot Reload
2025-2026 状态：
– 企业采用增加：BMW、阿里、字节部分项目
– 学习曲线：Dart + 自绘思路需要适应
– Web/桌面：能用但不如 RN 顺
适用：自定义 UI 强、跨端一致、3D 动画
4.3 Tauri
位置：Electron 替代品。Rust 写核心 + 系统 WebView（WKWebView / WebView2 / WebKitGTK）做 UI。
核心特征：
– bundle size 1/10 Electron（几 MB vs 几十 MB）
– 内存占用 1/3
– Rust 写后端（IPC 极快、类型安全）
– Tauri 2.0（2024）：跨移动（iOS + Android）+ 桌面
2025-2026 状态：
– 抢 Electron 份额：VSCode 之外的小型桌面应用首选
– Rust 学习曲线：拦了一些 JS 开发者
适用：需要轻量 + 跨桌面 + 移动的应用
4.4 Electron
位置：老牌桌面框架。Node.js + Chromium 打包。
核心特征：
– 生态最全：VSCode、Slack、Discord、Figma、Notion 都在用
– bundle 大：基础 100MB+
– 内存重：每个 Electron 应用带一个 Chromium 进程
2025-2026 状态：
– 仍是 #1：Web 开发者跨桌面的最简单路径
– 被 Tauri 抢小应用市场
5. 第四梯队：CSS-first 革命
核心问题：怎么写样式。10 年前是 CSS 文件、然后 SCSS/Less、然后 CSS-in-JS、现在 utility-first 赢了。
| 框架 | 定位 | 流行度 |
|---|---|---|
| Tailwind CSS | Utility-first CSS（已统治） | ~600 万周下载（v4） |
| UnoCSS | Tailwind 替代品，按需生成，极快 | ~10 万 |
| Panda CSS | Chakra 团队，零运行时 CSS-in-JS | 涨 |
| Vanilla Extract | TS 写 CSS，零运行时 | ~5 万 |
| StyleX (Meta) | Facebook/Instagram 内部用的 CSS-in-JS | 小众 |
| Pinceau | Nuxt 生态的 CSS 框架 | 极小 |
| Stitches | 已停止维护 | 退场 |
| Emotion | CSS-in-JS 老牌 | 略降 |
| styled-components | CSS-in-JS 老牌 | 略降 |
| Panda CSS | 见上 | 涨 |
| Open Props | CSS 变量集 | 涨 |
| Linaria | 零运行时 CSS-in-JS | 极小 |
5.1 Tailwind CSS（Adam Wathan）
位置：utility-first CSS 框架的代名词。”HTML 里写 class，不用写 CSS”。
核心特征：
– 原子 class：flex items-center px-4 py-2 bg-blue-500 text-white rounded
– 设计系统内置：颜色、间距、字号都是规范值
– JIT 模式（v3+）：按需生成 CSS，bundle 极小
– Tailwind 4（2024-12）：CSS-first 配置（不再用 tailwind.config.js），Lightning CSS 引擎
2025-2026 状态：
– 统治：React/Vue/Svelte/Astro/任何 UI 框架都会用
– 争议：HTML 看起来”乱”（vs 传统 CSS 分离）
– 不可逆：新项目默认选 Tailwind
适用：几乎所有项目（除了纯 CSS 极简 demo）
5.2 UnoCSS（Anthony Fu）
位置：Tailwind 的”按需 + 更快 + 更灵活”版本。
核心特征：
– 极速：比 Tailwind JIT 还快
– 可自定义 preset：可以定义自己的 utility
– 多模式：Tailwind 兼容 / Wind 简写 / 自定义
2025-2026 状态：
– 小但精：Anthony Fu（Vue 团队、Vitest 作者）出品
– 是 Nuxt / Vite 用户的隐藏选项
5.3 旧时代的退场
CSS-in-JS 整体在退潮（Tailwind 抢了太多）：
– styled-components、Emotion 仍在用但新项目少选
– Stitches 已停止维护
– StyleX 仍 Meta 内部用
为什么 Tailwind 赢了：
1. 跟 RSC / SSR 兼容好（CSS-in-JS 跟 SSR 一直有问题）
2. bundle 体积小
3. 设计系统一致
4. 不需要想 className 命名
6. 第五梯队：状态管理
| 库 | 框架 | 备注 | 周下载 |
|---|---|---|---|
| Redux Toolkit | React | 仍是企业级标配 | ~600 万 |
| Zustand | React | 已超 Redux，~700 万 | ~700 万 |
| Jotai | React | 原子化，跟 Zustand 抢 | ~200 万 |
| Pinia | Vue | Vue 3 官方推荐 | ~150 万 |
| Nanostores | 多框架 | 极小（< 1KB） | ~10 万 |
| TanStack Query | 多框架 | 数据获取/缓存 | ~1000 万 |
| SWR | React | Vercel 维护，跟 TanStack 抢 | ~400 万 |
| MobX | React/Vue/Angular | 反应式 OOP 风格 | ~150 万 |
| XState | 多框架 | 状态机 | ~30 万 |
| Valtio | React | 代理式状态 | ~80 万 |
| Recoil (Meta) | React | 已停止维护 | 退场 |
| Apollo Client | GraphQL | 跨框架 | ~200 万 |
| urql | GraphQL | 跨框架 | ~50 万 |
6.1 Zustand（Poimandres）
位置：React 状态管理的新王者，超过 Redux。
核心特征：
– 极简 API：create((set) => ({...}))
– 无 boilerplate：跟 Redux Toolkit 的 slices / reducers 形成对比
– 不绑定 React：底层是 vanilla store
– TypeScript 友好
2025-2026 状态：
– 新项目默认：Zustand 几乎成了 React 状态管理的”中性选择”
– Redux 仍占企业：但新项目首选 Zustand
6.2 Pinia（Vue）
位置：Vue 3 官方推荐状态管理（取代 Vuex）。
核心特征：
– 类似 Composition API 的 defineStore 写法
– TypeScript 完美支持
– 支持 devtools
6.3 TanStack Query（Tanner Linsley）
位置：数据获取/缓存的”事实标准”。其实不算是”状态管理”，是”服务器状态管理”。
核心特征：
– 缓存 + 重新请求 + 乐观更新 自动化
– 跨框架：React / Vue / Svelte / Solid / Angular 都有 adapter
– DevTools 极强
2025-2026 状态：
– 统治：~1000 万周下载，几乎是任何带数据获取的项目必装
– 跟 Zustand / Redux 互补：本地状态用 Zustand，服务器状态用 TanStack Query
6.4 状态管理的”分层”思想（2025 主流）
┌──────────────────────────────────────┐
│ UI 组件局部状态 │ ← useState / ref
├──────────────────────────────────────┤
│ 全局 UI 状态 │ ← Zustand / Pinia
│ (主题/侧边栏/用户偏好) │
├──────────────────────────────────────┤
│ 服务器状态 │ ← TanStack Query / SWR
│ (用户列表/订单数据/API 数据) │
├──────────────────────────────────────┤
│ URL 状态 │ ← nuqs / useSearchParams
│ (查询参数/路由) │
├──────────────────────────────────────┤
│ 表单状态 │ ← React Hook Form / Zod
└──────────────────────────────────────┘
新项目不再追求”一个 store 管所有”——分层管，每层用对的工具。
7. 第六梯队：UI 组件库
UI 组件库 = 提供 Button/Table/Form/Modal 等成品组件。
| 库 | 框架 | 备注 | 周下载 |
|---|---|---|---|
| Material UI (MUI) | React | Google Material Design | ~400 万 |
| Chakra UI | React | 简洁，最爱 | ~100 万 |
| Mantine | React | 涨，社区最爱 | ~50 万 |
| Ant Design (antd) | React | 中国公司出海首选 | ~80 万 |
| Radix UI | React | 无样式 headless | ~50 万 |
| shadcn/ui | React | 不是包，是复制粘贴代码 | N/A |
| Element Plus | Vue 3 | 中国国内主流 | ~22 万 |
| Vuetify | Vue | Material Design | ~50 万 |
| Naive UI | Vue 3 | 涨，TS 友好 | ~5 万 |
| PrimeVue | Vue | 企业级 | ~10 万 |
| Quasar | Vue | 跨端能力强 | ~10 万 |
| Angular Material | Angular | 官方 | ~30 万 |
| PrimeNG | Angular | 企业首选 | ~15 万 |
| Ionic | Angular/React/Vue | 移动端 UI | ~10 万 |
| HeroUI (NextUI) | React | 涨 | ~5 万 |
| Park UI | 多框架 | Ark UI 基础 | 极小 |
| Bootstrap | 多框架 | 老牌 | ~300 万 |
| Bulma | 多框架 | CSS-only | ~3 万 |
| Flowbite | 多框架 | Tailwind 组件 | ~10 万 |
| DaisyUI | 多框架 | Tailwind 组件 | ~20 万 |
7.1 shadcn/ui（一个范式革命）
位置：2024-2026 年最热的”组件库”——但它不是 npm 包。
核心特征：
– 不是安装：npx shadcn@latest add button 把代码复制到你的项目里
– 基于 Radix UI（无样式 headless）+ Tailwind CSS
– 完全可定制：你拥有代码所有权，想怎么改怎么改
– CLI 添加：每个组件单独 add，不想要的不会进 bundle
2025-2026 状态：
– 事实上的 React 组件新标准
– 生态爆炸：shadcn 衍生了大量主题（shadcn-nuxt、shadcn-svelte 等）
– 开源界最被 fork 的项目之一
适用：所有 React + Tailwind 项目
7.2 MUI (Material UI)
位置：React 圈最成熟的”成品组件库”。
核心特征：
– 完整 Google Material Design 实现
– MUI X：高级表格、日期选择器、Charts
– TypeScript 优秀
2025-2026 状态：
– 企业首选：需要”全功能 + 不重设计”的项目常用
– 样式绑定：组件长得很”Google”，要换风格需要 sx prop / theme
7.3 Ant Design
位置：中国/亚洲企业的默认选择。阿里出品。
核心特征：
– 完整后台组件：Table / Form / Tree / Cascader 等
– 国际化做得最好：内置 50+ 语言
– 企业级质量
2025-2026 状态：
– 国内企业默认
– antd v5（2022+）：CSS-in-JS（cssinjs）+ React 18 兼容
– 出海项目也用（对欧美开发者不友好的是”长得像国内后台”）
7.4 Element Plus
位置：中国国内 Vue 圈默认。饿了么团队维护。
2025-2026 状态：
– 国内 Vue 后台标配
– Element UI（Vue 2 老版）已停更，Element Plus（Vue 3 版）持续维护
7.5 Naive UI（TypeScript 友好的 Vue 组件库）
位置：Vue 3 时代崛起的”轻量 + TS 友好”组件库。
核心特征：
– TypeScript 写出，所有组件有完整类型
– 主题可定制
– tree-shakable
2025-2026 状态：
– Vue 圈新项目越来越选 Naive UI 而不是 Element Plus
– 国内国外都有采用
8. 第七梯队：构建工具
构建工具 = 把 TS/JSX/CSS/图片 变成浏览器能跑的 bundle。
| 工具 | 角色 | 周下载 | 速度 |
|---|---|---|---|
| Vite (Evan You) | 前端 dev server + build | #1，~900 万 | 极快（基于 esbuild） |
| Webpack | 老牌打包器 | ~3500 万 | 慢 |
| esbuild | Go 写的 TS/JS 编译器 | ~3000 万（间接） | 极快 |
| SWC | Rust 写的 TS/JS 编译器 | ~500 万 | 极快 |
| Turbopack (Vercel) | Webpack 替代 | ~5 万 | 极快 |
| Rspack (字节) | Webpack 兼容 + Rust 速度 | ~30 万 | 极快 |
| Farm | Rust 写的新构建器 | 极小 | 极快 |
| Bun Bundler | Bun 自带 | 涨 | 极快 |
| Rollup | 库打包首选 | ~1500 万 | 快 |
| Parcel | 零配置打包 | 略降 | 中 |
| tsc | TS 官方编译器 | ~5000 万 | 慢但必要 |
| Lightning CSS | 极快 CSS 解析/压缩 | 涨 | 极快 |
| Biome | Rome 团队的 linter+formatter | 涨 | 极快（Rust） |
| oxc | Rust 写的 JS 工具链 | 涨 | 极快 |
8.1 Vite（Evan You）
位置：2025-2026 dev server 事实标准。
核心特征：
– 基于 ESM 的 dev server：冷启动 < 1s（vs Webpack 30s+）
– 生产构建基于 Rollup
– HMR 极快
– 插件生态丰富：覆盖 Vue/React/Svelte/任何框架
2025-2026 状态：
– 新项目默认：~900 万周下载
– Rollup 4+（Vite 6/7）：构建速度进一步提升
– Vite 6+（2024-12）：SSR + 静态站点支持大幅增强
8.2 Webpack 5
位置：老牌构建工具，仍有海量存量项目。
2025-2026 状态：
– 新项目不选 Vite 就选 Turbopack/Rspack
– 存量维护：无数大项目仍在 Webpack 5
– Webpack 5 持续更新：模块联邦、asset modules、persistent caching
8.3 SWC（Rust 写的 TS/JS 编译器）
位置：Next.js 内部用，跟 esbuild 抢”fast transpiler”。
核心特征：
– 比 esbuild 还快（Rust vs Go）
– Babel 的 drop-in 替代
– TypeScript / JSX / 现代语法 全支持
8.4 Rspack（字节跳动 / ByteDance）
位置：Webpack 兼容 API + Rust 速度。
核心特征：
– 跟 Webpack 配置基本一致（migrate 几乎零成本）
– 比 Webpack 快 5-10x
– Modern.js / Rsbuild（字节的元框架）底层
2025-2026 状态：
– 大厂迁移首选：字节、京东部分项目从 Webpack 迁 Rspack
– Rsbuild：基于 Rspack 的更高层抽象，类似 Vite
8.5 Turbopack（Vercel）
位置：Next.js 默认构建器（2024+ GA stable）。
核心特征：
– Vercel 团队（Webpack 作者 Tobias Koppers）开发
– 基于 SWC
– Webpack 兼容
8.6 Bun Bundler
位置：Bun 自带的构建工具。
2025-2026 状态：
– Vite 替代品之一（API 略不同但目标一致）
– 跟 Bun runtime 配合最佳
8.7 Biome（前 Rome）
位置：linter + formatter 替代 ESLint + Prettier，Rust 写，极快。
2025-2026 状态：
– 新项目默认：替代 ESLint + Prettier
– Rspack 团队也参与
9. 第八梯队：数据获取 / 缓存
核心问题：从后端 API 拿数据，处理 loading / error / 缓存 / 重新请求。
| 库 | 周下载 | 备注 |
|---|---|---|
| TanStack Query | ~1000 万 | 跨框架，事实标准 |
| SWR (Vercel) | ~400 万 | React 圈 |
| Apollo Client | ~200 万 | GraphQL 首选 |
| urql | ~50 万 | GraphQL 轻量 |
| RTK Query (Redux Toolkit) | ~100 万 | 跟 Redux 强绑定 |
| tRPC | ~50 万 | 端到端类型安全 RPC |
| oRPC | 新 | tRPC 风格 + 跨框架 |
| Hono RPC | 涨 | Hono 服务端的 RPC |
| React Query | 改名 TanStack Query | 同上 |
| SWR + React 19 | 涨 | use() hook 协同 |
9.1 TanStack Query（Tanner Linsley）
位置：数据获取层的”jQuery” —— 必装。
核心特性：
– 自动重试 / 缓存失效 / 重新请求
– 乐观更新
– 分页 / 无限滚动 / Suspense 集成
– DevTools 强大
9.2 tRPC
位置：端到端类型安全的 RPC 库（不通过网络协议，类型在编译时共享）。
核心特性：
– 服务端定义 schema，客户端自动获得类型
– 不需要 OpenAPI / GraphQL
– Next.js / Nuxt / SvelteKit / 任何 Node 框架都支持
2025-2026 状态：
– TS 全栈项目的”杀手锏”
– 生态：Prisma / Drizzle ORM 配合最佳
10. 第九梯队：测试
| 工具 | 用途 | 周下载 | 备注 |
|---|---|---|---|
| Vitest | 单元/组件测试（Vite 生态） | ~500 万 | Vite 项目首选 |
| Jest | 老牌测试 | ~2500 万 | 仍 React 主流 |
| Playwright (Microsoft) | E2E 测试 | #1，~600 万 | 跨浏览器 |
| Cypress | E2E 测试 | ~400 万 | 被 Playwright 抢 |
| Storybook | 组件开发 + 文档 | ~300 万 | 仍是设计系统核心 |
| Testing Library | 组件测试 | ~2500 万 | React Testing Library 最知名 |
| Chromatic | Storybook 视觉回归 | ~5 万 | 商业 |
| Happy DOM | 轻量 DOM 模拟 | 涨 | Vitest 内部用 |
| jsdom | Node DOM 模拟 | ~3500 万 | Jest 默认 |
| Mock Service Worker (MSW) | API mock | ~300 万 | 跨测试 |
| Pact | 契约测试 | 涨 | 微服务 |
| K6 / Grafana k6 | 性能测试 | 涨 | 压测 |
| Wallaby.js | 商业测试工具 | 极小 | 商业 |
| Qwik City Test | Qwik 测试 | 极小 | 新 |
10.1 Playwright（Microsoft）
位置：E2E 测试的事实标准。取代了 Cypress。
核心特性：
– 跨浏览器：Chromium / Firefox / WebKit（Safari）
– 多语言 SDK：JS / TS / Python / Java / .NET
– 自动等待：智能等待元素
– Trace Viewer：可视化调试
– Playwright Test：内置 test runner
2025-2026 状态：
– GitHub Stars 超越 Cypress
– VS Code 插件 + Trace Viewer + 录制器 体验最好
10.2 Vitest
位置：Vite 生态的 Jest 替代。
核心特性：
– 极快：HMR 模式（改文件立即跑测试）
– API 跟 Jest 兼容（describe it expect）
– TypeScript / ESM 原生
10.3 Mock Service Worker (MSW)
位置：API 模拟的现代方案。比 nock / axios-mock-adapter 更优雅。
核心特性：
– 浏览器 service worker + Node interceptor 双重支持
– 跟 fetch 真实集成
– Storybook / Vitest / Playwright 都好用
11. 第十梯队：3D / 可视化
| 库 | 用途 | 备注 |
|---|---|---|
| Three.js | WebGL 3D | 仍是 3D 事实标准 |
| Babylon.js | WebGL 3D | 微软维护，游戏向 |
| PixiJS | WebGL 2D 游戏 | 性能好 |
| Phaser | 2D 游戏引擎 | 完整游戏框架 |
| D3 | 数据可视化 | 老牌 |
| Visx (Airbnb) | D3 + React 封装 | 涨 |
| Observable Plot | D3 作者新项目 | 高分可视化 |
| Apache ECharts | 图表 | 国内主流（百度出品） |
| Chart.js | 简单图表 | 经典 |
| Recharts | React 图表 | 涨 |
| Nivo | React 图表 | 涨 |
| Vega / Vega-Lite | 声明式可视化 | 学术 |
| Highcharts | 商业图表 | 商业首选 |
| Plotly.js | 科学图表 | 学术 |
| Mapbox GL JS | 地图 | 商业 |
| Leaflet | 地图 | 开源 |
| deck.gl | Uber 出品大数据地图 | 涨 |
| React Three Fiber | Three.js 的 React 封装 | 涨 |
| drei | R3F 工具集 | 极常用 |
| React Spring | 物理动画 | 跟 R3F 协同 |
| Motion (前 Framer Motion) | 动画 | 涨 |
| GSAP | 时间轴动画 | 老牌商业 |
| Lottie | 设计师动画导出 | 字节跳动维护 |
| anime.js | 动画库 | 涨 |
| Auto-Animate | 一行动画 | 涨 |
| WebGPU | 浏览器原生 GPU | 2025 开始 GA |
12. 2025-2026 关键变化
12.1 shadcn/ui 取代了所有”组件库”地位
shadcn/ui 不是 npm 包，是复制粘贴的代码。Radix UI（headless）+ Tailwind 的组合，让项目拥有完整组件代码所有权。
影响：
– 组件库生态从”装包”变成”复制”
– 大量 shadcn 衍生主题（shadcn-nuxt、shadcn-svelte、shadcn-vue）
– 2024 年 GitHub 仓库增速第一的前端项目
12.2 Vite 完全吃掉了 Webpack 的新项目市场
| 工具 | 2020 份额 | 2024 份额 | 趋势 |
|---|---|---|---|
| Webpack | 80% | 30% | 存量多 |
| Vite | < 5% | 50% | 新项目默认 |
| Turbopack | 0% | 5% | Next.js 内置 |
| Rspack | 0% | 5% | 大厂迁移 |
12.3 React Server Components（RSC）改变一切
Next.js 13+ 的 RSC 改变了 React 项目的结构：
– 组件可以默认在服务端跑（不下载 JS）
– Server Action 让表单处理无需写 API route
– Streaming SSR 改善 TTFB
争议：RSC 概念复杂，client/server 边界模糊。学习曲线陡。
12.4 Svelte 5 runes 让 Svelte 重新有了”杀手特性”
Svelte 5（2024-10）推出 runes 范式：
– $state 声明响应式状态
– $derived 声明派生
– $effect 副作用
意义：从”框架自动推断响应式”变成”显式声明”，细粒度响应式 + 跟 Solid / Vue 3 ref / Qwik signals 思路一致。
12.5 TanStack Start（2025 末 GA）
TanStack Query 团队做的全栈框架。端到端类型安全 + 基于 TanStack Router。
12.6 Astro 5（2024-12）：Server Islands
Astro 的”按需 SSR 单个组件”概念——静态页里某些部分可以服务端动态渲染。不用整个 page 重 SSR。
12.7 Tauri 2.0（2024）：跨桌面 + 移动
Tauri 不再只是桌面，也能打 iOS / Android APK。Electron 替代品势头猛。
12.8 Bun 替代 Node 在工具链位置
Bun 替代了：
– Node（runtime）
– npm/yarn/pnpm（包管理）
– esbuild（transpile）
– Jest（test runner）
– Webpack（部分场景）
不是直接替代前端框架，但前端项目都受益于 Bun。
12.9 表单库：React Hook Form 稳，TanStack Form 涨
| 库 | 周下载 | 趋势 |
|---|---|---|
| React Hook Form | ~700 万 | 稳，仍是 React 默认 |
| TanStack Form | 涨 | 跨框架、type-safe |
| Conform | 涨 | 跟 Remix/Next.js 协同 |
| Formik | ~200 万 | 退潮 |
| Final Form | 极小 | 退潮 |
| VeeValidate | Vue 圈 | 稳 |
| @felte/core | Svelte 圈 | 涨 |
| Zod | ~3500 万 | 类型验证库事实标准（不仅是表单） |
12.10 ORM / 数据库工具
| 库 | 用途 | 流行度 |
|---|---|---|
| Prisma | ORM | ~500 万周下载 |
| Drizzle ORM | TypeScript ORM | 涨，~200 万 |
| Kysely | 类型安全 SQL builder | 涨 |
| Knex | 老牌 query builder | 稳 |
| Sequelize | 老牌 ORM | 退潮 |
| TypeORM | 老牌 | 退潮 |
| Mongoose | MongoDB ODM | 稳 |
| pg | Node Postgres driver | 涨 |
Drizzle 跟 Prisma 抢（Drizzle 更”SQL-first”，Prisma 更”schema-first”）。
13. 理念分类：为什么这些框架长得不一样
按”底层范式”分类，看清”谁在抄谁”：
| 理念 | 代表框架 | 关键特征 |
|---|---|---|
| Virtual DOM + diff | React、Vue 2、Solid（兼容层） | 运行时 diff 计算 |
| 编译时 / 零运行时 | Svelte、Solid（核心） | 编译成原生 JS |
| Signals 响应式 | Solid、Svelte 5、Vue 3 ref、Qwik | 细粒度追踪 |
| Resumable（不 hydrate） | Qwik、Astro Islands | SSR 序列化，客户端续跑 |
| Island Architecture | Astro、Fresh | 默认零 JS，按需 hydrate |
| Server Components / RSC | Next.js、Remix/RR7 | 组件在服务端跑 |
| Web Components 优先 | Lit、Stencil、FAST | 浏览器原生 custom elements |
| Reactive OOP | MobX | observable + autorun |
| State Machine | XState | 显式状态转移图 |
| 函数式纯 | Elm、ReasonML | 已退潮但 Elm 仍有粉丝 |
近 5 年的演进方向：
2015-2020: Virtual DOM 一统江湖
│
├── React (VDOM + Hooks)
├── Vue 2 (VDOM + Options API)
└── Svelte (编译时，杀出重围)
2020-2023: 编译时 + 细粒度响应式
│
├── Svelte 3/4 (编译时响应式)
├── Solid (细粒度 signals)
└── Vue 3 ref (signals 思想)
2023-2026: Resumable + Server Components + 多范式混合
│
├── Qwik (Resumable)
├── React Server Components (服务端组件)
├── Svelte 5 runes (显式 signals)
└── Astro Islands (多范式)
核心趋势：从”客户端框架” → “客户端 + 服务端混合架构”。
14. 按”使用场景”的选择决策树
你的项目是什么？
│
├── 内容站 / 博客 / 文档 / 营销页 / 官网
│ ├── 静态为主 + 偶尔交互
│ │ └── Astro（多框架支持 + 静态快 + MDX）
│ ├── 想要 React 生态
│ │ └── Next.js (SSG 模式) 或 Astro + React
│ └── 想要 Vue 生态
│ └── Nuxt (SSG) 或 Astro + Vue
│
├── 普通 Web App（SaaS / 后台 / 移动 Web）
│ ├── 团队熟悉 React
│ │ └── Next.js + shadcn/ui + Tailwind + Zustand + TanStack Query
│ ├── 团队熟悉 Vue
│ │ └── Nuxt + Naive UI (国内) / shadcn-vue (国外) + Pinia
│ ├── 团队熟悉 Angular
│ │ └── Angular + Angular Material / PrimeNG
│ └── 团队熟悉 Svelte
│ └── SvelteKit + shadcn-svelte
│
├── 重交互 / 性能敏感
│ ├── JS bundle 最小
│ │ └── Svelte / SvelteKit
│ ├── 极致响应式
│ │ └── Solid / SolidStart
│ ├── 0 hydration
│ │ └── Qwik
│ └── 复杂状态机
│ └── React + XState / Zustand
│
├── 移动端
│ ├── 跨 iOS + Android + 团队 JS 背景
│ │ └── React Native + Expo（事实标准）
│ ├── 自绘 UI / 跨端一致 / 3D 动画
│ │ └── Flutter
│ ├── 想要 Web 技术栈 + 原生
│ │ └── Ionic + Capacitor
│ ├── PWA 优先
│ │ └── Next.js / Nuxt (PWA plugin)
│ └── iOS 专属 / Android 专属
│ └── SwiftUI / Jetpack Compose（无替代）
│
├── 桌面应用
│ ├── 轻量 + 跨平台 + 团队有 Rust 能力
│ │ └── Tauri 2.0
│ ├── 生态全 / 大型应用
│ │ └── Electron
│ └── macOS 专属
│ └── SwiftUI
│
├── 3D / 游戏 / 可视化
│ ├── WebGL 3D
│ │ └── Three.js（事实标准）
│ ├── 游戏级 3D
│ │ └── Babylon.js
│ ├── 2D 游戏
│ │ └── PixiJS / Phaser
│ ├── 数据可视化
│ │ └── D3 / Visx / Observable Plot
│ └── 业务图表
│ └── ECharts (国内) / Recharts / Nivo (国外)
│
└── 后台 / 内部工具
├── 快速出活
│ └── Refine / ToolJet / Appsmith (低代码)
└── 复杂业务
└── Ant Design Pro (React) / vue-vben-admin (Vue)
15. 新项目”默认套件”（2026 答案）
15.1 欧美新项目（”T3 stack” 变体）
Runtime: Bun 或 Node 20+
包管理: bun install 或 pnpm
语言: TypeScript
UI 框架: React
Meta-框架: Next.js (App Router)
UI 组件: shadcn/ui (复制粘贴)
CSS: Tailwind CSS v4
状态管理: Zustand (本地) + TanStack Query (服务器)
表单: React Hook Form + Zod
动画: Motion (前 Framer Motion)
图标: Lucide Icons 或 Radix Icons
测试: Vitest (单元) + Playwright (E2E)
Linter: Biome
构建: Vite (dev) / Turbopack (Next) / Bun Bundler
ORM: Drizzle 或 Prisma
认证: Auth.js (前 NextAuth) 或 Clerk
部署: Vercel (首选) / Cloudflare / 自建
监控: Sentry + PostHog
核心哲学：
– 端到端 TypeScript
– Server-first（RSC 模式）
– 类型安全（Zod / tRPC）
– “复制而不是依赖”（shadcn/ui 范式）
15.2 亚洲（中国）新项目
Runtime: Node 20+ / pnpm
语言: TypeScript 或 JavaScript
UI 框架: Vue 3
Meta-框架: Nuxt 3
UI 组件: Element Plus (大企业) / Naive UI (新项目) / shadcn-vue (新派)
CSS: Tailwind CSS 或 SCSS
状态管理: Pinia
表单: VeeValidate + Zod
图标: @iconify/vue (Iconify)
测试: Vitest + Playwright
构建: Vite
ORM: Prisma / TypeORM
认证: Sa-Token (国内) / Auth.js
部署: 阿里云 / 腾讯云 / 华为云 / 内部 k8s
监控: 阿里云 ARMS / Sentry 国内替代
核心差异：
– Vue > React（中国市场习惯）
– Element Plus / Naive UI（企业后台标配）
– 国内云厂商部署
– 用 SCSS 的比例更高
15.3 大型企业 / 长期项目
UI 框架: Angular（首选）或 React
UI 组件: Angular Material (Angular) / Ant Design Pro (React)
状态管理: NgRx (Angular) / Redux Toolkit (React)
构建: Webpack (存量) / Rspack (迁移)
测试: Karma + Jasmine (Angular 老) / Jest (现代)
部署: 内部 k8s
核心考量：
– 团队 5-50 人协作
– 项目 5-10 年生命周期
– 强类型 / 强约束
15.4 性能敏感 / 创新项目
UI 框架: Svelte 5 / Solid / Qwik
Meta-框架: SvelteKit / SolidStart / Qwik City
CSS: Tailwind / UnoCSS
状态管理: 框架内置 runes / signals
构建: Vite
部署: Cloudflare Workers / Vercel Edge
16. 数据来源与方法
16.1 数据维度
| 来源 | 类型 | 反映 |
|---|---|---|
| npmjs.com 公开下载量 | 周下载 | 实际安装使用 |
| GitHub REST API | stars / contributors | 关注度 + 活跃度 |
| State of JS 2024 | 年度开发者调查 | 开发者偏好 + 使用 |
| JetBrains State of Developer Ecosystem 2024 | 跨语言开发者调查 | 工具链使用 |
| Stack Overflow Developer Survey 2024 | 全球开发者 | 框架使用占比 |
| Indeed / LinkedIn 招聘 JD | 商业需求 | 商业落地 |
| Bundlephobia | 包体积 | 工程友好度 |
| star-history.com | 长期增长 | 趋势 |
| 个人观察 / 行业讨论 | 定性 | 趋势补充 |
16.2 数字粗略性说明
- npm 周下载：包含 CI、bot、间接依赖，可能高估
- GitHub stars：包含”点 star 收藏”用户，可能高估
- 招聘数据：LinkedIn 搜索受限于关键词
- 趋势定性：参考多个独立来源交叉
16.3 写作时间
本文写于 2026-06。前端生态变化快（半年一小变，一年一大变），引用具体数据请注明时间。
16.4 不收录
- 退场项目：Backbone、Ember、Knockout、AngularJS、MooTools、YUI、Dojo、ExtJS、Polymer、Aurelia、Mithril、Stimulus、StimulusReflex、Hotwire、Turbo、Unpoly、HTMX（HTMX 仍有受众）、Marko、Hyperdom、Ractive、Riot、Preact（保留但已不是主菜）
- 极小众：Gradio（Python）、Streamlit（Python）、Observable Framework、Refine、ToolJet、Appsmith、Budibase
- 特定领域：OpenLayers（地图）、Cesium（3D 地图）、PDF.js、jsPDF、Fabric.js（画布编辑器）、Konva（2D 画布）、tldraw（白板）
附录：完整资源地图（2026-06 速查）
┌──────────────────────────────────────────────────────────┐
│ 2026 前端"心智份额"图谱 │
├──────────────────────────────────────────────────────────┤
│ │
│ UI 框架 │
│ ├── React (50%) ◄────── #1 必学 │
│ ├── Vue (25%) ◄────── #2 │
│ ├── Svelte (10%) ◄────── 性能派最爱 │
│ ├── Angular (8%) ◄────── 企业中坚 │
│ ├── Solid (3%) ◄────── 极客 │
│ └── Qwik (2%) ◄────── 极客 │
│ │
│ Meta-Framework │
│ ├── Next.js (50%) ◄──── #1 React 全栈 │
│ ├── Nuxt (25%) ◄──── #1 Vue 全栈 │
│ ├── SvelteKit (10%) │
│ ├── Astro (10%) ◄──── 内容站首选 │
│ └── Remix/RR7 (3%) │
│ │
│ 样式 │
│ ├── Tailwind CSS (60%) ◄── 事实标准 │
│ ├── CSS Modules (15%) │
│ ├── SCSS/Sass (10%) │
│ ├── styled-components (5%) │
│ ├── CSS-in-JS (其他) │
│ └── Vanilla Extract / Panda CSS (5%) │
│ │
│ 状态管理 │
│ ├── TanStack Query (40%) ◄── 服务器状态 │
│ ├── Zustand (20%) ◄── 本地状态 │
│ ├── Pinia (15%) │
│ ├── Redux Toolkit (10%) │
│ └── Jotai / Valtio / MobX (其他) │
│ │
│ 组件库 │
│ ├── shadcn/ui (复制粘贴) ◄── 2024 范式 │
│ ├── Material UI (MUI) │
│ ├── Mantine │
│ ├── Chakra UI │
│ ├── Ant Design (中国出海) │
│ ├── Element Plus (中国国内) │
│ └── Naive UI (中国新派) │
│ │
│ 构建 │
│ ├── Vite (#1 dev server) │
│ ├── Turbopack (Next.js) │
│ ├── Rspack (大厂迁移) │
│ ├── esbuild / SWC (transpiler) │
│ ├── Bun Bundler │
│ └── Webpack (存量) │
│ │
│ 测试 │
│ ├── Playwright (#1 E2E) │
│ ├── Vitest (Vite 生态单元) │
│ ├── Jest (React 存量) │
│ ├── Testing Library (组件) │
│ └── MSW (mock) │
│ │
│ 运行时 / 工具链 │
│ ├── Node.js / Bun (runtime) │
│ ├── pnpm / bun (包管理) │
│ ├── TypeScript (类型) │
│ ├── Biome (lint+format, 替代 ESLint+Prettier) │
│ └── Vite / Webpack / Turbopack │
│ │
│ 跨端 │
│ ├── React Native + Expo (#1 移动) │
│ ├── Flutter (Google) │
│ ├── Tauri (#1 轻量桌面) │
│ └── Electron (#1 桌面生态) │
│ │
│ 3D / 可视化 │
│ ├── Three.js (#1 3D) │
│ ├── Babylon.js (游戏) │
│ ├── PixiJS (2D 游戏) │
│ ├── D3 / Visx / Observable Plot │
│ └── ECharts / Recharts / Nivo │
│ │
└──────────────────────────────────────────────────────────┘
一句话总结
2026 欧美新项目默认套件 = React + Next.js (App Router) + TypeScript + Tailwind CSS v4 + shadcn/ui + Zustand + TanStack Query + Bun + Biome + Vite + Playwright
2026 亚洲（中国）新项目默认套件 = Vue 3 + Nuxt 3 + TypeScript + Tailwind + Element Plus / Naive UI + Pinia + Axios + Vite + Vitest + pnpm
跨端选 React Native + Expo（首选）；桌面选 Tauri（轻量）/ Electron（生态）
Svelte 5 / Qwik / Solid 是”性能派 + 开发者喜爱度第一”——但市场份额仍小
Angular 仍是企业大项目的中流砥柱，新项目几乎不选
作者注：本文成文过程中参考了 2025-2026 时点的 npm 周下载、GitHub stars、State of JS 2024、JetBrains DevEco 2024、Stack Overflow 2024、Indeed/LinkedIn 招聘数据等多源信息。前端生态变化快（半年一小变，一年一大变），引用具体数字请注明时点。