闲聊·前端跨端要不要采用同一套代码

最新推荐文章于 2023-12-07 10:27:19 发布

lefex

最新推荐文章于 2023-12-07 10:27:19 发布

阅读量778

点赞数

文章标签： javascript vue js html css

本文链接：https://blog.csdn.net/lefex/article/details/117538142

版权

前端开发因其跨平台特性，理论上可以实现一套代码同时运行在移动端和 PC 端，降低维护成本。然而实际操作中，由于两端界面和功能的差异，通常需要维护两套代码。通过移动端优先、UI 层分离和逻辑层复用等方式，可以尽量提高代码复用率。对于功能和界面差异大的场景，仍需分别开发。讨论是否以及如何在项目中实现移动端和 PC 端的代码复用。

摘要由CSDN通过智能技术生成

我以前是做 iOS 的，对跨平台开发情有独钟，移动端的跨平台主要想使用同一套代码开发 iOS 和 Android App，以降低研发和维护成本，但是由于 iOS 和 Android 是两个完全不一样的「开发生态」，跨平台始终不是很理想。

但是，前端对跨平台有天然的优势，只需要用户有一个浏览器即可。同一套代码既可以运行在移动端、又可以运行在 PC 端，使用的技术栈也一样，都是「HTML + CSS + JavaScript」，但是我发现一个很奇怪的现象，这么好的跨平台优势，其实我们并没有充分利用起来。比如移动端和 PC 使用同样的技术栈实现两个平台的页面，这样不得不同时维护两套代码。

我想了下，PC 和移动端之所以采用 2 套代码实现，归根结底是因为 PC 和移动端很多地方「长的不一样」，有些功能在 PC 和移动端存在差异。但是 App 就不一样了，在设计 Android 和 iOS 时，功能 95% 基本一样。那么 PC 和移动端如何尽可能地复用一套代码呢？

对于某些简单的页面，比如活动页，以移动设备优先，同时兼容 PC。UI 设计师和 PM 设计的时候需要同时考虑移动端和 PC，尽可能保证两端功能一致，同时给出移动端和 PC 的设计稿。

对于移动端和 PC 长的完全不一样的页面，但功能基本一致，可以采用 UI 层分离，移动端和 PC 分别实现 UI 层，这样可以让各端分开展示；逻辑层采用同一套代码，因为移动端和 PC 大部分功能是一样的。但前提是 PC 和移动端代码最好放到同一项目中。

对于那些 PC 和移动端功能、UI 完全不一样的，可以分