一、概述

1.1 Web前端优化

  1. 网站动静分离动静分离动态的资源和静态资源分别部署到不同的服务器上,使用Nginx实现静态服务器,因为nginx实现静态服务器访问速度的效果比tomcat实现静态服务器访问效果好很多。
  2. 要使用浏览器缓存,客户端(浏览器)内置缓存技术,只要访问一次静态资源请求,都会缓存到本地客户端,304状态码表示客户端缓存一般服务器上线的时候一定要在静态js、css资源后面加上时间戳,目的是为了防止发布版本与资源有冲突。
  3. 页面减少Http请求合并CSS或者JS资源,JS或者CSS一定使用压缩技术。 压缩文件变为.min
  4. 使用CDN内容分发,缓存静态资源(JS、 图片、CS),让用户从最近的服务器访问,减少客户端与服务器端宽带传输速度。使用CDN可以配置压缩。nginx也可以配置。
  5. 前后分离技术。异步化、ajax、 vue

1.2 DNS域名解析过程

  • DNS即Domain Name System,是域名解析服务的意思。它在互联网的作用是:把域名转换成为网络可以识别的ip地址。人们习惯记忆域名,但机器间互相只认IP地址,域名与IP地址之间是一一对应的,它们之间的转换工作称为域名解析,域名解析需要由专门的域名解析服务器来完成,整个过程是自动进行的。比如:上网时输入的www.baidu.com会自动转换成为220.181.112.143。
  • 常见的DNS解析服务商有:阿里云解析,万网解析,DNSPod,新网解析Route53(AWS),Dyn,Cloudflare等。

1.3 传统方式请求静态资源

  • 传统方式架构弊端:
  • 1.带宽传输压力大
  • 2.因为所有用户全部聚集到同一个地区服务器上访问,无法保证整体的系统高可用
  • 3.因为如果客户端与服务器端传输距离越远,那么宽带传输非常耗资源,导致用户体验非常差,响应慢。

二、CDN内容分发

2.1 什么是CDN

  • CDN加速意思就是在用户和我们的服务器之间加一个缓存机制,动态获取IP地址根据地理位置,让用户到最近的服务器访问。
  • CDN的全称是Content Delivery Network,即内容分发网络。
  • CDN是一组分布在多个不同地理位置的Web服务器,用于更加有效地向用户发布内容,在优化性能时,会根据距离的远近来选择。
  • CDN系统能实时地根据网络流量和各节点的连接,负载状况及用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上,其目的是使用户能就近地获取请求数据,解决网络拥塞,提高访问速度,解决由于网络带宽小、用户访问量大、网点分布不均等原因导致的访问速度慢的问题。
  • 由于CDN部署在网络运营商的机房,这些运营商又是终端用户网络的提供商,因此用户请求的第一跳就到达CDN服务器,当CDN服务器中缓存有用户请求的数据时,就可以从CDN直接返回给浏览器,因此可以提高访问速度。
  • CDN能够缓存JavaScript脚本、CSS样式表、图片、图标、Flash等静态资源文件(不包括html页面),这些静态资源文文件的访问频率很高,将其缓存在CDN可以极大地提高网站的访问速度,但由于CDN是部署在网络运营商的机房,所以在一般的网站中都很少用CDN加速。

2.2 CDN内容分发原理

  • 1) 用户向浏览器提供要访问的域名;
  • 2) 浏览器调用域名解析库对域名进行解析,由于CDN对域名解析过程进行了调整,所以解析函数库一般得到的是该域名对应的CNAME记录,为了得到实际IP地址,浏览器需要再次对获得的CNAME域名进行解析以得到实际的IP地址;在此过程中,使用的全局负载均衡DNS解析,如根据地理位置信息解析对应的IP地址,使得用户能就近访问;
  • 3) 此次解析得到CDN缓存服务器的IP地址,浏览器在得到实际的IP地址以后,向缓存服务器发出访问请求;
  • 4) 缓存服务器根据浏览器提供的要访问的域名,通过Cache内部专用DNS解析得到此域名的实际IP地址,再由缓存服务器向此实际IP地址提交访问请求;
  • 5) 缓存服务器从实际IP地址得得到内容以后,一方面在本地进行保存,以备以后使用,二方面把获取的数据返回给客户端,完成数据服务过程;
  • 6) 客户端得到由缓存服务器返回的数据以后显示出来并完成整个浏览的数据请求过程。

2.3 阿里云环境实战搭建CDN内容分发

  • 名词解释
  • CNAME记录(CNAME Record)
  • CNAME即别名( Canonical Name );可以用来把一个域名解析到另一个域名。当 DNS 系统在查询 CNAME 左面的名称的时候,都会转向 CNAME 右面的名称再进行查询,一直追踪到最后的 PTR 或 A 名称,成功查询后才会做出回应,否则失败。例如,你有一台服务器上存放了很多资料,你使用docs.example.com去访问这些资源,但又希望通过documents.example.com也能访问到这些资源,那么你就可以在您的DNS解析服务商添加一条CNAME记录,将documents.example.com指向docs.example.com,添加该条CNAME记录后,所有访问documents.example.com的请求都会被转到docs.example.com,获得相同的内容。

  • CNAME域名

  • 接入CDN时,在阿里云控制台添加完加速域名后,您会得到一个阿里云CDN给您分配的CNAME域名,(该CNAME域名一定是.kunlun.com), 您需要在您的DNS解析服务商添加CNAME记录,将自己的加速域名指向这个.kunlun.com的CNAME域名,这样该域名所有的请求才会都将转向阿里云CDN的节点,达到加速效果。

  • 详细参考地址:阿里云CDN文档

