案例研究 •

不再有瓶颈
Thinkmill 如何使用 Astro 减少对高级开发人员的依赖

作者
Astro 团队

Thinkmill 是一家位于澳大利亚悉尼的工程和设计咨询公司。他们专注于为客户(包括 Atlassian 和西太平洋银行(澳大利亚四大银行之一))构建数字产品设计系统

Astro 使 Thinkmill 能够通过消除复杂性并避免过度工程化来提高团队生产力。Astro 对现代 Web 开发的 HTML 友好方法意味着开发人员可以更轻松地贡献更改,而无需过度依赖 Javascript。借助 Astro,Thinkmill 成功消除了瓶颈,并将项目贡献者总数从 1 人增加到 15 人。

之前:网站更改需要高级开发人员,成为流程的瓶颈。之后:技术变得更简单,更多人可以在不需要高级开发人员的情况下进行更改。

挑战

Thinkmill 是一家有点不寻常的代理机构。他们没有项目经理,而是由一群喜欢协作的设计师和开发人员组成。在这种结构下,不同领域的成员在项目的相同部分协同工作是很常见的,即使这不是他们的专长。这就是 Thinkmill 面临的主要挑战。

团队希望设计师和内容编辑能够自主地为代码库贡献内容。然而,他们之前的技术栈使用的是 Next.js,因为团队喜欢 React。这使得非开发人员和经验不足的开发人员难以贡献。因此,更新网站需要团队寻求高级开发人员的帮助。这会使开发人员脱离其工作流状态,进入一个完全不同的情境——一个需要时间收集足够数据才能完成工作的情境。这还会阻碍最初负责该工作的人员的工作,因为他们需要解除阻塞。

需求

为了维护一个对于经验不足的开发人员和不熟悉代码的人都易于使用的网站,Thinkmill 需要一个简单的解决方案。

Astro 的文档非常完善,并且拥有一个友好的社区。

Thinkmill 的开发人员倡导者 Simon Swiss 强烈建议团队使用 Astro,因为它文档非常完善。任何想要参与网站开发的人都可以轻松提升技能并开始贡献。非高级开发人员仅使用 HTML 和 CSS 就可以管理网站,而喜欢 React 的高级开发人员也能对 JSX 语法感到熟悉。Astro 还自带了非常实用的内容功能,例如 MDX 支持、语法高亮和开箱即用的分页功能,因此 Thinkmill 无需自行构建这些功能。

“Astro 似乎恰好达到了易用性和强大开发能力的完美平衡。完善的文档和友好的社区是我们选择 Astro 的两大重要因素。”

— Simon Swiss,开发人员倡导者

团队也不确定他们是否会长期坚持所选择的解决方案。这使得解决方案必须具备灵活性,以防将来需要更换。Astro 让 Thinkmill 可以开箱即用地支持他们原有的 MDX 文件。同时,如果 Thinkmill 将来想转向无头 CMS 甚至使用 API,他们也可以做到。

Astro 最终被证明是一个如此简单且灵活的工具,以至于团队将其定为永久解决方案。

Thinkmill 主页。

解决方案与实施

当被问及 Astro 最有优势的两点是什么时,Simon 提到了完善的文档和非高级工程师的易于上手性。

据 Simon 介绍,Astro 对两类人都很容易解释。React 工程师因为 JSX 语法而对 Astro 感到熟悉,而对于只懂 HTML 和 CSS 的开发人员来说,掌握它也并非难事。Astro 感觉就像是拥有 JSX 功能的 HTML,整个团队都非常喜欢这一点。

团队在他们的网站中大量使用了 Astro 组件——几乎将其视为一个 React 项目,但又没有 React 可能带来的任何复杂性。内容集合功能一发布,Simon 的团队就开始使用了。内容集合甚至让 Thinkmill 能够将 Astro 与他们的内容管理工具 Keystatic 结合使用,从而在 GUI 中编辑内容集合。

“Astro 对跨职能团队来说是一个颠覆者。它的简洁性为一种更具包容性的工作方式打开了大门,让设计师也能够深度参与我们网站仓库的代码贡献。”

— Ronald Aveling,首席设计师

成果

减少摩擦

Thinkmill 从需要高级开发人员对网站进行更改,到如今由 4 名非高级设计工程师积极管理网站。此外,包括设计师和开发人员在内,近 15 人为 Thinkmill 网站的源代码做出了贡献。

在 Astro 之前,人们加入网站项目往往需要几天时间来获取足够的上下文才能开始贡献,这很困难。然而,有了 Astro,这个工具如此简单、文档完善且灵活,人们可以在 3-4 天内加入 Astro 项目并开始高效工作。

性能提升

Thinkmill 使用 Unlighthouse 对其 Astro 网站进行了测试,该工具通过 Lighthouse 运行每个页面。几乎所有页面在性能、最佳实践、SEO 和可访问性方面都获得了 100 分。

Unlighthouse 在 4 个不同类别中均获得 100 分的性能得分。