theme: cyanosis

前言

几年前,我在浏览互联网时偶然发现了一个新的电子商务网站,注意到网站上的图片加载速度不快。我刷新了页面并重试了几次。终于,十秒钟后,我能够看到带有图像的渲染网页。

最初,我以为我的互联网连接很差,但互联网下载速度足够好。我也可以观看高清的 Youtube 视频。这激发了我的好奇心,想知道为什么电子商务网站无法快速加载图片。

我内心好奇的工程师决定研究网站性能缓慢的原因。我迅速打开谷歌的开发者工具并导航到 Networking 选项卡进行分析。在浏览了几篇 Stack Overflow 帖子后,得出的结论是该站点没有使用内容分发网络(CDN)。

在本文中,我们将了解CDN是什么、为什么需要它以及它的工作原理。此外,我们还将了解网站如何通过利用 CDN 来加速其内容得交付。

背景

在当今世界,网站的性能至关重要。如果您的网站在加载时出现停机或缓慢,就很难留住用户。

在详细了解什么是内容分发网络 (CDN) 之前,我们先回顾一下我们的基础知识。让我们了解一下网页是如何在我们的设备上显示的。

你知道CDN是干嘛的吗?-LMLPHP

客户端向服务器请求网页

上图概述了客户端如何请求页面并最终将其显示给用户。

  1. 客户端(移动应用程序/浏览器)向Web 服务器发送HTTP请求。
  2. 服务器处理请求,执行检查和验证,从数据库、硬盘或 blob 存储中获取数据返回响应。
  3. 客户端读取响应。响应通常是返回给客户端的HTML页面。
  4. 最后,将HTML页面显示给用户。

HTML 页面还可以包含图像、gif、视频等。因此,与文档一起,客户还有责任显示这些数据。

客户端还需要 Javascript 文件来使页面动态化。此外,它还需要 CSS 文件来设置网页样式。在 Developer tools Networking 选项卡中,您会看到下图所示的选项。

你知道CDN是干嘛的吗?-LMLPHP

如果您选择JS作为一个选项,您应该能够查看 Javascript 文件的所有请求和响应。这同样适用于其他类型,例如CSS, Img,Doc等。

我们可以将任何网页上的内容分为两种类型——静态数据和动态数据。

静态数据

如果内容不经常变化,那么它就变成静态的。通常,图像、Javascript 和 CSS 文件不会经常更改。

此外,即使这些文件发生变化,我们也不会向用户显示不正确的数据。在任何文件增强的情况下,只有用户体验或网站的外观会发生变化。

在某些情况下,此类文件会保留在服务器的文件系统中。换句话说,Web 服务器将从硬盘中获取这些文件并将其发送回客户端。很多时候,这些文件都保存在 blob 存储中,例如 S3、Azure Blob 存储等。

静态数据的大小可以是 KB、MB 或 GB。比如电影文件很大并且占用大量带宽。

动态数据

频繁变化的数据是动态的。例如:在 Youtube 上观看视频的观众人数。社交媒体网站上的评论、点赞或分享。

通常,服务器将动态数据存储在数据库中。根据用例,它可以是SQL或NoSQL。对于每个请求,服务器都会查询此数据,然后在响应中将其传回。在大多数情况下,JSON用于数据序列化。

你知道CDN是干嘛的吗?-LMLPHP

Json数据是动态数据

与电影、视频或图像等静态数据相比,动态数据的大小很小。它的数量级为几 KB。服务器还可以将此数据存储在外部缓存中,例如 Redis 或 MemCached 以提高效率。

什么影响网站的性能?

延迟

延迟是指网站完全呈现所有数据所花费的时间。如果延迟增加,用户必须等待更多时间。用户等待的时间越长,转化率就越低。

以较低延迟呈现页面的网站性能更高。这些网站会在几毫秒内将页面显示给用户。

延迟取决于多种因素。它包括以下内容:

  • 用户和服务器之间的距离
  • 服务器处理时间
  • 从数据库中检索数据所花费的时间

可用性

如果网站的服务器崩溃,客户端将无法查看网页。服务器还应该能够处理不断增加的负载。

如果网站不可扩展,服务器处理时间会增加并增加延迟。在当今世界,停机时间是不能容忍的。

由于这些网站是全球性的,因此预计它们会247365运行。用户希望无缝地观看视频、在线购物、给朋友发消息等。

什么是内容分发网络?

问题

假设我们正在启动一个新的短视频应用程序,例如TikTok。我们构建网站的第一个版本并将其部署在美国洛杉矶。我们的网站在全球范围内均可访问,并且逐渐开始受到关注。

我们注意到我们正在接收来自欧洲、中东和印度的流量。随着流量的增长,我们横向扩展并添加更多服务器。然而,来自印度的用户抱怨他们的加载时间变长了。来自美国的用户不会面临同样的问题。为什么会这样?

