几年前,我在浏览互联网时偶然发现了一个新的电子商务网站,注意到网站上的图片加载速度不快。我刷新了页面并重试了几次。终于,十秒钟后,我能够看到带有图像的渲染网页。
最初,我以为我的互联网连接很差,但互联网下载速度足够好。我也可以观看高清的 Youtube 视频。这激发了我的好奇心,想知道为什么电子商务网站无法快速加载图片。
我内心好奇的工程师决定研究网站性能缓慢的原因。我迅速打开谷歌的开发者工具并导航到 Networking 选项卡进行分析。在浏览了几篇 Stack Overflow 帖子后,得出的结论是该站点没有使用内容分发网络(CDN)。
在本文中,我们将了解CDN是什么、为什么需要它以及它的工作原理。此外,我们还将了解网站如何通过利用 CDN 来加速其内容得交付。
在当今世界,网站的性能至关重要。如果您的网站在加载时出现停机或缓慢,就很难留住用户。
在详细了解什么是内容分发网络 (CDN) 之前,我们先回顾一下我们的基础知识。让我们了解一下网页是如何在我们的设备上显示的。
客户端向服务器请求网页
上图概述了客户端如何请求页面并最终将其显示给用户。
HTML 页面还可以包含图像、gif、视频等。因此,与文档一起,客户还有责任显示这些数据。
客户端还需要Javascript文件来使页面动态化。此外,它还需要 CSS 文件来设置网页样式。在Developer tools的Networking选项卡中,您会看到下图所示的选项。
如果您选择JS作为一个选项,您应该能够查看 Javascript 文件的所有请求和响应。这同样适用于其他类型,例如CSS, Img,Doc等。
我们可以将任何网页上的内容分为两种类型——静态数据和动态数据。
如果内容不经常变化,那么它就变成静态的。通常,图像、Javascript 和 CSS 文件不会经常更改。
此外,即使这些文件发生变化,我们也不会向用户显示不正确的数据。在任何文件增强的情况下,只有用户体验或网站的外观会发生变化。
在某些情况下,此类文件会保留在服务器的文件系统中。换句话说,Web 服务器将从硬盘中获取这些文件并将其发送回客户端。很多时候,这些文件都保存在 blob 存储中,例如 S3、Azure Blob 存储等。
静态数据的大小可以是 KB、MB 或 GB。比如电影文件很大并且占用大量带宽。
频繁变化的数据是动态的。例如:在 Youtube 上观看视频的观众人数。社交媒体网站上的评论、点赞或分享。
通常,服务器将动态数据存储在数据库中。根据用例,它可以是SQL或NoSQL。对于每个请求,服务器都会查询此数据,然后在响应中将其传回。在大多数情况下,JSON用于数据序列化。
Json数据是动态数据
与电影、视频或图像等静态数据相比,动态数据的大小很小。它的数量级为几 KB。服务器还可以将此数据存储在外部缓存中,例如 Redis 或 MemCached 以提高效率。
延迟是指网站完全呈现所有数据所花费的时间。如果延迟增加,用户必须等待更多时间。用户等待的时间越长,转化率就越低。
以较低延迟呈现页面的网站性能更高。这些网站会在几毫秒内将页面显示给用户。
延迟取决于多种因素。它包括以下内容:
如果网站的服务器崩溃,客户端将无法查看网页。服务器还应该能够处理不断增加的负载。
如果网站不可扩展,服务器处理时间会增加并增加延迟。在当今世界,停机时间是不能容忍的。
由于这些网站是全球性的,因此预计它们会247365运行。用户希望无缝地观看视频、在线购物、给朋友发消息等。
假设我们正在启动一个新的短视频应用程序,例如TikTok。我们构建网站的第一个版本并将其部署在美国洛杉矶。我们的网站在全球范围内均可访问,并且逐渐开始受到关注。
我们注意到我们正在接收来自欧洲、中东和印度的流量。随着流量的增长,我们横向扩展并添加更多服务器。然而,来自印度的用户抱怨他们的加载时间变长了。来自美国的用户不会面临同样的问题。为什么会这样?
客户端和服务器之间的距离
如上所示,我们的服务器部署在美国洛杉矶。对于印度用户,与美国用户相比,网络数据包必须传输更远的距离。随着距离的增加,所花费的时间也会成比例地增加。如果在美国获取数据所花费的时间是 5 毫秒,那么印度用户将花费 35 毫秒(距离是7 倍)。
这同样适用于欧洲的用户。欧盟的网站加载时间将超过美国的加载时间。这将接近3.5 倍。
此外,我们服务器上的视频文件不会经常更改。如果视频成为病毒式传播,则全球用户都可以访问同一个视频文件。如果视频文件的大小更大,问题会更加严重,因为网络带宽将成为瓶颈。
全球各地的客户访问服务器的文件
如果我们减少客户端和服务器之间的距离,上述问题就会得到解决。而且由于视频文件不经常变化,我们可以有一个缓存机制。
通过缓存,我们将从我们的服务器请求一次文件,后续请求将由缓存提供服务。这将减少服务器上的整体负载。
内容分发网络 (CDN) 应用此解决方案并加速网站的内容分发。我们的主要 Web 服务器也称为 Origin 服务器。CDN 由一组在地理上分布的服务器组成。这些服务器也称为存在点 (POP) 服务器。POP 服务器所在的位置称为边缘位置。
CDN 服务器位于南美和非洲。
POP 服务器为居住在同一地理位置的用户提供内容。例如: 欧洲的 POP 服务器将为欧洲用户提供数据服务。印度用户将由位于印度的 POP 服务器提供服务。
让我们以从银行提取现金为例。想象一下如果没有 ATM 机会怎样?如果没有 ATM 机,银行外就会排起长队。我们要花很长时间才能拿到钱。此外,在银行假期,人们将无法灵活地提取现金。
地铁站、餐厅、机场等不同地点的 ATM 机可确保银行不会排起长队。人们可以在方便的时候取钱。此外,人们可以去最近的 ATM,而不是去银行(距离可能更远)。
您可以将银行视为源服务器,将ATM视为CDN。CDN 位于用户位置附近。它们在地理上是分布式的,减少了源站服务器的负载。此外,它们还通过处理静态内容的流量来提高网站的可用性。
下图显示了在浏览器中加载网站时发生的工作原理。
从 CDN 服务器获取内容
客户端从 CDN 而不是源服务器获取静态数据(图像、视频等)。CDN 服务器在地理位置上靠近用户。随着距离的缩短,获取数据的时间也会缩短。这导致网站加载时间显着改善。
加载时间更快的网站可以改善用户体验。用户更倾向于高效和高性能的产品。例如:将 Google Chrome 与 Internet Explorer 进行比较。
CDN 服务器占用了大部分网站负载。由于 CDN 服务器的行为类似于缓存,因此可以保护源服务器免受流量高峰的影响。由于 Origin 服务器处理的负载较少,因此该服务器出现故障的可能性较小。
网站的整体可用性得到提高。如果出现区域流量高峰,各个区域的 CDN 服务器会扩展并处理不断增加的负载。
网站的主要开销是带宽消耗成本。当 CDN 处理流量时,源服务器提供的数据会大大减少。这有助于降低网站所有者的带宽成本。
内容分发网络CDN由一组服务器组成,这些服务器在地理位置上靠近用户,用于加速网站内容的交付。浏览器或移动应用程序从 CDN 而不是源服务器请求静态数据,CDN 从源服务器获取数据并缓存它。后续请求由 CDN 服务器提供。CDN 的主要好处是提高网站的性能、减少带宽消耗成本以及提高网站的可用性。