搜索
首页web前端js教程在 Fastly 上使用 AI 构建'为您”推荐!

忘掉炒作吧;人工智能在哪里创造真正的价值?让我们利用边缘计算来利用人工智能的力量,打造快速、安全、可靠的智能用户体验。

推荐无处不在,每个人都知道,使网络体验更加个性化可以使其更具吸引力和成功。 我的亚马逊主页知道我喜欢家居用品、厨具,现在还喜欢夏季服装:

Build

如今,大多数平台都让您在快速或个性化之间做出选择。在 Fastly,我们认为您和您的用户应该同时拥有两者。 如果您的网络服务器每次生成一个页面时,它只适合一个最终用户,您就无法从缓存中受益,而这正是像 Fastly 这样的边缘网络所擅长的。

那么如何从边缘缓存中受益,同时使内容个性化? 我们之前写过很多关于如何将复杂的客户端请求分解为多个较小的、可缓存的后端请求的文章,您可以在我们的开发人员中心的个性化主题中找到教程、代码示例和演示。

但是如果您想更进一步并在边缘生成个性化数据怎么办? “边缘”——处理您网站流量的 Fastly 服务器,是距离最终用户最近的点,且仍在您的控制范围内。一个制作特定于某个用户的内容的好地方。

“为你”用例

产品推荐本质上是短暂的,特定于单个用户,并且可能会经常变化。 但它们也不需要持续存在——我们通常不需要知道我们向每个人推荐了什么,只需要知道特定算法是否比其他算法实现了更好的转换。 一些推荐算法需要访问大量状态数据,例如哪些用户与您最相似以及他们的购买或评分历史记录,但通常这些数据很容易批量预生成。

基本上,生成推荐通常不会创建事务,不需要在数据存储中加任何锁,并且会利用当前用户会话中立即可用的输入数据或在离线构建过程中创建的输入数据。

听起来我们可以在边缘生成推荐!

一个现实世界的例子

我们来看看纽约大都会艺术博物馆的网站:

Build

大都会博物馆收藏的 500,000 件左右的藏品中,每一件都有一个包含图片和相关信息的页面。 它还具有相关对象的列表:

Build

这似乎使用了相当简单的分面系统来生成这些关系,向我展示同一艺术家的其他艺术品,或博物馆同一翼中的其他物体,或者也是由纸制成或源自同一翼的其他物体时间段。

这个系统的好处(从开发人员的角度来看!)是,由于它仅基于一个输入对象,因此可以预先生成到页面中。

如果我们想通过基于最终用户浏览大都会网站时的个人浏览历史记录(而不仅仅是基于这个对象)的一系列推荐来增强这一点,该怎么办?

添加个性化推荐

我们可以通过很多方法来做到这一点,但我想尝试使用语言模型,因为人工智能正在正在发生,而且它与大都会现有的相关艺术品机制似乎非常不同工作。 计划如下:

  1. 下载大都会博物馆的开放获取收藏数据集。
  2. 通过语言模型运行它以创建向量嵌入 - 适合机器学习任务的数字列表。
  3. 为生成的 50 万个向量(代表大都会艺术博物馆的艺术品)构建一个高性能相似性搜索引擎,并将其加载到 KV 存储中,以便我们可以从 Fastly Compute 中使用它。

完成所有这些后,当您浏览大都会博物馆的网站时,我们应该能够:

  1. 在 cookie 中跟踪您访问过的艺术品。
  2. 查找这些艺术品对应的向量。
  3. 计算代表您的浏览兴趣的平均向量。
  4. 将其插入我们的相似性搜索引擎以查找最相似的艺术品。
  5. 从 Met 的对象 API 加载有关这些艺术品的详细信息,并通过个性化推荐来增强页面。

瞧,个性化推荐:

Build

好的,让我们来分解一下。

创建数据集

Met 的原始数据集是一个包含很多列的 CSV,如下所示:

