DE{CODE}：2022 年——WordPress 开发者之年

现在是专注于 WordPress 开发的最佳时机。 WordPress 作为世界上最受欢迎的内容管理系统 (CMS)，甚至是最流行的无头 CMS，继续吞噬互联网。 在 DE{CODE} 2022 的主题演讲中，WP Engine 创始人兼首席创新官 Jason Cohen 讨论了 WordPress 开发人员面临的挑战和机遇，以及 WP Engine 正在致力于让他们的生活更轻松的项目。

查看下面的完整视频！

会议幻灯片：

全文抄本

JASON COHEN ：大家好，欢迎来到 DE{CODE}，这是 WP Engine 的年度会议，我们在这里庆祝 WordPress 开发人员。 我叫 Jason Cohen，是 WP Engine 的创始人。 我想以一种信念开始今年的 DE{CODE}，那就是 2022 年是 WordPress 开发者之年。 我将解释为什么我相信今年对我们所有人来说都充满希望和机会，然后我想谈谈如何在这个市场上加速你的职业生涯。

因此，让我从一个问题开始，每个软件开发人员社区都以某些东西而闻名，那么 WordPress 开发人员以什么而闻名？ 我想说 WordPress 开发人员以制作出版商喜爱的精美网站而闻名。 所以这就是我的意思，我们都知道有数以百万计的网站使用 WordPress，但你也有像 Under Armour 这样的人，这是一个使用 WordPress 并雇用 WordPress 开发人员的跨国服装品牌。

现在 Under Armour 去年的销售额达到了 50 亿美元，所以他们使用 WordPress 并不是因为它是免费的。 他们有能力购买他们想要的任何软件。 他们使用 WordPress 是因为它满足他们的要求，他们雇用 WordPress 开发人员是因为您知道如何满足这些要求并制作美观、易于更新的网站。 像这个。

或者国家地理，它是世界上最受尊敬的媒体品牌之一，国家地理需要美观、易于更新的网站，以及能够处理丰富媒体体验的复杂数字资产管理。 所以他们当然会聘请 WordPress 开发人员。 那是您著名的用例。 那技术呢？ 现代科技公司会使用 WordPress 吗？

是的，Dropbox 的团队可以根据需要从头开始构建 CMS，或者他们可以使用任何一直出现的 Site Builder 技术。 但是 Dropbox 选择与 WordPress 和 WordPress 开发人员合作来处理他们网站中需要吸引人且易于发布的部分。 营销团队想要使用与 WordPress 不同的前端技术的用例呢？

所以他们想在 CMS 上使用 WordPress，但在前端使用不同的东西，他们还能使用 WordPress 吗？ 当然，这就是无头 WordPress。 所以他们可以像 Android Authority 那样做出选择，选择无头 WordPress。 所以 Android Authority 仍然使用 WordPress 作为 CMS 来管理作者、内容、媒体以及管理网站后端所需的所有东西，但前端由不同的框架处理。

当一个品牌想要无头的方法时，比如 Android 权威，他们仍然会打电话给 WordPress 开发人员，因为他们想要一个分离网站的性能和安全性，当然，但他们需要该网站来匹配他们的发布工作流程和他们的所有其他事情在过去的近 20 年里，我们一直期望 WordPress 一直在为他们的网站提供支持。 WordPress 开发人员知道如何做到这一点。

让出版商高兴是 WordPress 开发人员享有盛誉的做法，甚至 WordPress 的竞争对手也知道这一点。 一些最受关注的初创公司和网络开发人员一直在谈论 WordPress。 当您浏览他们的网站时，您看到的一个共同点是总有一个页面向 WordPress 开发人员推销。 无论您在哪里看，每个人都对 WordPress 开发人员感兴趣。

这就是为什么我说 2022 年是 WordPress 开发人员的一年，因为您已经掌握了每个发布者的需求，而且这些需求没有改变，只是加速了。 就像，每个发布商都需要来自搜索引擎（如 Google）的自然流量，他们当然需要，而且人们一直在谈论如何做到这一点。 那是新的吗？ 不，显然不是。 基本上相同的文章已经发布了很多年，而 WordPress 开发人员是这方面的专家。

A/B测试怎么样？ 或者更好的是，没有代码 A/B 测试？ 太棒了。 这很创新，对吧？ 现在你将不得不争先恐后地学习这些新工具。 好吧，除非你不这样做，因为你已经这样做多年了。 就像，这个想法在八年前也获得了风险投资资金。 就像，这里没有变化。 仍然没有代码 A/B 测试，你已经知道如何做所有这些。 你已经是这一切的专家了。 那很好。

