Web 应用（Web Application）可以按照架构模式、功能用途、交互方式、技术栈等多个维度进行分类。下面给你一个清晰、常用的分类体系：
一、按架构 / 技术模式分类
1️⃣ 静态 Web 应用（Static Web App）
-
由 HTML、CSS、JS 组成
-
不依赖服务器端动态渲染
-
常部署在 CDN（如 GitHub Pages、Vercel）
-
示例：企业官网、文档站点、博客
✅ 优点：快、简单、成本低
❌ 缺点：交互和业务逻辑有限
2️⃣ 动态 Web 应用（Dynamic Web App）
-
页面内容由 服务器动态生成
-
常见技术：JSP、ASP.NET、PHP、Thymeleaf
-
示例：早期门户网站、管理系统
✅ 优点：SEO 友好、简单直接
❌ 缺点：耦合高、交互体验一般
3️⃣ 单页应用（SPA，Single Page Application）
-
只加载一个 HTML 页面，后续通过 JS 动态更新
-
前端框架：React、Vue、Angular
-
示例：Gmail、Notion、钉钉 Web 版
✅ 优点：流畅、接近原生体验
❌ 缺点：首屏慢、SEO 需额外处理
4️⃣ 多页应用（MPA，Multi Page Application）
-
每次操作可能跳转新页面
-
传统 Web 应用典型形式
-
示例：电商网站、新闻站
✅ 优点：简单、SEO 好
❌ 缺点：交互不如 SPA 流畅
5️⃣ PWA（Progressive Web App，渐进式 Web 应用）
-
具有 离线能力、可安装、推送通知
-
使用 Service Worker + Manifest
-
示例：Twitter Lite、星巴克 PWA
✅ 优点：接近原生 App 体验
❌ 缺点：兼容性、开发复杂度
6️⃣ SSR / SSG / ISR 应用（现代前端架构）
-
SSR（服务端渲染）：Next.js、Nuxt
-
SSG（静态生成）：构建时生成 HTML
-
ISR（增量静态再生）
✅ 优点：SEO + 性能兼顾
❌ 缺点：架构复杂
二、按功能 / 用途分类
| 类型 | 说明 | 示例 |
|---|---|---|
| 企业 Web 系统 | OA、ERP、CRM | 用友、钉钉管理后台 |
| 电商平台 | 商品、订单、支付 | 淘宝、京东 |
| 内容管理系统（CMS） | 内容发布与管理 | WordPress、Drupal |
| 社交 / 社区 | 用户互动 | 微博 Web、知乎 |
| 在线工具 | 实用功能 | 在线 PS、JSON 工具 |
| 教育 / LMS | 在线学习 | 慕课网、学堂在线 |
| 数据可视化平台 | 图表、大屏 | 监控平台、BI 系统 |
| SaaS Web 应用 | 多租户服务 | Notion、Figma Web |
三、按前后端关系分类
1️⃣ 前后端不分离
-
后端渲染页面（JSP / Thymeleaf）
-
传统 Java / PHP 项目
2️⃣ 前后端分离
-
后端 = API（REST / GraphQL）
-
前端独立部署
-
当前主流方式
四、按访问方式
-
浏览器 Web 应用（最常见）
-
Web + 移动适配（响应式）
-
Web App 可被"添加到桌面"
-
内网 Web 应用（Intranet）
五、按用户规模与部署方式
-
个人 / 小型项目
-
企业内部系统
-
互联网级平台
-
私有化部署 Web 系统
-
云原生 Web 应用（K8s + 微服务）
总结（常用对照）
✅ 现代 Web 应用 ≈ 前后端分离 + SPA/PWA + API 后端 + 云部署