【译文】在 Meta 工作 12 年：回顾我参与的所有项目

|

今天，我已经在这家公司工作了 12 年，现在是回顾我参与的所有项目的好时机！

随着时间的推移，我发现我最得意的项目是研发阶段已经结束、技术已经成熟但需要转化为合适产品以开始指数增长阶段的项目。我最大的优势是让人们对疯狂的项目感到兴奋，并一起工作。”将人们联系在一起 “在我心里根深蒂固！

照片

标记 Tagging

我在新兵训练营的任务是 “使用新的 face.com 边框改进标记”。我做了很多用户体验调整，这样你只需按回车键和向下箭头就可以标记整张相册，这使得 Facebook 上的标记数量大幅增加。

最棒的是，这不仅仅是标记。该通知是整个网站点击率最高的通知：每个人都想知道自己看起来如何。因此，增加点击率能提高参与度。因此，改进人脸检测和/或识别的人工智能模型直接提高了参与度。这是我们第一次在新闻推送之外为人工智能模型建立这种正反馈循环。

在必要时，我们还利用人脸信息来更好地裁剪图像。我们不在中心位置裁剪，而是找到最适合人脸的位置进行裁剪。这大大减少了尴尬裁剪的数量。

图片交付

我加入了照片团队，负责个人主页照片页面的工作，该页面是访问量第三大的页面，每周有数十亿的浏览量。当时我还没从大学毕业（这是我最后一次正式实习）。疯狂之城

总之，我研究了整个行业中所有显示图片的布局算法，最后实施了一种。它并没有取得开创性的成功（虽然新闻推送的多图片布局至今仍基于我的研究成果！），但在构建过程中，我一直在努力寻找如何显示大小合适的图片。

事实证明，不止我一个人在努力，我们在网站上到处发送错误的尺寸。最后，我创建了一个应用程序接口，将所有尺寸计算抽象出来，并转换了最大的调用网站。

第一次转换节省了 Facebook 出口总额的个位数百分比。不仅如此，有了以编程方式查找尺寸的方法，我们就可以在上传时停止存储尺寸不合适的图片，这让我们在第二年删除了两位数比例的图片存储。这个方法至今仍在使用！

React

我对 React 的主要贡献不在于技术，而是围绕它建立了一个社区。早期，我每周都会总结 React 中发生的所有事情，以引起人们对它的关注。

一年后，社区已经足够大，我最终组织了首届非常成功的 React.js 大会，并大力参与了其他一些新出现的会议，如巴黎的 React Europe 和 React London。

在第一届 React.js 大会期间，我还鼓励内部人员讨论 GraphQL，这最终成为了另一个独立的大型项目。

最近，我还让原班人马参与了 React Documentary。

React Native

我参加了最初促成 React Native 项目的黑客马拉松，并在之后的几年里一直致力于该项目。我们的目标是帮助实现 Facebook 当时的 “移动优先 “转型。

影响

React Native 如今非常成功。在美国应用程序商店的所有类别中，排名前 100 的应用程序中约有 20% 采用了 React Native SDK。

在内部，Marketplace（比 Craigslist 还大）、移动广告管理器以及危机响应等一系列功能都在使用 React Native SDK。

我们的 AR/VR 技术在很大程度上依赖于它。所有 2D 头显都是用 React Native 构建的。我们硬件的所有配套应用程序（Quest、Rayban……）也都是用 React Native 构建的。

Yoga

作为项目的一部分，我按照 flexbox CSS 规范重新实现了一种元素布局方式。它最初被称为 css-layout，后来更名为 Yoga。

这个项目背后的原因是，应用程序框架（iOS、Android、Web……）实现的所有布局算法都各不相同，互不兼容，但却做着同样的事情。如果我们想在不同平台之间共享代码，就需要有一个统一的算法。而除了 Web 之外，您可以在所有平台上实现不同的布局。

它在 React Native 上取得了成功，后来又被 ComponentKit（iOS）和 Litho（Android）所采用。这不仅对其本身产生了巨大影响，还意味着当 Bloks 项目出现时（使用 XHP 从 Hack 驱动 UI），你实际上只需编写一次，就能在所有平台上运行。包括在 Bloks.js 项目启动时的网络平台。

