万能的 v 友啊,求一个不同语言开发的 web 混合渲染方案(首屏渲染用的不是基于 node 的服务端渲染,但是增量渲染使用 spa)要怎么做。

142 天前
 PungentSauce

就比如 flarum ,这个 laravel(php) 的开发的论坛,我发现他的首屏是有一些 html 标签的,但是增量渲染全是靠接口和 js ,这个项目运行的时候也没有启动 node 。是如何做到的。问了下 ai 基本都是说用了一个类似 vue 的库,但是页面属性绑定,页面切换应该没这么简单就处理好吧。有做过不同语言混合渲染的同学可以分享一下吗。 在不引入 node 做 ssr 的情况下。

3203 次点击
所在节点    程序员
69 条回复
gkinxin
142 天前
@wunonglin

1.op 所说的这个框架并没有使用 react 或 vue 这种库,看了一下是拉去 data ,通过 js 将 data 生成为 html ,那么他如果使用 go 也可以按照这个思路去做。
2.还有一种做法是直接使用 ajax 拉取对应 template 的 html 文件。
PungentSauce
142 天前
@wunonglin 需要其他模板引擎渲染首屏,但是渲染后希望变成 spa ,首屏是为了 seo,spa 是为了体验。 限制就限制在了生产环境没有 node 。
毕竟一个接口返回的内容远比模板引擎返回的整个页面少很多。
PungentSauce
142 天前
@wunonglin 这个我参考参考
towser
142 天前
看看 Livewire, Alpine.js
gkinxin
142 天前
@PungentSauce 没有 node 环境可以试试 ssg(gatsbyjs)
yidev
142 天前
是这样的,op, 古代的程序员开发会使用一种叫 ajax 的上古技术. 现在几近失传了.
shakaraka
142 天前
@PungentSauce #22 生产环境是哪里?云服务还是你们公司内部?

👴🏻 不能用 nodejs ,那就用 bunjs 、denojs 呗
gaooo
142 天前
服务端模板引擎+spa 的意义是啥?这不是脱了裤子放屁吗,套两层模板,+mpa 还可以理解
zhangyunlu80
142 天前
如果是 vue, 或者 react 绑定的技术栈的话就是微前端类似的动态框( genesis, webpack5 联邦)等,不是绑定 spa 框架的话,就是上面老哥说的那种动态拼的
apkapb
142 天前
我可能能理解楼主,但不一样的是:

我想使用模板引擎是因为 seo 好,但是模板引擎开发体验非常不好(体验、UI 库、方便程度非常不好),某些需要 seo 的地方用模板引擎,不需要地方用 spa ;

但是,目前没有特别舒服的解决方案(整合方案)
momocraft
142 天前
技术上有可能,你的前端代码能接受和接管非 JS 生成的 HTML 就行

jQuery 可能没问题。如果前端框架默认自己管理整个 DOM 会比较麻烦。即使不用 Node 能做到也未必值得,可能要维护 2 份生成 DOM document 的代码。

而且说实话,你都想着绕开 nodejs 了,不像有这个技术能力
PungentSauce
142 天前
@wunonglin @momocraft 我说的绕开 node 指的是 生产环境不引入 基于 node 或者其他 js 的 runtime ,用来 ssr 。
开发/编译 可以使用 node , 云服务 。 我知道 使用一些 前端的 ssr 这件事容易搞定,但是就需要部署一个后端服务,然后再部署一个 前端 ssr 服务 ,要是可以融合一下的话,分发比较方便。 如果没有很好的方案,那就维持现状 模板渲染。先不引入 spa 的改造。

@apkapb 说的很对,有些引入的第三方图标啥的 ,spa 的页面可以直接 import 然后使用 ,模板渲染的就要手动粘贴 svg 。
PungentSauce
142 天前
@gkinxin 我有使用 nuxt 的 ssg , nuxt 的 url rewrite 最后放弃了 发现也不止我一个人遇到这个问题
https://github.com/nuxt/nuxt/issues/31012

目前是 模板+vite + tailwindcss+vue(部分页面使用 .vue ) 。

如果可以在首屏后,页面进行 spa 方式的进行其他页面的跳转,感觉效果会好一些。
goodjike
142 天前
可以试试[astro]( https://astro.build/)
momocraft
142 天前
允许 build 阶段用 node 那可以(完全静态的) ssg ,这是一个比较可行的路线

js 负责生成 html 和浏览器内的 SPA ,非 js 代码提供 HTTP API 和静态文件

我不用 nuxt 也没看懂那个 issue 想做什么,但是搞不定请求路径应该只是技术问题,最多是框架问题,不是这个路线的问题
PungentSauce
142 天前
@momocraft 对,应该是框架问题。
chachi
142 天前
htmx 试试。
zhennann
142 天前
先插个眼,后续我来公布答案🐶
kingofzihua
142 天前
PungentSauce
142 天前
@chachi 这个之前有查到过,感觉还是挺独特的。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://ex.noerr.eu.org/t/1150266

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX