从 PC 互联网到移动互联网,越来越多的人在互联网上追剧,看资讯,刷视频,玩游戏等等,与之对应的就是各类互联网应用的用户体验要求越来越高。

其中典型的一个例子就是互联网的 “8秒原则”,即用户在访问页面或者网站时,如果响应时间超过8秒就会感到不耐烦,大部分用户就会选择放弃继续使用这个页面或者网站。而到了现在,如果响应时间超过 3 秒,就很让人抓狂了。

那么有什么技术可以快速缩短页面的加载时间,提高用户访问速度的呢,这里就不得不提到 CDN 缓存技术了,接下来就让我们一起了解和学习一下 CDN,看它是如何帮助快速我们提升页面性能的。

1. 什么是 CDN

CDN 的全称为 Content Delivery Network (内容分发网络),是一种构建在现有网络上的虚拟网络,依靠部署在各地的缓存服务器,通过内容存储和分发技术,使用户就近获取所需内容,从而降低网络拥塞,提高用户访问响应速度和命中率。通俗地说,就是在用户访问网站或者页面时,将用户的访问指向给离用户最近的缓存服务器,由该缓存服务器响应用户请求。比如让北京用户直接访问北京所在的 CDN 节点的资源,让上海用户直接访问上海所在 CDN 节点的资源,避免出现跨地区访问,导致用户访问存在延时。

虽然 CDN 能加速用户访问速度,但仍需要注意的是,CDN 服务器并不能缓存所有数据,它只能缓存静态资源,比如网页的图片,HTML/CSS/JS 文件,视频,文档文件等;对于程序渲染的动态页面或者动态数据请求,CDN 服务器无法进行缓存。

2. CDN 如何工作

介绍完什么是 CDN 之后,再来看下 CDN  具体的工作过程,以此加深对 CDN 的理解。还是从一个具体的例子出发,某个北京用户要访问淘宝上某个浙江店铺的商品内容。

  1. 用户访问商品图片,客户端首先根据 URL 地址到 Local DNS (域名解析服务)获取域名所对应的 IP。

  2. Local DNS 会将域名的解析权交给 CDN 专用的 DNS 服务器。

  3. CDN 专用 DNS 服务器会将 CDN 的 GSLB(全局负载均衡)设备 IP 地址返回给用户。

  4. 用户向 CDN 的全局负载均衡设备发起图片 URL 请求。

  5. CDN 负载均衡设备会根据用户 IP 地址和请求 URL,将一台离用户区域最近的缓存服务器 IP 返回给用户

  6. 用户向对应 IP 的缓存服务器发起请求,如果缓存服务器上没有用户想要访问的图片,那么缓存服务器就会向源服务器请求图片内容。缓存服务器得到响应内容后,会先把来自源服务器的内容缓存下来,再返回给用户客户端。

在请求过程中,如果缓存服务器没有用户想要的内容,需要由缓存服务器向源服务器拉取内容的操作叫做回源。当回源请求过多时,就会让源服务器承载过多的访问压力,可能影响服务的正常访问。因此有了回源率这个概念用来表示 CDN 缓存的利用程度,当回源率越低时,意味着 CDN 缓存命中率越高,说明缓存的效果明显,反之就越差。因此,降低回源率成了 CDN 缓存策略的首要目标。

这里就提到了 CDN 节点的缓存策略,虽然不同的 CDN 服务商有不同的缓存策略,但他们都会遵循 HTTP 标准协议,例如根据 HTTP 响应头的 Cache-Control:max-age 字段设置 CDN 节点数据缓存时间;用 Expires 字段设置缓存数据的过期时间等。CDN 缓存时间会对回源率有很大的影响,如果缓存时间过短,节点数据经常失效,导致频繁回源,增加了源服务器的负载,因此在数据缓存时间的控制上,我们要额外注意,要进行合理地设置。

3. CDN 的优势与不足