它不断取得胜利，Threads 就是使用它构建的，而且他们可以在如此短的时间内实现三个功能。

CSS-in-JS

为了避免出现类似 React 发布时将 HTML 和 JS 混合在一起的反斜线，我去参加了一个会议，谈到了将 CSS 和 JS 混合在一起会有很多好处。

不出所料，这引起了很大争议，但同时也催生了整个库生态系统，使其得以运行，并改变了人们编写前端代码的方式。

我花了 3 个月的时间，试图在我们的网络堆栈上实现 React Native 风格系统，但并没有得到很多人的支持。直到我们决定使用 Comet 重写整个前端堆栈，这才以 Stylex 的名字被人们所接受。几个月前，我们刚刚将其开源，如今 Meta 的所有 CSS 都是这样编写的。

行业影响

虽然人们对 React Native 的跨平台特性非常感兴趣，但我们首先关注的是如何让它在单一平台上提供比现状更好的体验。

生态系统的其他部分也注意到了这一点。推动 Airbnb 采用 React Native 的技术负责人转投谷歌，利用非常相似的理念创建了 Jetpack Compose。苹果公司多年来一直在秘密开发一个名为 SwiftUI 的竞争框架，采用的也是同样的模式。谷歌构建了 Flutter。

开源

我一直在公司内部大力倡导开源，这已经不是什么秘密了，这也是 Facebook 的早期使命 “让世界更开放、更互联 “的体现。几年前，我亲自参与了最受欢迎的前 20 个 Meta 项目中的一半。

Docusaurus

我们需要为每一个开源项目建立一个网站。当 React 发布时，我使用 React 为其建立了网站（即使我们并没有使用它）。然后，我把它复制粘贴（是的……）到我们接下来的多个项目中：Jest、GraphQL、Watchman…

后来，开源团队来了一个实习生，他把我复制粘贴的网站打包成了一个合适的工具，叫做 Docusaurus。

现在，我们大多数开源项目都用它来创建网站。这个项目也是开源的，我经常看到业界的许多开源项目也在使用它。

同步

对于开源项目来说，真相的源头在哪里是一个巨大的问题。要么在 github 上，要么在我们自己的代码库中。

对于首先使用 github 的项目来说，情况相对简单，一切都在 github 上进行，我们偶尔会在内部导入整个项目，并将其作为其他第三方依赖项使用。

但如果你想成为内部第一，那么你就需要能够在员工手动抽查后将拉取请求作为内部差异导入，向拉取请求发送经过净化的 CI 反馈，并将所有内部提交同步到 github。

我为 React Native 构建了很多这样的基础架构，从那以后，所有内部优先的开源项目（包括 PyTorch）都在使用它。

Discord

我们最初是在 IRC 上创建 React 社区的，但随着时间的推移，Reactiflux Slack 频道的使用率越来越高。直到 Slack 决定专注于公司用例，并开始按用户收费。他们给出了每月 10 万美元以上的账单，因此它不得不转移到其他地方。

我开始寻找其他选择，说实话，它们都很糟糕。除了一个不太可能的选择：Discord。当时，这是一款以游戏为主的应用程序，主要用于语音。几年前，我曾帮助他们的首席技术官解决过 React Native 的问题，因为他们是最早在移动应用中使用 React Native 的公司之一。

最终，我策划了这一举措，并取得了巨大成功。但后来的情况是，这在开源社区中掀起了一股潮流，Discord 最终成为了所有项目建立社区的地方。

Discord 为开源社区创建了一个特定的产品变体，并最终重塑了整个公司的品牌形象，使其不仅关注游戏玩家，更关注每一个人。

在线集成开发环境

我喜欢做一些辅助项目，但我发现与我信赖的 PHP 相比，JavaScript 栈的入门太麻烦了，所以我写了一个挑战来改善现状。

结果有两个人接受了挑战，并最终创建了两家成功的公司：CodeSandbox 和 StackBlitz！一个问题的框架竟然能产生如此巨大的影响，真是不可思议。

代码格式化

当我在 2017 年开始开发 Prettier 时，Meta 公司还没有人相信在适当的编程语言上可以自动生成完整的代码格式。

