优化网站的图像交付对于提升用户体验至关重要。由于图像通常占网站数据的最大部分，因此它们会显著影响页面加载时间、搜索引擎排名、分发成本和整体性能。本参考架构图将引导您了解一个简单、可扩展且高性能的解决方案。只需调整 URL 字符串以指定图像尺寸和质量，您就可以缓存并向请求该格式的任何用户交付优化后的图像。以下是该解决方案中涉及的 Cloudflare 组件：
- Cloudflare CDN ↗ - 利用 Cloudflare 的全球网络 ↗缓存转换后的图像，以便快速且可靠地交付给最终用户。
- Cloudflare Images ↗ - 利用 Cloudflare Images 调整、优化和转换存储在 Cloudflare R2 等对象存储解决方案中的图像。转换是基于特定格式的 URL 执行的，这需要对您的应用进行最少的重构即可支持。
- Cloudflare R2 Object Storage ↗ - R2 允许用户存储大量的非结构化数据，在此用例中，它将用于存储我们的原始图像（最佳质量）以进行转换。
- Cloudflare Transform Rules - 如果您正从其他解决方案迁移到 Cloudflare，Transform Rules 允许您将 URL 从其他解决方案的语法重写为 Cloudflare 特定的语法，从而降低迁移的复杂性。
- 用户请求：用户发送针对图像 (image.jpg) 的 HTTP 请求，直接在 URL 中以逗号分隔的选项列表形式指定宽度和质量等转换。
- 缓存命中（Cache Hit）：Cloudflare 在最靠近用户的入网点处理请求。它首先检查所请求的图像转换是否已存在于 Cloudflare 的缓存中。如果是，则立即将图像返回给用户，从而消除了进一步处理的需要。如果否，则请求进入下一步。
- Transform Rules（可选）：如果您正从其他图像解决方案进行迁移，可能需要通过重写来重写 URL 路径和查询字符串，以便避免应用层面的任何复杂重构来协助迁移。动态和静态重写均受支持，其中动态重写支持复杂表达式以支持多种 URL 重写。
- 缓存未命中 - R2：如果请求的图像在 Cloudflare 的缓存中不可用，则将请求发送到源站，在此场景中即 Cloudflare 的 R2 对象存储平台。R2 中仅存储原始图像，R2 存储桶中不存储任何调整大小后的变体，这使得在没有对象生命周期规则的情况下运行 R2 变得不那么繁重。
- 转换图像：基于在步骤 1 中发送或在步骤 3 中转换的 URL 语法，Cloudflare Images 转换图像并将其发送到缓存，然后再向终端用户返回请求的图像。
您可以通过使用特定格式的 URL 请求图像来轻松转换它们并调整其大小。本节将说明用于图像转换的 URL 结构，参考上图并详细介绍每个 URL 组件：
- 第 1 部分 - 您在 Cloudflare 上的特定域名，这是您接入到 Cloudflare 的区域（Zone），也是您的网站或图像提供服务的位置。例如 https://www.mywebsite.com/ ↗
- 第 2 部分 - 一个固定的前缀，用于标识这是由 Cloudflare 内置 Worker 处理的特殊路径。
- 第 3 部分 - 图像的逗号分隔选项列表，例如 width=80,quality=75
- 第 4 部分 - 源服务器（origin server）上的绝对路径。例如：/uploads/image.jpg
请求中使用的最终 URL 如下所示：
https://www.mywebsite.com/cdn-cgi/image/width=80,quality=75/uploads/image.jpg