前面已经提到过 CDN 好处,加速用户对静态资源的访问 - 缩短用户与内容之间的物理距离,从而缩短用户的等待时间。对于访问量很大,有大量静态资源的网站来说,采用 CDN 不但加速用户访问的同时降低源服务器的压力,还为自己降低不少带宽成本、存储成本,可谓是一举多得。

并且,CDN 也能加速跨运营商之间的内容访问,比如想要让中国移动手机用户给访问电信网络的内容加速,可以通过在中国移动处架设 CDN 服务器方式实现。

CDN 除了优点,并不是没有缺点。CDN 最大的问题就是缓存数据的一致性问题,如何保证 CDN 缓存的数据与源服务器的数据实时同步,当源服务器上资源内容发生变化时,能马上同步到 CDN 缓存服务器上,这个至关重要。

当然也有对应的解决办法,CDN 服务厂商都会提供 CDN 缓存刷新功能,通过强制让 CDN 节点的数据缓存过期的方式,让客户端访问时拉取到最新的源服务器数据,实现效果就类似于在浏览器上使用 Ctrl+F5 强制刷新让浏览器本地缓存失效,但是这样一来会导致所有缓存数据失效,需要重新加载。这样操作的代价比较大,如果本身缓存数据量小,或者变化数据多的可以采用这种方式。还有另外一种有效的方式就是,给变化后的资源数据进行重新命名,比如加上版本号,XXX_v2.js 等,让资源文件名始终唯一,这样在访问新资源文件时,始终会先从源服务器上拉取,而不会访问旧资源文件了。

CDN 不足的一点还有安全性问题。由于大部分 CDN 对外都是提供公开的资源访问,如果要对资源的访问权限进行精细化控制的话,就很难使用 CDN。另外,对于私密性要求极高,图片,视频等内容仅个别人查看的场景,并没用使用 CDN 的必要,否则不仅浪费了 CDN 资源,而且回源造成的延迟开销还可能会降低用户体验。

4. 如何使用 CDN

CDN 技术可谓是优势明显,使用起来也十分简单快速。现在 CDN 服务已经算是常见的公有云服务,不同的云厂商都有自己的 CDN 服务,比如阿里云 CDN,腾讯云 CDN,七牛云 CDN 等。中小公司完全可以依据技术产品所在的云平台去选择对应平台下的 CDN 服务,比如用阿里云 ESC 服务器,可以选择使用阿里云 CDN 服务来缓存静态资源,这样不但减少了不同云厂商之间沟通成本,也保证一致的质量保障和技术体验。

5. 总结

希望在介绍和学习 CDN 技术之后,让你对 CDN 技术的认识有所帮助。CDN 核心要点就是实现用户对静态资源的就近访问,我们可以结合产品场景来决定是否使用 CDN 技术,如果要决定采用 CDN 技术,建议使用云厂商成熟的 CDN 服务,这样既能快速应用,还是节省搭建维护的成本,另外对于常更新的静态资源,最好还是加上版本号,防止数据不一致问题出现。

往期推荐

基于 Spring Cloud 开发的分布式系统,遇到爬虫、接口盗刷怎么办?

Java反射是什么?看这篇绝对会了!

四种常见的系统架构,目前你处于哪个阶段呢?

Spring Boot“内存泄漏”?看看美团大牛是如何排查的

提升系统 10 倍性能的 10 个建议!