我很高兴现在的情况正好相反，没有自动格式化的编程语言是个例外。

一些时间轴和亮点。

  • 2017 年 1 月 10 日，prettier 初版开源。
  • 2017 年 7 月：50%.2017 年 12 月：75%.2018 年 3 月，100% 的 www js 文件使用 prettier 格式化。
  • 2018 年 3 月，Łukasz Langa 首次发布了以 prettier 为蓝本的 python 格式化工具 black。
  • 2019 年 7 月，@format 在 hack 文件上启用 hackfmt。
  • 2021 年 11 月 30 日，70% 的 hack 文件使用 hackfmt 格式化，并将其设为默认格式。

这是一条漫长的道路，许多人花了大量时间清除所有技术（CI、linting、codemods、land、IDE 集成……）和非技术（说服人们这是一个好主意）方面的路障。

我很自豪，Facebook 一直在引领着这个行业的发展，而更美和更黑都源自这里。

我使用的是 JavaScript 年度调查，他们会问人们在行业中使用什么工具。遗憾的是，几年前他们不再问这个问题了，因为 “prettier 就像 git，每个人都在用”。

Prettier 的资源也相对充足（在开源标准中），捐款总额达 12 万美元。在过去的两年里，我每月向两个人支付 1.5 千美元来维护它。

我也很高兴我再也不用格式化我的代码了。这实在是太浪费时间了，既浪费了编辑代码的时间，也让人们在进行代码审查时无端陷入冲突。

客户端基金会

我加入了客户端基金会，该基金会正在开发所有工具，用于管理 iOS、Android 和 Web 版 Facebook、Instagram 和 Messenger 的客户端性能和可靠性。当时的想法是，公司有太多的工具，客户觉得它们混乱、难看，而且数据不可信，他们需要帮助来解决问题。

用户体验团队

我首先查看了公司的人员构成，其中有 0 名项目经理、0 名设计师和少量用户体验工程师，但大部分人都不从事用户体验工作。很明显，我们需要在这方面做出改变才能取得成功。我开始招聘人员，并转型为经理，为他们提供支持。

我们需要围绕用户体验在纯信息组织中的作用开展大量教育工作。我发现做到这一点的最有效方法是积极参与客户基础校准和组织全公司范围的 UIE Mashups。

我离开公司时，在一个 150 人的组织中管理着 25 个人。我们有 3 个项目经理和 3 个设计师。因此，用户体验人员的比例约为 1/5，这是有道理的。

CV Home

我推动的产品战略是对度量有一个统一的定义。有了这个定义，我们就能构建协同工作的工具，而不是大量的一次性工具。

第一步是 “不成功便成仁”。在前端工作的好处是更容易做出改变。这就是 Perf Overview / CV Home 的诞生。

我们将显示顶线指标、指标回归实验、主要 QPL 点和其他一些指标。我们是以数据为导向来决定构建什么的。我们会查看实际发生的 SEV，并计算特定数据源的有用性。

Program Runner

JoBerg 做了一次远景规划，主要发现我们的客户不是产品团队，而是产品基金会。这促使我们投资开发新产品：Program Runner。

Facebook 应用程序历来只关注启动性能和新闻推送滚动性能。这是有道理的，因为大部分时间都花在这上面。但实际上，Facebook 内部有许多子产品，如果这些产品出现问题，就会影响用户的整体体验。

因此，产品基础战略发生了变化，为 iOS 和 Android 的数十个团队制定了基准指标。这也是我们首次使用客户端基础工具来实现这一目标。

Flight Deck

发布工程部将加入客户基金会，我被要求帮助他们制定产品战略。

Releng 的首要工作是指导 www 和我们移动应用程序的发布。但是，负责移动应用程序发布的 TPM 只做了 3 个月就辞职了，因为这个过程压力太大，而且非常耗时。

这就是 “让克里斯开心 “行动（另一个克里斯）开始的原因。我们深入研究了他在发布过程中必须完成的所有任务，并将其实施到一个名为 Flight Deck 的新工具中。

这极大地改进了移动版本的发布流程，并将其扩展到 Releng 支持的所有表面。

Excalidraw

