基础：BS（Browser/Server）、CS（Client/Server）架构

一、BS（Browser/Server）

所有浏览器应用都是BS架构。

BS（Browser/Server）：浏览器 / 服务器结构。BS是伴随着Internet技术的兴起，对C/S架构的改进，为了区别于传统的C/S 模式，特意称为B/S模式。在这种结构下，通过浏览器来进入工作界面，页面交互部分事务逻辑在前端（Browser）实现，数据逻辑在服务器端（Server）实现。

BS的主要特点是分布性强、维护方便、开发较简单且共享性强、总体拥有成本较低。它是瘦客户端，对大量的数据输入以及报表的应答等都需要通过浏览器与服务器进行交互，通信开销大，而且对于实现复杂的应用构造有较大的困难。

BS架构三层框架：将整个业务应用划分为“表现层(UI)、业务逻辑层(BLL)、数据访问层(DAL)”。

常见浏览器：chrome、Firefox、operate、safari、360、腾讯等

二、CS（Client/Server）

CS（Client/Server）：客户端 / 服务器结构。C/S结构在技术上很成熟，它的主要特点是交互性强、具有安全的存取模式、网络通信量低、响应速度快、利于处理大量数据。它充分利用两端硬件，将任务分配到Client 和Server两端，降低了系统的通讯开销。C/S结构的软件需要针对不同的操作系统系统开发不同版本的软件。

C/S 架构是一种典型的两层架构，其客户端包含一个或多个在用户的电脑上运行的程序，而服务器端有两种，一种是数据库服务器端，客户端通过数据库连接访问服务器端的数据；另一种是Socket服务器端，服务器端的程序通过Socket与客户端的程序通信。

开发技术：C、C++、Electron

CS架构平台：windows、Android、iOS、Harmony

BS、CS对比：

	BS	CS
程序架构不同	BS对安全以及访问速度的多重考虑建立在需要更加优化的基础之上，比CS有更高的要求。	CS程序可以更加注重流程可以对权限多层次校验，对系统运行速度可以较少考虑。
处理问题不同	BS建立在广域网上，面向不同的用户群，分散地域，与操作系统关系小，可实现跨平台。	CS安全性较高，与操作系统关系大，不能跨平台。
用户接口不同	BS建立在浏览器上，不管是电脑浏览器，还是手机浏览器，不管是什么系统	Windows、Mac、Linux、Android、iOS、Harmony
获取方式不同	打开浏览器，直接访问。	在应用商店下载应用，或通过U盘安装程序等。
电脑配置	对电脑配置要求较低	对电脑配置要求较高
共享性	用户传播方便，共享性好	应用商店下载也很方便
开发维护	开发维护较易	开发维护较BS要求高
开发成本	较低	较高
开发技术	HTML、CSS、JS	C、C++、Rust、Electron、java、swift、objective-c、dart
发版方式	服务器部署，直接访问	提交应用平台审核，审核通过后发布
开发兼容性	兼容不同内核浏览器	不同操作系统、同操作系统不同版本可能需要从头开发，同操作系统不同设备可能需要兼容差别
对硬件的调用	不便	方便
获取用户设备信息	不便	方便
程序员数量	多	也很多
用户体验	优秀，随着ajax技术的使用，用户体验越来越好	优秀
不适用	类型大型网络游戏，如，王者荣耀，反正我看见过网页版，我不玩游戏	适用重型项目
市场占有率	繁荣	繁荣
应用迁移	方便	不便，需要重新安装
易维护性	较易	相对较高

BS与CS的联系

现在可以使用electron开发客户端，Electron的语法与vue相似度较高，
移动端现在flutter也是一个趋势，市场上使用的公司已经较多，
React Native使用也很多，
还有微信生态，
不管是BS还是CS逐渐都是大前端开发了。

参考链接： 

【漫画编程】漫画带你一分钟了解BS与CS架构_哔哩哔哩_bilibili

BS架构和CS架构的优缺点_「已注销」的博客-CSDN博客_cs结构和bs结构优缺点

项目开发常识：CS架构和BS架构、API与SDK 、DOM结构 - 泰初 - 博客园

系统开发中BS和CS的优劣势 - 知乎

cs和bs架构的区别有哪些？-常见问题-PHP中文网

BS架构和CS架构的优缺点_「已注销」的博客-CSDN博客_cs结构和bs结构优缺点

CS和BS 到底是什么_test45656的博客-CSDN博客_cs和bs