关于 SAP UI5 对服务器端渲染 Server Sider Render 的支持问题

简介: 之前 Jerry 的公众号文章介绍过 SAP 产品的渲染模式

SAP UI渲染模式:客户端渲染 VS 服务器端渲染

关于 SAP 产品 UI 的搜索引擎优化 SEO - Search Engine Optimization

深入学习SAP UI5框架代码系列之二:UI5 控件的渲染器

其中提到,SAP UI5 采取的是客户端渲染,Client Side Render 即 CSR.


那么,SAP UI5 是否像 SAP Spartacus 那样,同时支持客户端渲染和服务器端渲染呢?


我根据 SAP UI5 SSR 的关键字,在搜索引擎上查找了一番。

image.png

1. 要求 SAP UI5 Web Component 支持 SSR 的请求

链接


您的功能请求是否与问题有关? 请描述。

如果 UI5 Web 组件可以支持使用 Next.js 等流行框架的服务器端渲染,那就太棒了。 我们在用于 React 包装器的 UI5 Web 组件中收到了类似的问题。


描述您想要的解决方案

我想在例如使用 UI5 Web 组件 Next.js 无需应用变通方法。 因此,一些围绕文档的 API 需要一个抽象,以确保它们在 SSR 期间不会崩溃,并且会在客户端上被 hydrated.


描述您考虑过的替代方案

当您非常仔细地注意导入组件的位置时,可以使用 Next.js 中已有的 UI5 Web 组件。 导入 ui5 按钮,例如在 useEffect 中将使您能够渲染按钮。 但是,如果您现在正在导入一个图标,它将崩溃,因为图标导入正在访问 SharedElementRegistry,而 SharedElementRegistry 正在访问 SSR 期间未定义的 document 对象。


2. Support for Static Site Generators

链接


需求:我真的很喜欢 React 的 UI5 WebComponents。 我想将它与静态站点生成器(如 Next.js 或 Gatsby.js)结合使用,但它不起作用。 我认为目前不支持服务器端渲染。 如果您可以支持它以提高初始页面加载的速度,那就太好了。


现状

尝试 SSR HTML 自定义元素时存在一些问题。


截至今天,Web 组件不支持 SSR。 我们做了一些实验,在服务器端使用渲染器来渲染 Web 组件的初始内容,并在客户端做一些渐进式增强,但到目前为止它只是一个 POC。 但我有点想知道,为什么 Web 组件不能与 Next.js 或 Gatsby.js 一起使用——它们可以简单地呈现自定义 HTML 标签,然后 Web 组件在客户端呈现。 但我不得不承认,我并没有在 Next.js 或 Gatsby.js 的细节中对此进行判断。


确实网络上现在对 SAP UI5 SEO 和 SSR 的资料很少。

相关文章
|
前端开发 Cloud Native Java
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
|
Ubuntu 网络协议 关系型数据库
超聚变服务器2288H V6使用 iBMC 安装 Ubuntu Server 24.04 LTS及后续系统配置
【11月更文挑战第15天】本文档详细介绍了如何使用iBMC在超聚变服务器2288H V6上安装Ubuntu Server 24.04 LTS,包括连接iBMC管理口、登录iBMC管理界面、配置RAID、安装系统以及后续系统配置等步骤。
4572 4
|
数据采集 前端开发 搜索推荐
|
数据采集 缓存 前端开发
服务器端渲染(SSR)
服务器端渲染(SSR)
|
数据采集 JavaScript 搜索推荐
服务器端渲染(SSR)(Nuxt+Next.js)
服务器端渲染(SSR)技术在服务器上生成页面HTML,提升首屏加载速度和SEO效果。Nuxt.js和Next.js分别是基于Vue.js和React.js的流行SSR框架。Nuxt.js提供自动化路由管理、页面级数据获取和布局系统,支持SSR和静态站点生成。Next.js支持SSR、静态生成和文件系统路由,通过`getServerSideProps`和`getStaticProps`实现数据获取。SSR的优点包括首屏加载快、SEO友好和适合复杂页面,但也会增加服务器压力、开发限制和调试难度。选择框架时,可根据项目需求和技术栈决定使用Nuxt.js或Next.js。
|
网络协议 Windows
Windows Server 2019 DHCP服务器搭建
Windows Server 2019 DHCP服务器搭建
492 3
|
网络协议 Ubuntu Linux
gpg从公钥服务器接收失败(gpg: keyserver receive failed: Server indicated a failure)
通过上述步骤,大多数情况下应该能够解决GPG从公钥服务器接收失败的问题。如果问题依旧存在,可能需要进一步调查与公钥服务器相关的更深层次的技术问题,或者考虑在相关社区论坛寻求帮助。
3784 1
|
网络协议 定位技术 Windows
Windows Server 2019 DNS服务器搭建
Windows Server 2019 DNS服务器搭建
864 1
|
网络协议 文件存储 Windows
Windows Server 2019 FTP服务器搭建
Windows Server 2019 FTP服务器搭建
686 0
|
网络协议 Windows
Windows Server 2019 Web服务器搭建
Windows Server 2019 Web服务器搭建
972 0

热门文章

最新文章