Object Number,Is Highlight,Is Timeline Work,Is Public Domain,Object ID,Gallery Number,Department,AccessionYear,Object Name,Title,Culture,Period,Dynasty,Reign,Portfolio,Constituent ID,Artist Role,Artist Prefix,Artist Display Name,Artist Display Bio,Artist Suffix,Artist Alpha Sort,Artist Nationality,Artist Begin Date,Artist End Date,Artist Gender,Artist ULAN URL,Artist Wikidata URL,Object Date,Object Begin Date,Object End Date,Medium,Dimensions,Credit Line,Geography Type,City,State,County,Country,Region,Subregion,Locale,Locus,Excavation,River,Classification,Rights and Reproduction,Link Resource,Object Wikidata URL,Metadata Date,Repository,Tags,Tags AAT URL,Tags Wikidata URL
1979.486.1,False,False,False,1,,The American Wing,1979,Coin,One-dollar Liberty Head Coin,,,,,,16429,Maker," ",James Barton Longacre,"American, Delaware County, Pennsylvania 1794–1869 Philadelphia, Pennsylvania"," ","Longacre, James Barton",American,1794      ,1869      ,,http://vocab.getty.edu/page/ulan/500011409,https://www.wikidata.org/wiki/Q3806459,1853,1853,1853,Gold,Dimensions unavailable,"Gift of Heinz L. Stoppelmann, 1979",,,,,,,,,,,,,,http://www.metmuseum.org/art/collection/search/1,,,"Metropolitan Museum of Art, New York, NY",,,
1980.264.5,False,False,False,2,,The American Wing,1980,Coin,Ten-dollar Liberty Head Coin,,,,,,107,Maker," ",Christian Gobrecht,1785–1844," ","Gobrecht, Christian",American,1785      ,1844      ,,http://vocab.getty.edu/page/ulan/500077295,https://www.wikidata.org/wiki/Q5109648,1901,1901,1901,Gold,Dimensions unavailable,"Gift of Heinz L. Stoppelmann, 1980",,,,,,,,,,,,,,http://www.metmuseum.org/art/collection/search/2,,,"Metropolitan Museum of Art, New York, NY",,,

很简单,可以将其转换为两列,一个 ID 和一个字符串:

id,description
1,"One-dollar Liberty Head Coin; Type: Coin; Artist: James Barton Longacre; Medium: Gold; Date: 1853; Credit: Gift of Heinz L. Stoppelmann, 1979"
2,"Ten-dollar Liberty Head Coin; Type: Coin; Artist: Christian Gobrecht; Medium: Gold; Date: 1901; Credit: Gift of Heinz L. Stoppelmann, 1980"
3,"Two-and-a-Half Dollar Coin; Type: Coin; Medium: Gold; Date: 1927; Credit: Gift of C. Ruxton Love Jr., 1967"

现在我们可以使用 Hugging Face AI 工具集中的 Transformer 包,并生成每个描述的嵌入。 我们使用sentence-transformers/all-MiniLM-L12-v2模型,并使用主成分分析(PCA)将结果向量减少到5维。 这会给你类似的东西:

[
  {
    "id": 1,
    "vector": [ -0.005544120445847511, -0.030924081802368164, 0.008597176522016525, 0.20186401903629303, 0.0578165128827095 ]
  },
  {
    "id": 2,
    "vector": [ -0.005544120445847511, -0.030924081802368164, 0.008597176522016525, 0.20186401903629303, 0.0578165128827095 ]
  },
  …
]

我们有 50 万个这样的数据集,因此不可能将整个数据集存储在边缘应用程序的内存中。 我们希望对这些数据进行自定义类型的相似性搜索,这是传统键值存储所不提供的。由于我们正在构建实时体验,因此我们也确实希望避免一次搜索 50 万个向量。

那么,让我们对数据进行分区。 我们可以使用 KMeans 聚类对彼此相似的向量进行分组。 我们将数据分成 500 个不同大小的簇,并为每个簇计算一个称为“质心向量”的中心点。 如果您以二维方式绘制此向量空间并放大,它可能看起来有点像这样:

Build