你们中的许多人还知道 Google 搜索最近发生的变化，使用页面体验作为排名因素。 页面体验意味着诸如页面速度之类的东西，您可能还知道这是 Core Web Vitals 更新。 谷歌以前是否做过这样的更改，您不得不对此做出反应？ 好吧，是的，实际上一直都是，对吧？ 你知道该怎么做。

是的，这是一个新工具，但是让网站变快，这很重要并不是什么新鲜事，谷歌长期以来一直将页面速度作为排名因素，并且它试图推断该网站的访问者是否会长期满意. 这些都是你已经精通的东西。所以在某些方面，世界不会改变。 这值得庆祝，因为在以这些方式为出版商提供服务方面，WordPress 开发人员已经走在了前列。 你已经是专家了。

但在 Web 开发的其他方面，我确实看到了真正的变化。 世界瞬息万变。 这就是为什么我建议 WordPress 开发人员像架构师一样思考。 因此，建筑师将客户的要求与艺术相结合。 架构师还将需求和艺术与正确的技术相结合，无论这意味着建筑材料还是软件和基础设施。

因此，这意味着您需要能够使用所有可用的技术，这意味着要利用新的创新。 现在这可能会很可怕，因为必须学习新东西可能会造成破坏，但这也是工作的一部分。 当我们决定成为软件开发人员时，关于软件的一件事就是它一直在变化。 因此，如果我们要成为优秀的软件开发人员或优秀的架构师，我们就必须紧跟最新的事物，以便我们为我们拥有的不同工作选择合适的技术。

所以像 A/B 测试和 SEO 这样的事情可能变化非常缓慢，从根本上说根本没有真正改变，但技术在变化，你必须掌握它，这就是我接下来 20 分钟要讨论的内容。 这些东西是什么？ 那么，我认为您应该了解甚至采用哪些令人兴奋的技术新变化？ 我想让你瞥见我所看到的我们这个领域有趣变化的温床。

因此，您应该熟悉的用户期望的最大转变称为自适应数字体验。 这就像个性化，但更多。 用户希望网站的外观和功能能够适应他们的特定环境和条件，甚至他们的历史，即使他们没有登录。现在，当您提供个性化的自适应数字体验时，用户会对他们的网站和事实上，有大量数据表明，当网站具有自适应性时，它们的转换效果更好，人们在网站上停留的时间更长，他们点击的链接更多等等。

换句话说，作为一家媒体公司，更多的点击意味着更多的广告收入。 作为电子商务公司，更多的转化意味着更多的收入。 作为一家科技公司或任何类型的在线销售公司，即使不是电子商务，更多的人参与也意味着更多的线索或更多的收入。 因此，在所有情况下，更具适应性的数字体验，意味着更快乐的客户，实际上意味着为客户带来更多收入。 这就是为什么它如此重要。

现在对我们来说好消息是网络的许多进步释放了提供这些适应性体验的能力。 所以让我们解释一下。 让我们展示一些例子。 这是如何运作的？ 这是一个真实的例子，一家在线杂志要求使用 HubSpot 论坛来收集潜在客户。 为什么选择 HubSpot 论坛？ 因此 HubSpot 论坛使用了一种称为渐进字段的技术。

这意味着在用户填写表格后，提供信息可能是为了下载白皮书或以其他方式获得某些东西，HubSpot 会记住这些信息，以便下次该人想要获得某些东西时，他们不会再次被要求提供该信息。 这意味着该人更有可能去获取更多信息，更多地参与该网站而不会被打扰。

这是适应性体验的一个很好的例子。 但有一个权衡。 使用此第三方脚本（如 HubSpot 论坛和本示例中的其他脚本）会降低网站速度。 事实上，他们的灯塔移动得分仅为 40 分（满分 100 分），这意味着他们的网站速度很慢，并且意味着他们不会在 SEO 中排名那么高。 所以你想要这种自适应体验，但它会导致速度问题。 你怎么办？

这就是这种称为 Partytown 的新技术的用武之地。因此 Partytown 将第三方脚本从浏览器的 JavaScript 引擎的主线程中移出，并将其加载到一个单独的线程中。 因此，这意味着该站点可以更快地进行交互，因此用户不会被阻止采取行动、进行交互，并且仅通过使用具有相同酷炫自适应功能的 Partytown，灯塔分数就从 40 分提高到 90 分。

所以你可以拥有非常酷但很慢的自适应脚本，并且让它不慢。 这很酷。 那就是，作为架构师，您应该做的事情才能让您的客户网站变得更好。 所以这是一种让 JavaScript 变快的方法。 另一个重要的表现是媒体，你可能已经知道了，但等等。 因此，任何人，尤其是拥有大量媒体的出版商，都想要漂亮、大而好看的图像。

