搜索“Headless”，您将找到数千篇讨论这种新方法的文章。大多数作者都欣赏它为前端开发提供的自由，而它的一大群粉丝也欣赏它出色的用户界面（UI）。无论如何，正是电子商务企业对在其在线商店中实施Headless表现出了极大的兴趣。
我之前讨论过渐进式Web应用程序，它是这种方法的一部分。亚马逊、Flipkart和耐克等电商巨头也采用了类似的概念，其唯一目的是提供高端的客户体验。
这篇文章是给Headless网站开发的又一封情书吗？在某种程度上，是的。但我更愿意讨论它对电子商务企业的好处，以及作为第三方网站开发机构，如何帮助一些最受欢迎的电子商务平台实现Headless。
什么是无头电子商务？
基础知识：每个电子商务网站都由两个功能部分组成——前端和后端。
网站的前端充当用户和电子商务门户之间的中间通道，而后端管理产品细节和门户的整个功能。多年来，流行的电子商务门户网站一直坚持传统的方法，即网站的前端和后端由同一个面板控制，这意味着它们共享一个共同的平台。
无头带着全新的策略进入。如果你没有听说过Headless，它本质上是用来分离网站的前端和后端。由于干扰较少，网站的每个部分都独立运行，在各自的领域表现出色——你有一个UI专家来处理门户网站的外观，一个后端专家来加强基础：
为什么它们如此不同？
电子商务门户的基本架构
不深入研究电子商务架构的细节，下面是粗略设计的门户结构，以说明电子商务网站的基本功能及其在每个阶段的交互。
全栈架构
自移动应用程序开发开始成为一种趋势以来，全栈架构是移动网站管理员使用的一种更传统的方法。开发人员创建了一个完整的生态系统，以商业平台为中心，再加上一个集成的店面。门户分别呈现移动和web等单独的平台。交付成果更加独立，并且专为服务平台服务。
以商务平台为中心，商务门户对内容管理、履行和产品数据等后端功能进行优先级排序。
全栈电子商务架构
无头电子商务
与全栈架构相比，无头电子商务结构将网络商店的前端与网站的其他功能清晰地分离开来。它有助于将这个体系结构可视化为独立的部分，而不是一个通用的集中式系统。可交付成果通过api进行管理，这些api提供了一个通用的前端UI，可以巧妙地适应所有平台。
由于显而易见的原因，前端现在优先处理支付和个性化等功能，而商务平台管理内容管理、履行和产品管理等功能。
看起来太专业了？这可以概括为：在呈现全渠道体验方面，无头电子商务比传统方法要灵活得多。
对无头的需求突然上升
Retail Dive和BigCommerce最近在一项调查中得出了惊人的数字，该调查涉及全球高管和营销经理，以及他们在获取数字消费者方面的努力。根据该报告，86%的商业领袖表示，他们正在经历客户获取成本（CAC）的上升。随着付费媒体的成本越来越高，竞争也越来越激烈，报告建议，更好的选择是制定更好的策略来吸引自然流量。
用户消费的内容几乎来自任何地方。除了在线展示和增强购物体验之外，企业还需要为消费者提供跨所有设备的便捷购物选择。这一说法得到了Mediapost调查的支持，该调查声称美国人每人将通过13个网络设备连接。不用说，这个列表包括各种屏幕尺寸的设备，如笔记本电脑、平板电脑、手机、语音识别工具、智能手表、信息亭、汽车平板电脑，以及所有已知的可以访问web服务的设备。
我们实验室中的实际案例：我们如何为客户开发无头架构
作为一家提供定制电子商务解决方案的机构，我们的客户经常要求我们提供快速加载且在用户端同样直观的门户网站。我们所做的是推荐无头方法。出于显而易见的原因，它需要我们付出额外的努力，但这会给他们带来良好的结果。
实现无头Magento
后端：Magento商务平台
前端：Angular JS
问题解决:
加载问题-原来的网站需要7秒才能显示。这意味着屏幕空白超过7秒。默认情况下，Magento提供了一个基于KnockoutJS的CMS的前端设计。高度整合的店面在许多方面限制了网络商店。越来越多的用户已经开始影响商店的业绩。
我们的解决方案:
使用Angular JS设计的无头模板，我们过滤了后端对店面的影响。经典的惰性加载方法将页面加载时间减少了近一半。
结果:
页面加载时间从7秒大幅减少到2.8秒。
另一个无头Magento案例研究
后端：Magento Commerce平台
前端:VueJS
问题解决:
页面导航- Magento的专业知识仅限于后端性能。它的前端相当死板，每次在店面上执行操作时，通常都需要您访问后端。您单击一个新页面，存储将请求传递给Magento后端，处理数据，并允许您加载新页面。在这个过程中，页面导航受到了损害。
我们的解决方案:
我们能够用VueJS在Magento上建立一个单页应用程序。用户现在可以在Vue模板本身的页面之间导航。查询的很大一部分已经在Vue模板上解决了，从而避免了Magento后端被烧毁。
结果:
页面导航时间片的流形。
在Shopify网站上实现Headless
后端：Shopify Commerce平台
前端：Gatsby JS
结账时间过长——包括Shopify在内的任何电子商务平台的结账时间通常都太长。用户在付费前需要填写4页。背景故事-发布每个页面，商店从Shopify后端重新加载下一页，然后是第三方支付网关的处理延迟。也就是说，我们在每个阶段都设置了缓冲，这使得支付部分既耗时又令人恼火。
最重要的是，Shopify限制了自定义结账页面的能力，限制了管理员对其内容的控制。
我们的解决方案:
使用Gatsby JS，我们可以创建一个虚拟的单页结帐部分。我们限制了字段，并将所有细节组合在一个页面中。
结果:
通过流形减少签出会话时间。
无头并不完美
虽然我们声称headless是解决电子商务商店中大多数问题的一种方法，但这当然并不意味着它没有缺陷。以下是不持有Headless Commerce股票的几个理由：
日益增长的成本:
Headless commerce最好的一点是，它的网店没有预定义的前端。开发人员从头开始构建它，以交付面向设备的内容。最糟糕的是，它消耗时间，而且成本可能很高。
除此之外，你还需要花更多的钱，因为营销团队不足以接触到用户。业主高度依赖IT团队在多个设备上启动登录页面。
不是Marketing-friendly
无头商务系统缺少前端表示层。这意味着:
在终端用户的设备上预览内容变得很困难。
营销人员无法在传统的所见即所得环境中创建内容。
构思、创造和发布内容变得越来越慢，因为另一个部门的可靠性提高了。
这意味着无头商业最终将迫使营销人员在内容创建和交付方面更多地依赖IT部门。
店面的限制性改建
Headless商务系统缺乏所见即所得的环境，仅使用基于js的框架构建。虽然它为您的网站提供了足够的空间来扩展网站，但它也限制了您在不太依赖JS开发人员的情况下进一步重新设计前端。
总结
领先的电子商务企业拥有无头架构。最重要的是，这是在永远帮助他们。无头有它的优点，也有缺点。它可能需要你付出额外的努力，但它所带来的结果是持久的。
传统的体系结构仍然足够管理友好，可以继续使用，但话说回来，变化是唯一不变的。