在规划电子商务网站的技术交付时,我们需要能够确保每个页面,尤其是显示我们产品信息的页面始终能够快速加载。在备受瞩目的活动或假期期间,这一点更为重要,因为我们可能会看到网站流量激增,这可能会给服务器带来压力,导致服务器出现故障或性能不佳。
我们如何才能让我们打造的购物体验能够抵御超级碗比赛并为黑色星期五做好准备?
一种方法是预先生成我们的网站,包括产品详细信 台湾电话号码几位 息页面 (PDP),并直接从 CDN(内容交付网络)为其提供服务及其所有资产。这可能非常有效,但如果我们还希望我们的 PDP 包含本地化价格和货币,或者指示实时库存水平或其他动态内容,该怎么办?完全预先生成的页面不太适合,并且依赖客户端 JavaScript 来呈现产品页面的目标和动态部分可能会影响页面性能(进而影响转化)。
提高页面加载时间的方法
过去构建或投资昂贵的 CDN 产品的大型企业对 Edge Includes 的概念并不陌生,但现在由于 Netlify Edge Functions 的一个特殊功能,这种功能变得更加容易使用 - 它们不仅可以拦截HTTP 请求并提供自定义响应,它们还可以转换 HTTP 响应,这意味着它们可以对返回给用户的资源进行关键修改和添加。
结果,Edge Includes 成为我们所有人都可以使用的工具!
“边缘增强”的好处
为什么不按需进行所有渲染呢?毕竟,Edge Functions 确实提供了这种功能,您可以直接使用该功能,也可以通过许多在幕后利用 Netlify Edge Functions 的流行框架来使用。对于某些用例来说,这是一个完全可行的选择,但是当我们的目标是:
为我们的客户创造非常快速加载的页面体验;
最大限度地减少影响内容呈现的执行错误或瓶颈的风险;
减少高流量的能源消耗和计算成本;
那么我们可以做得更好,提前预先生成尽可能多的网站和页面内容,然后在某些页面通过 CDN 边缘流向用户时增强某些页面的关键部分。产品详细信息页面是很好的选择。
框架和实施
下一个合乎逻辑的问题可能是“哪些框架支持这个?”。值得庆幸的是,该模型不依赖于任何特定框架的独特功能,并且可以与任何能够预先生成页面的工具结合使用。
Nuxt、Eleventy、Astro、Hugo、Next.js 等工具,如果配置正确,都可以用来生成包含 HTML 的网站页面,可供 Edge Function 进行寻址和更新。