但是，如果图像非常大，那么它们的下载速度就会很慢，这会降低整个网站的速度，尤其是在手机和移动网络上。 所以现在有了新的图像格式，它们看起来和人类一样，但体积小得多，因此加载速度快得多。 你可能知道其中一些格式，比如你可能听说过 WebP。 但是你可能不知道 AVIF，AVIF，它比 WebP 还要小，但是肉眼看起来还是一样的。

因此，只需切换到 AVIF 图像就可以显着加快该杂志网站或任何网站的速度。 有趣的是。 我说，你可能知道这一点。 去年我介绍了 AVIF，当时它刚刚推出几个月，现在已经一年了，你在使用它吗？ 不，几乎没有人使用它。 据 W3Techs 称，即使使用 WebP，也只有不到 0.1% 的网站在使用 AVIF，只有不到 4% 的网站在使用它。

因此，从某种意义上说，这些技术已经过时或应该为人所知，但如果您使用它，您仍然处于前沿。 这是加速网站的一种非常简单的方法，当然，这对用户和图像格式的 SEO 都有好处，但人们通常仍然不这样做。 现在，您可能会发现 WordPress 不支持 AVIF 但它支持 WebP 图像。

因此，也许 WebP 对您的客户来说足够好，使用常规 WordPress，或者这可能是使用无头 WordPress 的另一个原因，因为这样自动支持 AVIF 就容易得多。 这取决于您兼顾客户需求、兼顾技术能力并找出将它们组合在一起的正确方法。 但我认为作为一名架构师，完全忽略这一点并不是一个好的选择。 我认为您应该在这里开发一些技术，因为这是帮助您的客户的一种非常简单的方法。

那么让我们看看前端发生的另一项创新，即台式机和手机上的用户设置。 现在出现了五年前不存在的这些新的基于 Web 的设置，您客户网站的访问者现在希望这些设置得到尊重。 因此，对于像我这样希望网络更大一点的人来说，减少运动、字体大小、浅色和深色模式偏好，无论是从一天中的某个时间开始，还是只是用户在任何时候的偏好，或者可访问性，确保网站即使对于使用各种方式与网络交互的人也能正常工作。 也许对于盲人或其他特殊情况有时需要调节。

这对用户来说很好，我想，但这对您来说是很多工作，因为您必须实施支持所有这些的站点。 这里还有另一个问题。 当你建立一个自适应的网站时，无论是像这样的设备功能还是其他东西，取决于用户的东西，你如何测试它？ 你如何确保它在所有这些不同的情况下都能正常工作？

所以就像我们都习惯的一件事一样，我想在这一点上，我要拿我的网站，我要测试它的手机大小，然后测试它的 iPad，然后为笔记本电脑测试它，也许再次为超宽屏幕测试，但我已经测试了三四件事。 但是现在——好吧，在每一种情况下，如果字体大小设置得非常大怎么办？ 看起来还对吗？ 你在测试那个吗？ 浅色模式和深色模式呢？ 这是您必须测试的事物数量的 2 倍。

所以这些东西中的每一个，字体大小，灯光模式，可访问性，使用不同类型的浏览器，所有这些都会增加你必须测试的东西的组合。 所以这有点难。 所以对于某些人来说，这就是他们进行自动化测试的目的。 也许其中一些案例可以通过自动化测试来处理，而不是每次都由人来查看所有内容。

所以这很好，但这不是一个完整的答案，因为自动化测试不会知道暗模式网站是否看起来正常。 这真的是人类必须判断的事情。 所以这个测试的东西仍然是一个谜，我会稍微回到它，因为我将向你展示下一项技术，它在其他方面也有助于解决这个测试难题。

所以接下来我要展示的是一些非常巧妙的东西，我个人非常兴奋我们正在使用 CSS 和 HTML，因为我一直希望这样做。 事实上，我什至亲自编写了代码来尝试在 JavaScript 中执行此操作，因为我非常想要它。 现在它原生支持 CSS 和 HTML，这意味着它将随处可用。 Performant 和所有其他工具都将支持它。 所以我对此感到非常兴奋。

那是什么？ 所以你可能熟悉 CSS 媒体查询。 因此，这允许您根据整个屏幕的大小提供不同的布局或外观。 但是现在自适应布局有了新的东西，叫做 CSS 容器查询。 因此，布局不会因整个屏幕的大小而不同，单个组件可以仅根据其大小或仅根据其周围的组件以不同方式显示。

因此，例如，我可能有一个像您在这里看到的那样的组件，它有一个更宽的版本和一个更窄的版本。 现在我可能需要手机上的窄版和笔记本电脑上的宽版。 这是我们通常的思考方式。 但是，如果在宽版中我实际上有三列怎么办？ 所以在每一列中，我都想要窄麦克风。

