theme: cyanosis

前言

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

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

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

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

背景

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

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

客户端向服务器请求网页

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

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

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 服务器获取内容

  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 的主要好处是提高网站的性能、减少带宽消耗成本以及提高网站的可用性。

翻译:https://animeshgaitonde.medium.com/content-delivery-network-cnd-explained-in-simple-words-674e971b06c3

欢迎关注个人公众号【JAVA旭阳】交流学习

你知道CDN是干嘛的吗?的更多相关文章

  1. 《CDN技术详解》 - CDN知多少?

    开发时间久了,就会接触到性能和并发方面的问题,如果说,在自己还是菜鸟的时候完全不用理会这种问题或者说有其他的高手去处理这类问题,那么,随着经验的丰富起来,自己必须要独立去处理了.或者,知道思路也行,毕 ...

  2. AWS CloudFront CDN直接全站加速折腾记The request could not be satisfied. Bad request

    ERROR The request could not be satisfied. Bad request. Generated by cloudfront (CloudFront) Request ...

  3. 【原】http缓存与cdn相关技术

    摘要:最近要做这个主题的组内分享,所以准备了一个星期,查了比较多的资料.准备的过程虽然很烦很耗时间,不过因为需要查很多的资料,因此整个过程下来,对这方面的知识影响更加深刻.来来来,接下来总结总结 一 ...

  4. CDN(内容分发网络)技术原理

    1. 前言 Internet的高速发展,给人们的工作和生活带来了极大的便利,对Internet的服务品质和访问速度要求越来越高,虽然带宽不断增加, 用户数量也在不断增加,受Web服务器的负荷和传输距离 ...

  5. CDN 内容分发网络技术

    1.前言 Internet的高速发展,给人们的工作和生活带来了极大的便利,对Internet的服务品质和访问速度要求越来越高,虽然带宽不断增加,用户数量也在不断增加,受Web服务器的负荷和传输距离等因 ...

  6. 深度剖析:CDN内容分发网络技术原理--转载

    1.前言 Internet的高速发展,给人们的工作和生活带来了极大的便利,对Internet的服务品质和访问速度要求越来越高,虽然带宽不断增加,用户数量也在不断增加,受Web服务器的负荷和传输距离等因 ...

  7. cdn与http缓存

    http缓存与cdn相关技术   摘要:最近要做这个主题的组内分享,所以准备了一个星期,查了比较多的资料.准备的过程虽然很烦很耗时间,不过因为需要查很多的资料,因此整个过程下来,对这方面的知识影响更加 ...

  8. http缓存与cdn相关技术

    阅读目录 一 http缓存 二.Http缓存概念解析 三.cdn相关技术 摘要:最近要做这个主题的组内分享,所以准备了一个星期,查了比较多的资料.准备的过程虽然很烦很耗时间,不过因为需要查很多的资料, ...

  9. cdn是什么

    CDN的全称是Content Delivery Network,即内容分发网络.其目的是通过在现有的Internet中增加一层新的网络架构, 将网站的内容发布到最接近用户的网络”边缘”,使用户可以就近 ...

  10. CDN概念+作用+特点+原理

    CDN的全称是Content Delivery Network,即内容分发网络.其目的是通过在现有的Internet中增加一层新的网络架构,将网站的内容发布到最接近用户的网络"边缘" ...

随机推荐

  1. Python基础部分:1、typora软件和对计算机的认识

    目录 一.typora软件 1.安装 2.markdown语法 二.计算机的本质 1.进制数 三.计算机五大组成部分概要 1.控制器 2.运算器 3.存储器 4.输入设备 5.输出设备 一.typor ...

  2. springcloud组件梳理之Feign

    最近刚好打算做一个springcloud系列的分享,趁此机会刚好梳理下springcloud常用组件的使用,今天先对feign做个简单介绍! feign是一个声明式的Web服务客户端,它使得发送web ...

  3. @Retryable注解的使用

    @Retryable 前言 在实际工作中,重处理是一个非常常见的场景,比如: 发送消息失败. 调用远程服务失败. 争抢锁失败. 这些错误可能是因为网络波动造成的,等待过后重处理就能成功.通常来说,会用 ...

  4. 2022春每日一题:Day 16

    题目:不同子串个数 这题需要利用后缀数组求出的height的性质,我们发现对于每个后缀,他的height后的所有子串就是算在答案里,因此答案只需要求出n-height[i]-sa[i]+1的和就可以了 ...

  5. 方法的重载(Overload)+ println重载

    方法的重载(Overload) package cn.day01; /*方法的重载(Overload):多个方法的名称一样,但是参数列表不一样. * 好处:只需要记住唯一一个方法名称,就可以实现类似多 ...

  6. vs2019中使用Git,新建项目时总提示部分项目位于解决方案文件夹外

    最终还是用Git工具传上去的. 小伙子,用Git Bush或者Git CMD 和Git GUI传吧 我是用Git GUI. Git GUI汉化.感谢大佬 https://blog.csdn.net/u ...

  7. i春秋Not Found

    点开网页,显示404,告诉我们404.php的存在,我们先试试404.php,打开是haha四个字母,源码和抓包都没看到什么,然后其抓包,也没什么,无功,返回原网页,抓包,没发现什么的感觉,go一遍, ...

  8. C温故补缺(八):结构体与共用体

    结构体与共用体 结构体 是一个可以存储多个不同类型的变量的结构,类似于面对对象中的类(只有成员变量的类). struct tag { member-list member-list member-li ...

  9. Base64 学习

    base64是什么 Base64,就是包括小写字母a-z,大写字母A-Z,数字0-9,符号"+" "/ "一共64个字符的字符集,(另加一个"=&qu ...

  10. springboot接收前端传参的几种方式

    1.通过HttpServletRequest接收,常用于获取请求头参数以及Cookie,适用于GET 和 POST请求方式,以下两种方式: @GetMapping("/demo1" ...