你知道CDN是干嘛的吗?-LMLPHP

客户端和服务器之间的距离

如上所示,我们的服务器部署在美国洛杉矶。对于印度用户,与美国用户相比,网络数据包必须传输更远的距离。随着距离的增加,所花费的时间也会成比例地增加。如果在美国获取数据所花费的时间是 5 毫秒,那么印度用户将花费 35 毫秒(距离是7 倍)。

这同样适用于欧洲的用户。欧盟的网站加载时间将超过美国的加载时间。这将接近3.5 倍

此外,我们服务器上的视频文件不会经常更改。如果视频成为病毒式传播,则全球用户都可以访问同一个视频文件。如果视频文件的大小更大,问题会更加严重,因为网络带宽将成为瓶颈。

你知道CDN是干嘛的吗?-LMLPHP

全球各地的客户访问服务器的文件

解决方案

如果我们减少客户端和服务器之间的距离,上述问题就会得到解决。而且由于视频文件不经常变化,我们可以有一个缓存机制。

通过缓存,我们将从我们的服务器请求一次文件,后续请求将由缓存提供服务。这将减少服务器上的整体负载。

内容分发网络 (CDN) 应用此解决方案并加速网站的内容分发。我们的主要 Web 服务器也称为 Origin 服务器。CDN 由一组在地理上分布的服务器组成。这些服务器也称为存在点 (POP) 服务器。POP 服务器所在的位置称为边缘位置。

你知道CDN是干嘛的吗?-LMLPHP

CDN 服务器位于南美和非洲。

POP 服务器为居住在同一地理位置的用户提供内容。例如: 欧洲的 POP 服务器将为欧洲用户提供数据服务。印度用户将由位于印度的 POP 服务器提供服务。

比喻

让我们以从银行提取现金为例。想象一下如果没有 ATM 机会怎样?如果没有 ATM 机,银行外就会排起长队。我们要花很长时间才能拿到钱。此外,在银行假期,人们将无法灵活地提取现金。

地铁站、餐厅、机场等不同地点的 ATM 机可确保银行不会排起长队。人们可以在方便的时候取钱。此外,人们可以去最近的 ATM,而不是去银行(距离可能更远)。

您可以将银行视为源服务器,将ATM视为CDN。CDN 位于用户位置附近。它们在地理上是分布式的,减少了源站服务器的负载。此外,它们还通过处理静态内容的流量来提高网站的可用性。

CDN 的工作机制

下图显示了在浏览器中加载网站时发生的工作原理。

你知道CDN是干嘛的吗?-LMLPHP

从 CDN 服务器获取内容

  1. 浏览器向 DNS 发送 IP 地址查找请求。

  2. DNS 服务器将使用最近的 CDN 服务器的地址进行响应。

  3. 浏览器将向 CDN 服务器 (POP) 发送请求以获取数据。

  4. CDN 服务器将检查其缓存中是否存在数据(图像、js、css、视频等)。

  5. 如果数据不存在,POP 服务器将向源服务器发送请求以获取内容。

  6. 稍后,POP 服务器将存储内容并将数据发送回用户。

  7. CDN 用户还可以对内容设置 TTL(Time to Live)。例如:- 图像文件的 TTL 为 15 分钟。CDN 服务器将向用户发送相同的数据,直到它过期。

  8. 一旦 CDN 服务器检测到内容过时,它就会从源服务器重新获取它。

使用 CDN 的好处

网站性能

客户端从 CDN 而不是源服务器获取静态数据(图像、视频等)。CDN 服务器在地理位置上靠近用户。随着距离的缩短,获取数据的时间也会缩短。这导致网站加载时间显着改善。

加载时间更快的网站可以改善用户体验。用户更倾向于高效和高性能的产品。例如:将 Google Chrome 与 Internet Explorer 进行比较。

可用性

CDN 服务器占用了大部分网站负载。由于 CDN 服务器的行为类似于缓存,因此可以保护源服务器免受流量高峰的影响。由于 Origin 服务器处理的负载较少,因此该服务器出现故障的可能性较小。

网站的整体可用性得到提高。如果出现区域流量高峰,各个区域的 CDN 服务器会扩展并处理不断增加的负载。

带宽

网站的主要开销是带宽消耗成本。当 CDN 处理流量时,源服务器提供的数据会大大减少。这有助于降低网站所有者的带宽成本。

总结

内容分发网络CDN由一组服务器组成,这些服务器在地理位置上靠近用户,用于加速网站内容的交付。浏览器或移动应用程序从 CDN 而不是源服务器请求静态数据,CDN 从源服务器获取数据并缓存它。后续请求由 CDN 服务器提供。CDN 的主要好处是提高网站的性能、减少带宽消耗成本以及提高网站的可用性。

02-06 13:55