红十字是每个向量簇的数学中心点,称为质心。它们可以像我们 50 万向量空间的寻路器一样工作。例如,如果我们想找到与给定向量 A 最相似的 10 个向量,我们可以首先寻找最近的质心(500 个质心),然后仅在其相应的簇内进行搜索——这是一个更易于管理的区域!

现在我们有 500 个小数据集和一个将质心点映射到相关数据集的索引。 接下来,为了实现实时性能,我们想要预编译搜索图,这样我们就不需要在运行时初始化和构造它们,并且可以使用尽可能少的CPU时间。 一种非常快速的最近邻算法是分层可导航小世界(HNSW),它有一个纯 Rust 实现,我们用它来编写我们的边缘应用程序。 因此,我们编写了一个小型独立 Rust 应用程序来为每个数据集构建 HNSW 图结构,然后使用 bincode 将实例化结构的内存导出到二进制 blob。

现在,这些二进制 blob 可以加载到 KV 存储中,针对集群索引进行键控,并且集群索引可以包含在我们的边缘应用程序中。

这种架构允许我们按需将部分搜索索引加载到内存中。而且由于我们永远不需要一次搜索超过几千个向量,因此我们的搜索将始终廉价且快速。

构建边缘应用程序

我们在边缘运行的应用程序需要处理多种类型的请求:

  • HTML 页面: 我们从 metmuseum.org 获取这些页面并转换响应以添加额外的前端 <script>和<风格>标签,这样我们就可以注入一些我们自己的前端处理和内容</script>
  • 这些额外标签引用的 Fastly 脚本和样式资源,我们可以直接从边缘应用程序的二进制文件中提供这些资源。
  • 推荐端点,生成并返回推荐 ** 所有其他(非 HTML)请求: 图像以及大都会艺术博物馆自己的脚本和样式表,我们直接从其域代理,无需更改。

我们最初用 JavaScript 构建了这个应用程序,但最终将推荐部分移植到 Rust,因为我们喜欢即时距离的 HNSW 实现。

客户端 JavaScript 做了一些有趣的事情:

  1. 使用 IntersectionObserver,当用户将页面向下滚动到相关对象部分时,我们会触发一个事件。这是一个超级高效的 API,比使用 onscroll 等旧方法要好得多。
  2. 获取我们的特别推荐 API 端点(然后我们可以在边缘处理并返回对象信息)
  3. 使用客户端函数内置的模板编写一些 HTML
  4. 将该 HTML 附加到页面并将交叉观察器移动到新元素,以便当您滚动浏览建议时,我们会不断加载更多内容。

这样,我们可以在不调用我们的推荐算法的情况下提供主要的 HTML 有效负载,但推荐的提供速度足够快,我们可以在您滚动时加载它们,并且当您到达它们时它们几乎肯定会在那里。

我喜欢以这种方式做事,因为尽快向用户提供第一个首屏视图绝对是最重要的。 除非滚动才能看到的任何内容都可以稍后加载,特别是如果它是复杂的个性化内容 - 如果用户不打算滚动,则生成它是没有意义的。

结束语

因此,现在您拥有两全其美的优势:能够提供高度个性化的内容,几乎不需要对源进行任何阻塞提取,并且经过优化的 HTML 有效负载的渲染速度非常快,使您的应用程序能够有效地享受无限的可扩展性和近乎完美的性能。完美的恢复能力。

这不是一个完美的解决方案。 如果 Fastly 提供更多更高级别的功能来通过查询机制而不是简单的键查找来公开边缘数据(让我们知道这是否对您有帮助!),并且这种特定机制有明显的缺陷 - 如果我对以下方面有单独的兴趣两个或更多非常不同的东西(比如 19 世纪的油画和古罗马双耳瓶)我会得到建议,这将是这些之间的理论语义“中间点”,而不是一个非常有用的结果。

不过,希望这证明了一个原则,即弄清楚如何在边缘进行工作通常会在可扩展性、性能和弹性方面带来巨大的好处。

让我们知道您在community.fastly.com 上构建了什么!

