代码重构方向讨论

[izgzhen]

讨论内容：

1. 现在代码的问题是什么？
2. 有哪些大的重构方向，带来的改进是什么？
3. 如何渐进地实现这些重构目的，持续进程到 production，不引入 bug？

参考：产品开发策略。总体而言这些需求优先级不高，但是需要提前考虑以防 technical debt 不断积累。

[izgzhen]

方向：View 和 Data Model 进一步分离

解决的问题：目前代码里的通用 widget 难以在线下调整设计，因为依赖于 API。改进后部分开发设计工作将不依赖于整体 App结构且不依赖于 server。这个想法某种程度上可以借鉴了 SwiftUI。

实现策略：目前已经一两个组件开始加入相关支持了，见 https://github.com/chafan-dev/chafan-frontend#样板间 和 https://github.com/chafan-dev/chafan-frontend/blob/master/src/views/Showcase.vue

[izgzhen]

方向：Vue3 迁移

解决的问题：Vue3 的开发者体验更好，是未来相关生态的主要支持版本。

实现策略：目前 Vue 官网仍默认展示 Vue2，直到官网切换到默认展示 Vue3 之前，不考虑且不支持对 PWA 本身的代码库做迁移，但是可以将部分通用模块独立出来成另外一个repo用Vue3重写，只要能保证其可以顺利 import 到 vue2 的主项目代码且不影响 type hinting。官网切换到默认展示 Vue3 后我们将开始主动推动上述流程，直到核心 PWA 足够小可以一次性迁移到 Vue3。

[Endle]

这个项目目前阶段的开发不能有非常长期的 off-master 的分支，最终成功的概率太低；还是增量改进更符合目前的开发资源和模式，每个 change 都要保证 99% 的落地成功概率。

我赞同，对个人项目维护两个branch太难了，还是小步快跑，尽量把新commit merge进prod比较好

[Sepush]

可以使用使用几个插件 获得在 vue2里面 使用 ts vue3 组合式 API script setup语法糖的能力 方便以后迁移和逐步的重构
https://github.com/antfu/unplugin-vue2-script-setup
https://github.com/vuejs/composition-api

[Sepush]

新写的组件应该不要依赖 装饰器了

[izgzhen]

新写的组件应该不要依赖 装饰器了

嗯，不过应该也没有多少新的组件要写了 😂

[AGDholo]

可以使用使用几个插件 获得在 vue2里面 使用 ts vue3 组合式 API script setup语法糖的能力 方便以后迁移和逐步的重构 https://github.com/antfu/unplugin-vue2-script-setup https://github.com/vuejs/composition-api

composition api 和 ts class components 差太远了吧，要重构需要一整套都换掉，涉及的工作量可能还不如直接上 vue3+vite，或者 react+vite

[izgzhen]

方向：服务端渲染/前端Server

解决的问题：目前前端 PWA 直接和 API server 沟通，虽然好处是后端实现可以更为简洁，不少业务逻辑可以直接在 App 端实现，但是坏处是前后端合作渲染一个完整页面需要大量 API call，页面加载体验比较差，且对搜索引擎不友好。

实现策略：

• 问题1：是否考虑直接用前端框架提供的 SSR 支持？
  • 需要非常谨慎考虑。部分第三方JS库对 NodeJS 的支持可能并不好，盲目追求便利可能会导致更多问题。
• 问题2：如何渐进实现一个通用的 SSR 服务？
  • 首先需要确定数据格式：目前可以继续使用 JSON
  • PWA 可以逐渐将业务逻辑 offload 到 SSR 服务中，专注于渲染逻辑的灵活实现上。过渡期需要支持同时使用 API server 和 Frontend server。两个 “server” 可以混合实现在同一个 endpoint 里（或者开发方向是有 scalability 需求时从 frontend server 里拆出来 data backends）

[AGDholo]

vue3 级别的 ssr 框架看起来都不太成熟，vue2 倒是有 nuxt.js 可以用。

[izgzhen]

主要问题是整个 PWA 很难接入 NodeJS based SSR，里面用了大量基本上 browser only 的东西，比如编辑器。