快速提升页面性能的必备利器相关推荐

  1. 优化Hexo性能,使用hexo-neat插件压缩页面,大幅度提升页面性能和响应速度

    写在前面的话 如果你还没有搭建Hexo博客成功的话,可以看看我写的这篇博客<手把手教你使用GitHub + Hexo搭建属于自己的个人博客>. 如果你搭建成功的话,可以看看关于这两篇博客& ...

  2. 快速提升爬虫性能的几种方法

    爬虫性能相关 一.背景知识 爬虫的本质就是一个socket客户端与服务端的通信过程,如果我们有多个url待爬取,只用一个线程且采用串行的方式执行, 那只能等待爬取一个结束后才能继续下一个,效率会非常低 ...

  3. web前端页面性能优化(提升页面加载速度)

    我们都知道,对于web应用来说性能很重要,然而性能的优化相关知识非常庞大而复杂,对于性能优化我们需要做些什么,或者瓶颈是什么通常是我们不太了解的.(当然技术大牛除外) 通过查阅相关资料,了解到了一些关 ...

  4. Web前端教程分享:页面性能优化办法有哪些?

    引子 互联网有一项著名的8秒原则.用户在访问Web网页时,如果时间超过8秒就会感到不耐烦,如果加载需要太长时间,他们就会放弃访问.大部分用户希望网页能在2秒之内就完成加载.事实上,加载时间每多1秒,你 ...

  5. 提升页面加载速度的方案

    性能优化是一个庞大而相对复杂的知识,如今互联网发展迅速,市场竞争激烈,在这样的环境下一个网站的性能决定着一个项目的好与坏.为了降低软件项目的跳出率.提高访问速度.减少加载时间.带给用户流畅的终端体验, ...

  6. 页面性能优化办法有哪些? 1

    引子 互联网有一项著名的8秒原则.用户在访问Web网页时,如果时间超过8秒就会感到不耐烦,如果加载需要太长时间,他们就会放弃访问.大部分用户希望网页能在2秒之内就完成加载.事实上,加载时间每多1秒,你 ...

  7. 页面性能优化的五种办法

    前言 大部分用户希望网页能在 2 秒之内就完成加载.事实上,加载时间每多 1 秒,你就会流失 7% 的用户.如果加载需要太长时间,他们就会放弃访问. 以下是我总结性能优化常见的办法: 一.资源压缩与合 ...

  8. [WebKit]浏览器的加载与页面性能优化

    非常棒.非常系统的一份资料,值得阅读! 原文来自百度泛用户体验. 作者:nwind 本文将探讨浏览器渲染的loading过程,主要有2个目的: 了解浏览器在loading过程中的实现细节,具体都做了什 ...

  9. 互联网寒冬:一个月经历的所有面试题经验分享-------如何提高页面性能?

    前言   uu们,大家好,我是你们的前端小伙伴栗子,2年web前端开发经验.base成都.最近经过一系列的紧密结合的面试,成功的拿到了自己比较向往的offer.同时在面试的时候,也不断的总结了我在面试 ...

最新文章

  1. css对称旋转,CSS3 transform平面旋转
  2. python游戏最简单代码-如何利用Python开发一个简单的猜数字游戏
  3. sublime text常用快捷键
  4. SQL Server T-SQL高级查询
  5. Java最佳实践– Vector vs ArrayList vs HashSet
  6. unity editor里的undo操作
  7. vue组件弹出框点击显示隐藏
  8. unity3d烘焙教程 持续更新中【2020】
  9. 信息流项目计划和思路
  10. java-for循环9的倍数(基础)
  11. Beaglebone Black–I2C 接 BMP280 获取当前温度
  12. AQS: CLH 介绍
  13. 二维码生成器怎么在线制作?制作二维码其实很简单
  14. 疾病研究:DMD患者家庭理疗练习指南
  15. 大厂机密,30 提升团队研发效能的锦囊
  16. Android 之路35---Fragment
  17. java hashmap 去重_HashMap去重 - osc_sj1kgo4z的个人空间 - OSCHINA - 中文开源技术交流社区...
  18. 博途中WinCC VBS 脚本的基础用法
  19. Cadence Allegro 如何隐藏和显示铜皮
  20. jqGrid表格 样式设置

热门文章

  1. python 异或加密字符串
  2. java javac javap 命令使用简介
  3. NTP时间服务器简介
  4. IIS7中的站点、应用程序和虚拟目录详细介绍
  5. old DIB in res\*.ico
  6. VC中CListCtrl中的LVCOLUMN和LVITEM详细介绍
  7. 简单分析一下socket中的bind
  8. Linux C编程中的段错误
  9. 爬虫找工作要掌握什么_数据分析师要掌握SQL到什么程度?
  10. C++ string中find ,rfind 等函数 用法总结及示例