以上是在 Fastly 上使用 AI 构建'为您”推荐!的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
在JavaScript中替换字符串字符在JavaScript中替换字符串字符Mar 11, 2025 am 12:07 AM

JavaScript字符串替换方法详解及常见问题解答 本文将探讨两种在JavaScript中替换字符串字符的方法:在JavaScript代码内部替换和在网页HTML内部替换。 在JavaScript代码内部替换字符串 最直接的方法是使用replace()方法: str = str.replace("find","replace"); 该方法仅替换第一个匹配项。要替换所有匹配项,需使用正则表达式并添加全局标志g: str = str.replace(/fi

自定义Google搜索API设置教程自定义Google搜索API设置教程Mar 04, 2025 am 01:06 AM

本教程向您展示了如何将自定义的Google搜索API集成到您的博客或网站中,提供了比标准WordPress主题搜索功能更精致的搜索体验。 令人惊讶的是简单!您将能够将搜索限制为Y

示例颜色json文件示例颜色json文件Mar 03, 2025 am 12:35 AM

本文系列在2017年中期进行了最新信息和新示例。 在此JSON示例中,我们将研究如何使用JSON格式将简单值存储在文件中。 使用键值对符号,我们可以存储任何类型的

构建您自己的Ajax Web应用程序构建您自己的Ajax Web应用程序Mar 09, 2025 am 12:11 AM

因此,在这里,您准备好了解所有称为Ajax的东西。但是,到底是什么? AJAX一词是指用于创建动态,交互式Web内容的一系列宽松的技术。 Ajax一词,最初由Jesse J创造

8令人惊叹的jQuery页面布局插件8令人惊叹的jQuery页面布局插件Mar 06, 2025 am 12:48 AM

利用轻松的网页布局:8个基本插件 jQuery大大简化了网页布局。 本文重点介绍了简化该过程的八个功能强大的JQuery插件,对于手动网站创建特别有用

什么是这个&#x27;在JavaScript?什么是这个&#x27;在JavaScript?Mar 04, 2025 am 01:15 AM

核心要点 JavaScript 中的 this 通常指代“拥有”该方法的对象,但具体取决于函数的调用方式。 没有当前对象时,this 指代全局对象。在 Web 浏览器中,它由 window 表示。 调用函数时,this 保持全局对象;但调用对象构造函数或其任何方法时,this 指代对象的实例。 可以使用 call()、apply() 和 bind() 等方法更改 this 的上下文。这些方法使用给定的 this 值和参数调用函数。 JavaScript 是一门优秀的编程语言。几年前,这句话可

通过来源查看器提高您的jQuery知识通过来源查看器提高您的jQuery知识Mar 05, 2025 am 12:54 AM

jQuery是一个很棒的JavaScript框架。但是,与任何图书馆一样,有时有必要在引擎盖下发现发生了什么。也许是因为您正在追踪一个错误,或者只是对jQuery如何实现特定UI感到好奇

10张移动秘籍用于移动开发10张移动秘籍用于移动开发Mar 05, 2025 am 12:43 AM

该帖子编写了有用的作弊表,参考指南,快速食谱以及用于Android,BlackBerry和iPhone应用程序开发的代码片段。 没有开发人员应该没有他们! 触摸手势参考指南(PDF) Desig的宝贵资源

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前By尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
1 个月前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
4 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

mPDF

mPDF

mPDF是一个PHP库,可以从UTF-8编码的HTML生成PDF文件。原作者Ian Back编写mPDF以从他的网站上“即时”输出PDF文件,并处理不同的语言。与原始脚本如HTML2FPDF相比,它的速度较慢,并且在使用Unicode字体时生成的文件较大,但支持CSS样式等,并进行了大量增强。支持几乎所有语言,包括RTL(阿拉伯语和希伯来语)和CJK(中日韩)。支持嵌套的块级元素(如P、DIV),

安全考试浏览器

安全考试浏览器

Safe Exam Browser是一个安全的浏览器环境,用于安全地进行在线考试。该软件将任何计算机变成一个安全的工作站。它控制对任何实用工具的访问,并防止学生使用未经授权的资源。

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版