我用一个工具为我的博文绘制类似手写体的图片已经有 15 年了。但在 2020 年 1 月，这个工具坏了，于是我决定重新实现它来玩玩。

我没想到，3 个月后，Covid 的出现让所有人都回家了，并为虚拟白板创造了一个市场。事实证明，excalidraw虽然只有3个月的历史，却是当时最好的工具。

包括 Facebook 在内的所有科技公司都开始在面试过程中使用它。此外，它还被用于许多日常活动，如头脑风暴、架构图、笔记插图……

为了扩大它的影响力，我说服两个人创建了一家公司，以支持围绕它的 SaaS 产品。结果发现，尽管它是端到端加密和开源的，但如果没有公司在背后支持，很多公司都不愿意将它用于内部文档。

该公司目前有 10 名全职员工，在没有任何投资的情况下实现了盈利。它支持开源版本，该版本每年都会进行有意义的更新，我们在 Meta 使用的就是这个版本。

在 excalidraw 的成功基础上成立了几家公司，并筹集了数百万美元。Tldraw公司是Excalidraw公司贡献者的衍生产品。利用 excalidraw 创建会议侧视图的 Eraser。

拥有一块好的虚拟白板很可能成为任何工作环境的核心组成部分。Covid 让人们开始寻找它，但即使在人们回到办公室后，它依然有用。

GenAI

虽然我一直专注于前端领域的工作，但实际上我在学校学习的是计算机视觉和人工智能。自从我加入 Facebook 的 “深度学习 “以来，我一直密切关注着人工智能领域的蓬勃发展。

当 ChatGPT 开始掀起波澜时，我很快就相信，我们需要有类似的东西，让员工在我们的代码库、维基、反馈群组中接受培训……

值得庆幸的是，公司将其列为优先事项，并很快围绕该项目组建了一个大团队。我做了几个关键的决定，以确保这个后来成为 Metamate 的项目能够成功，因为很多人都加入了进来：

  1. 我们应该在一个地方存储通信历史记录。在实际操作中，存储数据会涉及大量隐私和合规流程。我们应该一次性完成，而不是让一堆项目半途而废，需要随着时间的推移进行修复。
  2. 很多价值将来自与我们各种内部工具的集成。一开始，我使用的是通用工具，如通过 Butterfly 集成的 Workplace Messenger、Comments 和 Groups。然后我们又看到了 chrome 扩展、Phabricator、SEV……我预计在未来几年内，它们中的大多数都会以某种方式使用人工智能。
  3. 主要的切入点将是一个实习工具，它应该被当作消费品来对待。该项目最初的资金来源是一个 VSCode 助手。我还做了大量的工作并施加了很大的影响，让实习生工具给人的感觉非常棒，而且用户界面没有任何跳转。
  4. 我们应该对模型的适当推广流程进行投资。公司的人工智能模型交付感觉像是从软件工程原理上退了一大步。我推动建立了一套适当的问题/答案对测试套件，以确保我们能够跟踪模型随时间的变化，防止模型出现倒退。
  5. 作为函数的 LLM。到目前为止，大多数 LLM 的使用都是 “一次性 “的，我们在提示符中准备大量数据，然后将 LLM 的结果返回给用户。但我相信，我们会越来越多地将 LLM 用作代码库中的一个构件，就像普通函数一样。为此，100% 强制 LLM 按照模式返回正确 json 的能力将至关重要。

这个项目给人的感觉就像早期的 Facebook，一群人团结在一起工作，快速发布很酷的东西！

科技界女性

谢丽尔-桑德伯格（Sheryl Sandberg）给了我很大的启发。我已经做出个人承诺，尽我所能让我身边的女性获得成功。

我挤出时间参加与女性相关的活动，了解她们面临的挑战，比如一年一度的 “女性领导日”。我积极主动地为客户基金会和 DevInfra 女性经理组织了多次女性聚会。我还会优先指导表现出色的女性。

通过上述努力，我已经为我所在的团队聘用了很多出色的女性。在客户基础部，我所在的组织中男女比例一直保持在 50%左右，最多时达到 25 人。在我目前的团队中，男女比例为 8/20。

希望这将改变整个行业！

本文文字及图片出自 12 Years at Meta

你也许感兴趣的：

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注