关于 SAP Spartacus 服务器端渲染 SSR 无法使用窗口宽度以进行自适应设计的问题

Storefront 的屏幕布局由可配置的断点(configurable breakpoints)驱动。断点具有可配置的屏幕尺寸（即 < 576px），并且关联的屏幕名称可用于进一步定义布局。

一个很好的例子是页面模板槽配置，它可以根据屏幕名称进行调整，以便布局因屏幕尺寸而异（即移动与桌面）。

然而，其他功能也可以使用屏幕名称来进一步增强功能的呈现。一个很好的例子是表格组件，它有一个基于屏幕的可配置标题列表。

屏幕特定 DOM 的创建就是我们所说的自适应设计(adaptive design)。此设计针对小屏幕进行了优化，但也针对可访问性进行了优化。

这种技术的问题在于它是由窗口宽度驱动的。断点配置与实际窗口宽度进行比较，并且会在实际窗口发生变化时发生变化。

然而，在 SSR 上，我们没有窗口。我们无法通过比较窗口大小来找到屏幕。这就是我们目前在 SSR 上使用移动优先(mobile-first )方法的原因。然而，这会导致问题，因为：

生成的布局可能无法反映实际的窗口大小
生成的内容可能不足以供爬虫使用

为了解决这个问题，我们需要考虑几个方面：

我们可以在组合中引入设备检测。我们只会在 SSR 中执行此操作，并且需要将检测到的设备类型映射到我们在断点配置中定义的屏幕.

一旦我们根据设备类型在 SSR 中呈现多个版本，我们应该在 SSR 之上的任何缓存层（主要是 Web 服务器缓存和 CDN）中考虑到这一点。

我们可以通过将设备类型公开为标头来做到这一点。

目前尚不清楚我们需要为设备公开什么级别的粒度。想到以下几点：

mobile
desktop
table
机器人/爬虫

关于 SAP Spartacus 服务器端渲染 SSR 无法使用窗口宽度以进行自适应设计的问题相关推荐

关于自定义的登录机制在SAP Spartacus服务器端渲染(SSR)实施过程中遇到的问题
问题背景某客户使用了第三方的Authentication service来实现Spartacus用户的登录机制: In our project we have integration with MD ...
SAP Spartacus 服务器端渲染文件 server.js 和构建后的 main.js 对比
构建之前: 构建之后: 其中 express__WEBPACK_IMPORTED_MODULE_3__ 来自 module uX2x: uX2x 来自 node_modules/express/ind ...
SAP Spartacus 服务器端渲染调试的开发端版本
我按照这篇文章手动安装 SAP Spartacus 3.3.0版本并启用服务器端渲染 SSR 的介绍,启用了 SAP Spartacus 服务器端渲染,并且按照SAP Spartacus服务器端渲染模 ...
SAP Spartacus 服务器端渲染单步调试步骤之二：在服务器端执行应用程序 Angular 代码
前文:SAP Spartacus 服务器端渲染单步调试步骤之一:应用程序准备工作入口: 进入 platform-server.js: 入口: 最终在服务器端执行 bootstrap,输入 Compo ...
SAP Spartacus 服务器端渲染处理内存泄漏的准则
开启服务器端渲染(SSR) 的 SAP Spartacus 实例,运行在 CCV2 Pod 里,当下列情况出现时,可能会造成 pod 的重启: resource allocation for SSR ...
SAP Spartacus服务器端渲染模式下的调试方法
在使用本文章介绍的步骤进行SAP Spartacus Storefront在服务器端渲染模式(SSR)下的调试之前,请您确保已经按照如下帮助文档的介绍,已经成功启用了服务器端渲染: https://s ...
SAP Spartacus 服务器端渲染找不到 index 视图的问题
我基于 SAP Spartacus 源代码级别 4.0 版本进行 SSR 调试时,遇到如下错误:在 dist/storefrontapp 文件夹下面,找不到 index 视图: Error: Fail ...
SAP Spartacus 服务器端渲染模式下，在 Node.js 服务器端渲染视图的单步调试
入口:在 express-engine.js 文件的 render 函数设置断点: 进入 platform-server.js: 这个文件就是 SAP Spartacus 开启服务器端渲染之后,pac ...
SAP Spartacus 服务器端渲染编程规范
链接:https://sap.github.io/spartacus-docs/server-side-rendering-coding-guidelines 禁止使用只有在浏览器环境下才可用的全局对 ...

关于 SAP Spartacus 服务器端渲染 SSR 无法使用窗口宽度以进行自适应设计的问题

关于 SAP Spartacus 服务器端渲染 SSR 无法使用窗口宽度以进行自适应设计的问题相关推荐

最新文章

热门文章