现在看到当前的 CSS 不支持那个。 它只是说整个屏幕很宽，所以你很宽，而不是是的，屏幕可能很宽，但你在一列中，所以你仍然需要表现得像在打电话一样。 这就是容器查询所做的。 对此超级兴奋。 现在，这只是一个更大趋势的一部分，即转向考虑网页，而不是作为一个完整的网页，而是从组件的角度来考虑它。 一页的片段。

现在，作为一名 PHP 开发人员，您已经习惯于分离一些东西。 样式在这里，功能在那里，整个页面布局在那里等等。 但转向组件是一个更大的转变。 它是说页面内部的片段应该由这些可重用的独立组件组成。 Web 的底层技术（如 CSS 和 HTML）正朝着组件方向发展，正如您刚刚看到的这个组件，就像在思考我的尺寸应该基于我自己而不是基于更宽的页面。

你当然也可以在古腾堡看到这种思维。 所以 WordPress 用户不再编写这些长页面。 他们正在组装积木。 块是组件。 您可以以任何您想要的方式重复使用和组装的单元，无论是文本、标题或图像等内容片段，还是列和选项卡等布局以及各种其他内容。

当然，对于完整的站点编辑，这只会更进一步。 现在布局整个页面，还有作为组件的块，这就是我们使用 WordPress 的方式，所以这是一个转变，作为 WordPress 开发人员，您必须接受这样的转变，以免落后。 因为无论你是从 HTML 和 CSS 等底层技术来看它，还是你看看 WordPress 已经去了哪里，以及它在古腾堡和完整网站编辑方面的发展方向，所有这些都表明你必须考虑组件中的事情，甚至可能开发组件之类的东西。

当您查看更广泛的前端开发网络（如无头网站和 JavaScript 世界）时，情况也是如此，这完全是同一个故事。 所以像这样的 JavaScript 框架，react、view 和 angular，几乎每个人都使用其中一个，它们从一开始就是基于组件的。 多年。 您不会将东西放入单独的文件中，而是将组件放入单独的文件中并重用它们。

所以这就是无论你使用无头的 JavaScript 还是使用 WordPress 或者你只写 HTML 和 CSS raw，你仍然需要考虑组件。 所以它有很多价值。 这有点像面向对象编程如何封装数据和代码。 同样，Web 组件封装了外观、行为、数据和代码，并使它们可重用，这很棒。

另一件事，除了可重用和可组合之外，它们是可单独测试的。 所以这又回到了我们正在谈论的测试方面。 所以你可以拿一个组件，甚至只是一个按钮，然后你可以在这些不同的上下文中测试它。 当文字变大或变小时，按钮是什么样子的？ 按钮在不同类型的浏览器上是什么样子的？ 在浅色模式或深色模式下按钮看起来像什么，等等。

当您单独测试一个按钮时，测试各种组合会容易得多，更容易修复错误等等。 然后你就有了一个漂亮的可重复使用的按钮，之后你就不必继续测试了。 因此，通过拥有一组可单独测试的组件（这更容易），您现在可以编写第一次就可以工作的页面。 因此，这又是问题的一部分，嘿，我该如何测试和构建这些在所有这些不同情况下都能正常运行的网站？

所以组件，这是我认为您需要处理网站的架构师的一种方式。 因此，作为 WordPress 开发人员，您已经了解了很多世界。 您了解如何与发布商合作。 您了解如何将他们的要求转化为现实生活。 您了解如何混合代码、艺术和需求，并制作出精彩而有效的网站。

诀窍是学习和引入这项新技术，这样您就可以利用自适应体验等东西，以及这些东西背后的工具和组件来构建这些东西，而不是落后。 因此，在 DE{CODE}，此处的演示旨在帮助您做到这一点。 所以在 DE{CODE}，我们有一个 headless WordPress 的轨道，你可以了解什么时候为客户使用 headless，什么时候不使用 headless。 我们有研讨会帮助您从头开始使用无头，非常快，就像在几分钟内。 所以如果你对此很好奇，那就去看看吧。

我们也有电子商务和管理 WordPress 和其他主题的突破。 我的建议是，当你度过这一天，当你浏览所有这些会议时，你会吸收你能吸收的东西，做笔记等，但你会寻找你说的一两三件事，好的，那些是我要尝试的事情。 我要学习那些东西。 我将尝试将这些东西带入一个项目中。 我会在这方面做得很好。 也许我什至也回到我现有的客户那里说，嘿，让我们升级您的网站以使用它。

因此，请留意您将要带走并作为架构师实际付诸实践的那几样东西。 因此，继续取悦那些发布者，继续扩展到新的领域，作为一名架构师继续成长，今年，2022 年，将是您作为 WordPress 开发人员最好的一年。 谢谢。