运行在 CCV2 环境上的 Angular 服务器端渲染应用的性能瓶颈分析

简介: 运行在 CCV2 环境上的 Angular 服务器端渲染应用的性能瓶颈分析

Angular 应用程序中使用服务器端渲染,出于以下几种原因:

  1. SSR 有助于搜索引擎优化。 搜索引擎爬虫可以解析通过服务器端渲染的 HTML 页面源代码。而运行在 CSR 模式下的单页面应用,页面源代码是在客户端浏览器里执行复杂的 JavaScript 生成,现代很多爬虫对此内容无能为力。
  2. Facebook 和 Twitter 等社交媒体平台,可在共享时显示 SSR 渲染出的网站的预览。
  1. 在服务器上呈现网页后,页面内容可以被缓存,从而能够更快的响应用户相同的页面请求。

要在 Angular 应用程序中实现服务器端渲染,可以使用 Angular Universal package.

当我们使用 Angular Universal 时,向 OCC 服务器发起业务数据请求的 API 触发两次。首先是在服务器渲染页面时实行一次,第二次是在客户端应用程序启动时触发。这种 API 重复触发的方式会导致延迟问题和糟糕的用户体验,因为发生这种情况时屏幕通常会闪烁(flickering).

此外,SAP CCV2 上的 SSR 容器是运行 Node.js 代码的地方,因此更容易受到性能下降的影响。在选择 Node.js 和 server.js jsapps-* 之后,可以从 Dynatrace 中的技术和进程页面查看 CPU 和内存。注意 SSR 应用文件的名称可能不同,默认为 main.js.

随后的页面将显示所选任何给定指标的平均利用率。 单击单个 pod 将进入其进程详细信息页面,其中可以查看有关 cpu/内存利用率和重新启动时间的信息。 对于 SSR,有关 CPU 的详细信息将在系统性能选项卡下,而有关 V8 内存使用的详细信息将在 Node.js 指标选项卡下。

当发现 SSR Pod 的 CPU 利用率居高不下时,基于 Node.js 的设计,尽管我们可以通过垂直扩展来缓解这个问题, 另一方面,如果并发请求的数量很大,那么也可以考虑通过水平扩展的方式来降低每个 Pod 的 CPU 利用率。


尽可能多地消除 Spartacus Storefront 中 CPU 密集型代码 ,必要时可以研究是否能够将逻辑转移到 OCC 层执行。


相关文章
|
19天前
|
监控 安全 Linux
RHEL 环境下 Subversion 服务器部署与配置
【10月更文挑战第18天】在RHEL环境下部署Subversion服务器需依次完成安装Subversion、创建版本库、配置服务器、启动服务、客户端连接及备份维护等步骤。确保遵循安全最佳实践,保障数据安全。
|
25天前
|
SQL 机器学习/深度学习 分布式计算
大数据-81 Spark 安装配置环境 集群环境配置 超详细 三台云服务器
大数据-81 Spark 安装配置环境 集群环境配置 超详细 三台云服务器
47 1
|
2月前
|
缓存 JavaScript 前端开发
Angular 应用打包和部署
Angular 应用打包和部署
169 58
|
11天前
|
缓存 监控 JavaScript
Angular 应用打包和部署
【10月更文挑战第16天】Angular 应用的打包和部署是一个综合性的过程,需要考虑多个方面的因素。通过合理的打包和部署策略,可以确保应用在生产环境中稳定运行,并为用户提供良好的体验。你需要根据实际情况选择合适的部署方式,并不断优化和改进部署流程,以适应业务的发展和变化。
|
20天前
|
安全 Linux 数据安全/隐私保护
RHEL 环境下 Subversion 服务器部署与配置
【10月更文挑战第17天】在RHEL环境下部署Subversion服务器包括安装Subversion、创建和配置版本库、启动服务器、客户端连接以及备份与恢复等步骤。通过这些步骤,可确保服务器的安全性和稳定性,满足版本控制需求。
|
20天前
|
网络安全 虚拟化 Docker
SSH后判断当前服务器是云主机、物理机、虚拟机、docker环境
结合上述方法,您可以对当前环境进行较为准确的判断。重要的是理解每种环境的特征,并通过系统的响应进行综合分析。如果在Docker容器内,通常会有明显的环境标志和受限的资源视图;而在云主机或虚拟机上,虽然它们也可能是虚拟化的,但通常提供更接近物理机的体验,且可通过硬件标识来识别虚拟化平台。物理机则直接反映硬件真实信息,较少有虚拟化痕迹。通过这些线索,您应该能够定位到您所处的环境类型。
17 2
|
19天前
|
IDE 网络安全 开发工具
IDE之pycharm:专业版本连接远程服务器代码,并配置远程python环境解释器(亲测OK)。
本文介绍了如何在PyCharm专业版中连接远程服务器并配置远程Python环境解释器,以便在服务器上运行代码。
164 0
IDE之pycharm:专业版本连接远程服务器代码,并配置远程python环境解释器(亲测OK)。
|
27天前
|
应用服务中间件 PHP Apache
PbootCMS提示错误信息“未检测到您服务器环境的sqlite3数据库扩展...”
PbootCMS提示错误信息“未检测到您服务器环境的sqlite3数据库扩展...”
|
18天前
|
域名解析 安全 网络安全
阿里云服务器WordPress环境上安装SSL证书
阿里云服务器WordPress环境上安装SSL证书
|
18天前
|
弹性计算 JSON 关系型数据库
使用ROS模板基于ECS和RDS创建WordPress环境
使用ROS模板基于ECS和RDS创建WordPress环境