案例研究 •

大幅削减开发成本
WP Engine 如何使用 Astro 的 Starlight 将开发成本降低了 50% 以上

作者
Astro 团队

WP Engine 是全球最大的托管式 WordPress 主机服务提供商。每天有 8% 的在线用户访问 WP Engine 网站。在如此大的规模下,维护良好的文档至关重要。但 WP Engine 团队面临一个问题:他们花在维护文档代码库上的时间比编写实际文档的时间还要多。必须做出改变。

Starlight 是一个功能全面、环保、默认可访问的文档主题,基于 Astro 构建。WP Engine 选择 Starlight 为其新的文档网站构建 Atlas,这是 WP Engine 针对无头 WordPress 应用的托管解决方案。结果不言自明。

Starlight 使 Atlas 团队的工作速度提高了一倍,并将开发成本降低了 50% 以上。如今,团队将 95% 的时间花在内容上,几乎不花时间在代码维护和配置上。

内容运营速度提高一倍,同时开发成本降低 50% 以上。

挑战

WP Engine 之前的文档网站存在三个主要问题。

首先,他们的文档以前存储在一个独立的 GitHub MDX 仓库中,而 Next.js shell 会从中获取这些文件。每次 MDX 文件更改时,都不会自动触发网站重建或预览。为了解决这个问题,团队有一个专门的开发环境,用于在部署前测试更改。然而,这意味着额外的 Git 分支管理。

其次,文档网站的视觉和功能更改都需要很长时间。最重要的是,以前的文档网站外观不佳,也没有包含他们希望用户拥有的所有功能。

第三,由于 MDX 到 React 的解决方案,只有开发人员才能贡献内容。这阻碍了主要文档贡献者(如产品经理或客户支持人员)自行进行更改。

需求

为了解决 WP Engine 的三个主要挑战,他们需要一个低门槛的解决方案,以提高文档维护者和贡献者的易用性。它需要消除将前端开发上不必要的时间投入作为良好文档的障碍。

幸运的是,WP Engine 的开发倡导者 Jeff Everhart 知道一个解决方案。

解决方案与实施

2023 年 8 月,Astro 在 Product Hunt 上推出了 Starlight,提供了一个用于构建现代化文档网站的开源 Web 框架。Jeff 熟悉 Astro,但还没有很好的理由使用它。Starlight 提供了一个绝佳的机会。

Starlight 主页。

Starlight 对 WP Engine 来说是完美的,因为它包含了他们所需的所有可重复元素。它开箱即用地提供了导航、搜索、国际化(i18n)、语法高亮、深色模式等功能。更重要的是,每一个元素都看起来很棒!还有许多自定义选项,包括能够轻松指定亮色和深色模式的标志。所有这些都无需编写太多(甚至无需编写)自定义 CSS 即可实现。这使得 WP Engine 能够主要专注于编写内容,而不是花费多个冲刺周期来构建用户界面。

Starlight 文档示例。

Starlight 框架还是一个完全静态的解决方案,只输出 HTML。这降低了文档维护者和贡献者在更改网站时的入门时间,因为双方都无需学习 Javascript 或 React 即可发布内容。

从他们之前的解决方案迁移到 Astro 几乎是无痛的。Jeff 的团队所要做的就是将现有的约 100 个 MDX 文件复制到 Starlight 模板中,然后他们就拥有了一个实时网站。他们可以通过配置文件和简单的 CSS 样式表管理所需的一切。由于 Starlight 非常易于使用,他们的文档团队只需极少的培训即可上手。

成果

使用 WP Engine 之前的解决方案时,他们的团队花在管理文档网站上的时间比处理实际内容的时间还要多。如果之前编写内容与管理网站的时间比例是 30:70,那么现在接近 95:5。Astro 的 Starlight 框架将摩擦力大幅降低,以至于 WP Engine 团队的一位产品经理对这个新的 Web 框架如此评价:

“无论是从客户体验角度来看,它都好得多,而且它还为我节省了无数时间,否则我不得不花费大量精力来仔细测试和优化 Atlas 文档的新页面。”

— WP Engine 产品经理

由于消除了大量 Git 操作和手动测试步骤,WP Engine 的内容运营速度**提高了 2 倍以上**。由于流程更简单,人们也更愿意贡献内容。Starlight 还帮助他们**将开发成本降低了 50% 以上**,因为它开箱即用地提供了 WP Engine 所需的所有 UI 元素。保持其解决方案的最新状态也比以前容易得多。以前,他们必须管理与不同 UI 元素(例如下拉菜单)相关的多个依赖项。因此,他们有更多的 Dependabot 票据需要解决。使用 Starlight,他们只需更新一个框架。

之前:大量 Dependabot 票据。之后:0 个未解决票据。