最近有个需求,通过管理端拖拉拽实现门户首页自定义的功能,前端用的 VUE ,但是在技术选型这块有几个疑问?
组件共享问题:如果在管理端进行操作并且预览的话,无法实现管理端组件和客户端组件的共用(两个项目相互独立),参考过其他开源项目使用 iframe (嵌入)客户端传参方式的方案,感觉整体交互会比较复杂。
首页加载问题:既然是门户网站,想来是不是使用 ssr 比如 nuxt 是不是更好,但是这样的话技术曲线会增高,因为之前也没接触过。如果使用传统单页面的方案,前端接收 JSON 来渲染组件铺首页,效果肯定很差,会有先白屏的效果,体验应该也不会太好。
渲染问题:有没有什么方案,可以不用编译就可以动态渲染页面,这样我更改完界面,客户端就直接看到效果,而不是使用接口拿 JSON 铺组件的效果,vite 或者 nuxt 可以么?
或者有没有这方面的开源项目,可以给小弟参考参考
1
duowb 9 天前 1
个人不成熟的想法:
把组件弄成组件库,然后在管理端和客户端引用,或者把编排的功能做成组件,在管理端和客户端使用。同时,将拖拽生成好的 json 配置文件放到项目里面,这样是不是加载会比较快 |
2
fishlium 9 天前 1
没太看懂,这个需求不是你预先生成组件吗,用动态组件实现。为什么会涉及到编译呢
|
3
lizhesystem OP @duowb #1 嗯,或者把设置好的 JSON 持久化到浏览器,但是肯定没有直接加载来的快,估计还得上骨架屏。
|
4
lizhesystem OP @fishlium #2 确实,但最终渲染页面的话肯定是用动态组件来实现,我在想有没有更好的办法,在服务端渲染好直接返回 html 或者组件这样。
|
5
importmeta 9 天前 1
有, 用 SSG 技术.
|
6
lizhesystem OP @importmeta #5 好的,谢谢🙏 我了解下
|
7
Tiller 9 天前 1
SSG 不太适合你们吧。在我的印象中,SSG 不应该是只能生成类似于 vitepress 这个纯静态站点么。
你这种拖拉拽,要动态更改的,还是更加适合 nuxt 的 SSR 模式。 1. 组件问题。Nuxt 有个概念叫 layers 。你可以为管理端和客户端,创建一个新的 nuxt 项目。在这个 nuxt 项目中维护一个组件库。然后在管理端和客户端作为一个 layers 引入这个项目。这样你可以保持组件的一致性 2. 个人认为 ssr 才是适合你们的技术。但是针对现有的项目进行改造的话,还是有一定的工作量的。如果你们考虑上的话,管理端可以继续进行 CSR 渲染,避免 SSR 带来的各种问题。可以说几乎无缝? 客户端的话,也可以保持部分 SSR ,部分 CSR 3. 同上,nuxt ssr ,在服务端获取 json 的数据,渲染好之后,展示出来就是静态的 HTML 了。 我最近在有一搭没一搭的开发自己的项目,想要开源出来的。做的就是你说的这种,有门户,有后台管理的系统。 遇到最烦的问题就是各种鉴权,例如路由鉴权,接口鉴权之类的。发现后台管理还是直接 csr 比较方便 |
8
TryToCatchYou 9 天前 via iPhone 1
可以通过托拉拽生成 JSON 配置后,在服务端进行 SSG ,然后 Deploy 到 web 服务器,之前恰巧做过这块配置,托拉拽可以使用开源库 Vvverbjs
|