关于 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 的资料很少。

相关文章
|
JavaScript 前端开发 开发者
09.HarmonyOS Next数据驱动UI开发:ForEach与动态渲染完全指南(上)
在现代前端开发中,数据驱动UI已成为主流开发范式。HarmonyOS Next的ArkTS语言和声明式UI框架完美支持这一理念,使开发者能够以更高效、更直观的方式构建复杂应用。
323 1
|
前端开发 Cloud Native Java
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
Java||Springboot读取本地目录的文件和文件结构,读取服务器文档目录数据供前端渲染的API实现
|
数据采集 前端开发 搜索推荐
|
数据采集 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。
|
数据采集 缓存 前端开发
服务器端渲染(SSR)
服务器端渲染(SSR)
|
前端开发 安全 开发者
JSF文件上传,让Web应用如虎添翼!一招实现文件上传,让用户爱不释手!
【8月更文挑战第31天】在现代Web应用开发中,文件上传是重要功能之一。JSF(JavaServer Faces)框架提供了强大的文件上传支持,简化了开发流程。本文将介绍JSF文件上传的基本步骤:创建前端表单、处理上传文件的后端Action类、将文件保存到服务器指定目录以及返回结果页面。通过示例代码,我们将展示如何利用JSF实现文件上传功能,包括使用`h:inputFile`控件和`ManagedBean`处理上传逻辑。此外,JSF文件上传还具备类型安全、解耦合和灵活性等优点,有助于提升程序的健壮性和可维护性。
297 0
|
UED
JSF文件下载:解锁终极文件传输秘籍,让你的Web应用瞬间高大上!
【8月更文挑战第31天】掌握JSF文件下载功能对构建全面的Web应用至关重要。本文通过具体代码示例,详细介绍如何在JSF中实现文件下载。关键在于后端Bean中的文件读取与响应设置。示例展示了从创建实体类到使用`<h:commandLink>`触发下载的全过程,并通过正确设置响应头和处理文件流,确保文件能被顺利下载。这将显著提升Web应用的实用性与用户体验。
283 0
|
Java 数据库 API
JSF与JPA的史诗级联盟:如何编织数据持久化的华丽织锦,重塑Web应用的荣耀
【8月更文挑战第31天】JavaServer Faces (JSF) 和 Java Persistence API (JPA) 分别是构建Java Web应用的用户界面组件框架和持久化标准。结合使用JSF与JPA,能够打造强大的数据驱动Web应用。首先,通过定义实体类(如`User`)和配置`persistence.xml`来设置JPA环境。然后,在JSF中利用Managed Bean(如`UserBean`)管理业务逻辑,通过`EntityManager`执行数据持久化操作。
355 0
|
开发者 Windows Android开发
跨平台开发新选择:揭秘Uno Platform与.NET MAUI优劣对比,帮你找到最适合的框架,告别选择困难症!
【8月更文挑战第31天】本文对比了备受关注的跨平台开发框架Uno Platform与.NET MAUI的特点、优势及适用场景。Uno Platform基于WebAssembly和WebGL技术,支持Windows、iOS、Android及Web平台,而.NET MAUI由微软推出,旨在统一多种UI框架,支持Windows、iOS和Android。两者均采用C#和XAML进行开发,但在性能、平台支持及社区生态方面存在差异。Uno Platform在Web应用方面表现出色,但性能略逊于原生应用;.NET MAUI则接近原生性能,但不支持Web平台。开发者应根据具体需求选择合适的框架。
875 0
|
缓存 UED 开发者
全面加速Angular应用:从代码拆分到服务器端渲染的性能优化全攻略——深入探讨提升加载速度的有效策略
【8月更文挑战第31天】在现代Web开发中,提升应用加载速度对增强用户体验至关重要,尤其对于使用Angular框架的单页应用而言更是如此。本文通过解答五个常见问题,提供了一份全面的Angular性能优化攻略,涵盖减少初始加载时间、处理大型第三方库、优化变更检测、利用缓存以及服务器端渲染等技术。通过这些方法,开发者能够显著提升应用性能,确保流畅高效的用户体验。
415 0

热门文章

最新文章