【Distributed】CDN的更多相关文章

  1. 【Distributed】分布式解决方案【汇总】

    一.问题引出 二.分布式Session问题 三.网站跨域问题 四.分布式任务调度平台 五.分布式配置中心 六.分布式锁解决方案 七.缓存技术 一.问题引出 [Distributed]分布式系统中遇到的 ...

  2. 【Distributed】缓存技术

    一.缓存概述 1.1 缓存技术分类 1.2 缓存框架分类 1.3 Session理解的误区 二.基于Map集合实现本地缓存 2.1 定义Map缓存工具类 2.2 使用案例 三.Ehcache 缓存框架 ...

  3. 【Web】CDN加速效果浅析

    1. 什么是CDN? CDN的全称是Content Delivery Network,即内容分发网络.其目的是通过在现有的Internet中增加一层新的CACHE(缓存)层,将网站的内容发布到最接近用 ...

  4. 【基础知识】【1】CDN

    正文: CDN:Content Delivery Network,内容分发网络.使用户访问离ta最近的资源服务器,优化访问速度 优点: 1,内容可以共享,不同站点的同一文件可以不用多次缓存 2,增加下 ...

  5. 【Distributed】大型网站高并发和高可用

    一.DNS域名解析 二.大型网站系统应有的特点 三.网站架构演变过程 3.1 传统架构 3.2 分布式架构 3.3 SOA架构 3.4 微服务架构 四.高并发设计原则 4.1 拆分系统 4.2 服务化 ...

  6. 【vue】——CDN或全局引入CSS、JS。

    在入口文件index.html中添加 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  7. 【Distributed】分布式锁

    一.概述 1.1 分布式解决的核心思路 1.2 分布式锁一般有三种实现方式 二.基于Redis的分布式锁 2.1 使用常用命令 2.2 实现思路 2.3 核心代码 Maven依赖信息 LockRedi ...

  8. 【Distributed】分布式配置中心

    一.概述 1.1 什么是分布式配置中心 常用分布式配置中心框架 二.Apollo阿波罗 2.1 Apollo特点 2.2 Apollo整体架构原理 2.3 Apollo Portol 环境搭建 Lin ...

  9. 【Distributed】分布式任务调度平台

    一.概述 什么是定时任务 二.Java实现定时任务方式 2.1 Thread 2.2 TimerTask 2.3 ScheduledExecutorService 2.4 Quartz 引入maven ...

随机推荐

  1. 阶段5 3.微服务项目【学成在线】_day04 页面静态化_14-页面静态化-数据模型-远程请求接口

    okhttp的官方文档: https://square.github.io/okhttp/ github的地址 https://github.com/square/okhttp/ 如何远程请求轮播图的 ...

  2. [C++]Yellow Cards - GYM - 102348A(Practice *) - CodeForces

    1 Problem Description Problem The final match of the Berland Football Cup has been held recently. Th ...

  3. CPU 上下文切换及案例分析

    什么是CPU 上下文 我们都知道,Linux是一个多任务操作系统,它远支持大于CPU数量的任务同时运行,当然,这些任务实际上并不是真的在同时运行,而是因为系统在很短时间内,将CPU轮流分配给他们,造成 ...

  4. 使用PostMan测试WebService接口

    使用PostMan测试WebService接口 参考资料: 通过XML请求WebServer  https://blog.csdn.net/qq_33933408/article/details/53 ...

  5. 简单深入Joomla!3.1.5模块_组件开发(一)

    简单深入Joomla!3.1.5模块_组件开发 主要内容: 1, 模块(访问数据库,链接到组件,数据基本流向) 2, 组件CRUD(MVC模式,访问数据库,表单提交,AJAX提交,数据基本流向) 3, ...

  6. qt坐标系统见解

    窗口坐标为逻辑坐标,是基于视口坐标系的. 视口坐标为物理坐标,是基于绘图设备坐标系的 窗口坐标始终以视口坐标为最终目标进行映射: QPainter::setWindow 修改了窗口位置和大小(左上角重 ...

  7. 学习笔记:CentOS7学习之十八:Linux系统启动原理及故障排除

    目录 学习笔记:CentOS7学习之十八:Linux系统启动原理及故障排除 18.1 centos6系统启动过程及相关配置文件 18.1.1 centos6系统启动过程 18.1.2 centos6启 ...

  8. Vue(一)环境搭建、创建项目

    1.安装node和npm 因为node已经有npm,所以直接安装node,配置环境变量 官网地址:http://nodejs.cn/download/ 2.查看node是否安装成功,输入名nde -v ...

  9. Python非递归实现二叉树的后续遍历

    leetcode 145. Binary Tree Postorder Traversal 思路一: 使用一个栈stack保存经过的根结点,另一个栈flag保存每个结点的右子树是否遍历: 如果根结点存 ...

  10. ios 输入框失去焦点,位置回调方法

    微信网页开发,ios 在input,textarea 失去焦点后,页面无法回调. 以下方法可解决: $("input,textarea").on("blur", ...