推动 Web 和移动应用发展的技术从未停止演进,每个新阶段都为商家创造了机遇。最新的迭代是边缘网络能力的扩展,有助于在线商家提升性能和用户体验。
性能和用户体验对于 Google 新的“Core Web Vitals”计划至关重要。Google 网页性能工程师 Ilya Grigorik 指出,该计划为“对 Web 卓越用户体验至关重要的质量信号”提供了统一指导。
Core Web Vitals 将影响自然搜索排名,由以下三个要素组成:
- Largest Contentful Paint(最大内容绘制):衡量感知加载速度,标记页面主要内容可能已加载的时间点。
- First Input Delay(首次输入延迟):衡量响应能力,量化用户尝试与页面进行首次交互时的体验感受。
- Cumulative Layout Shift(累积布局偏移):衡量视觉稳定性,量化可见页面内容的意外布局偏移量。
Google 的 Core Web Vitals 试图量化访问网站时的感受。
技术栈
在电子商务行业,针对技术栈的重大变革正在持续发生。虽然并非所有电商企业都会急于更换平台或改变构建、部署及管理在线商店的方式,但不断演进的技术栈使公司能够更好地提升竞争力(如 Core Web Vitals 示例所示),并发现新的电商细分领域或机会。
换言之,如果电商店铺在当前页面性能、SEO 及加速移动页面等新功能方面遇到困难,借助熟悉 JavaScript 及边缘平台等新兴技术的前端开发人员来掌控这些领域是合理的选择。
边缘平台
边缘平台结合了边缘网络(如 CDN)的优势以及持续集成和静态页面渲染的特性。
Vercel CEO 兼 Next.js 联合创始人 Guillermo Rauch 表示:“在电商背景下,这最好被理解为一个光谱:一端是无代码,另一端是成为 AWS 专家、编码专家并从头构建一切。”
电商平台范围广泛,从 Shopify、BigCommerce 或 Wix 等无代码拖放式方案,到由专家团队从头构建的网站。
Rauch 补充道:“Vercel 实际上处于这个世界的低代码解决方案中间。”
Vercel 及其竞争对手(提供静态托管、CI、CDN 或其组合的公司)正为电商运营提供对业务、品牌及产品展示的完全控制权(相较于无代码拖放方案),同时帮助交付网站而无需大量基础设施专业知识。这是一种“恰到好处”的方法——既不太热也不太冷。
Next.js:对于 Rauch 而言,边缘平台如何同时提供强大功能和灵活性的例子始于 Next.js 框架,这是他在 React 之上创建的。(Facebook 于 2013 年 5 月发布了 React。)
“与自行设置前端基础设施相比,Next.js 使人们能够用极少的代码快速启动并运行前端。”
Vercel CEO Guillermo Rauch 描述了其公司如何帮助前端开发人员使用 Next.js 创建出色的电商网站。
换句话说,Next.js 使得使用 React 并使 React 对搜索引擎友好变得更加容易。
早期 Next.js 生成可快速交付且易于 Google 爬虫读取的静态网页。随着时间推移,该框架演变为处理更复杂的网站,并包含服务器端渲染和预渲染。
Rauch 表示:“这对前端开发人员来说犹如梦想成真。你可以使用最新的 React 技术,并拥有掌控整个渲染过程的能力。就前端而言,你基本上可以做任何想做的事。”
“但问题在于,当涉及部署这项技术并满足最高性能标准及生产就绪优化(如资产压缩、图像优化和 CDN 缓存)时,这些都是前端开发人员难以触及的。他们往往处于孤立状态:编写 JavaScript 和 HTML 后,需等待其他团队确保在生产环境中正常运行,”Rauch 说。
Vercel 等边缘平台解决了这一问题,从而降低了拥有高性能电商站点的门槛。
边缘平台的使用情况
以下是边缘平台与其他新兴电商技术结合的一个示例:
Headless(无头架构):假设你是一家在线行李箱店店主,通过多个市场、应用、直播及自有网站销售产品。你想集中管理产品信息,但需要多种展示选项。使用 BigCommerce 作为无头 CMS,可获得成熟电商后端的所有优势,而不必局限于单一产品展示方式。
React:由于 BigCommerce 无头 CMS 通过 API 访问,可使用 React 轻松获取产品数据。此外,React Native 使得用相似代码库构建原生移动应用变得相对容易。
Next.js:你希望拥有极速网站以满足 Google Core Web Vitals,但又想实施强有力的个性化营销。若所有页面均静态渲染,如何实现个性化?
边缘平台:可使用 Vercel 边缘平台,根据客户细分渲染每个产品页面的多个版本。大部分个性化处理在网络边缘完成,从而提供极快的性能和个性化体验。
这只是一个例子,还有许多其他可能性。

