前端 cdn 加速

作者:Kandyhttps://www.jianshu.com/p/1dae6e1680ff一、什么是 CDNCDN的全称是(Content Delivery Network)，即内...

简单来讲，CDN就是根据用户位置分配最近的资源。用户在上网的时候不用直接访问源站，而是访问离他“最近的”一个 CDN 节点。这个节点是缓存了源站内容的代理服务器。

https://www.bootcdn.cn/

人们开始希望网络更加的快速，而不是在无休止的等待中上网。这样CDN就得到了飞速的发展，那么问题就来了，CDN是如何来解决这个问题的呢?由于互联网的飞速发展，越来越多的人开始使用并依赖网络，那在膨胀的用户群的现行的网络负载能力就形成了矛盾，人们开始希望网络更加的快速，而不是在无休止的等待中上网。这样CDN就得到了飞速的发展，那么问题就来了，CDN是如何来解决这个问题的呢?要了解CDN 的实现原理，首...

编程基础的初级开发者，计算机科学专业的学生，以及平时没怎么利用过数据结构与算法的开发人员希望复习这些概念为下次技术面试做准备。或者想学习一些计算机科学的基本概念，以优化代码，提高编程技能。这份笔记都是可以作为参考的。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

阿小云网站通过ICP备案成功上线了，但是网站地域是广州节点，对于全国用户访问速度不是很理想，故需要将网站接入CDN，提升网站的访问速度。网站怎么接入CDN？

在没有使用cdn加速之前打包后数据如下，可以看出element-ui、vue、vuex、vue-router这些依赖都打进chunk-vendors.js中导致体积很大，假设再来很多依赖项是不是更大，同时也会影响单页面应用首屏加载速度，所以这里采用一种打包优化手段之一来分离依赖项。......

一、推荐使用 链接：http://www.bootcdn.cn/all/ 这个是比较好的，里面有jquery、bootstrap等的文件，可以通过连网引用；而且https 和 http 的协议都支持。 二、只支持https协议 链接：https://cdnjs.com/ 这个是后来自己发现的，只支持https的协议，下面是可能用到的几个： https://cdnjs.cloud

什么是CDN CDN（Content Delivery Network）即内容分发网络，其基本思路是尽可能的避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输更快、更稳定。 CDN是一组分布在多个不同地理位置的Web服务器，用于更加有效地向用户发布内容。 CDN系统能够实时的根据网络流量和各节点的连接，负载状况以及用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。其目的就是使用户能够就近的获取请求数据，解决网络访问拥挤状况，提高用户访问系统的响应时间。 CD

CDN全称叫做“Content Delivery Network”，中文叫**内容分发网络**。我们用它来**提高访问速度**。把一些静态资源：css， .js，图片，视频放在第三方的CDN服务器上，可以加速访问速度。 前端项目中使用CDN好处： 1. 减少应用打包出来的包体积 2. 加快静态资源的访问-cdn服务器集群-就近返回 3. 利用浏览器缓存，不会变动的文件长期缓存 可以适当提高第三方插件的链接速度, 但是开发的时候我们还是可以在本地用npm下载, 但是上线后要配置cdn地址, 用户的浏览

CDN是一种分布式架构的网络，通过将内容缓存到离用户更近的服务器节点上，可以有效地减少网络延迟，并提高页面加载速度和用户体验。当用户请求访问网站时，CDN会根据用户的地理位置选择离用户最近的节点来响应请求，从而减少网络传输的时间和延迟。通过部署CDN节点和合理配置域名解析，可以提高网站的访问速度和用户体验，减轻源服务器负载，并提供更好的全球访问性能。域名解析：将网站的域名解析到CDN服务商提供的CDN节点地址上，这样用户在请求访问网站时会自动被引导到最近的CDN节点。

通过使用CDN加载这些公库，可以将它们缓存在CDN的节点服务器上，提供更快速的加载和传输，无需在本地部署维护这些库的副本。：将网站的静态资源缓存在多个节点服务器上，当用户访网站时，大部分的资源可以从离用户较近的节点服务器上获取，少了对原始服务器的访问。减轻了源服务器的负载压力，节约了网络带宽的使用，提高了整体的网络效率。综上所述，CDN的作用是提供快速、可靠的内容分发服务，加速网站访问、节省网络带宽、提高可用性和稳定性，抵御网络攻击，提供高质量的视频内容传输，从而改善用户体验，提升网站的性能和效果。

Gzip压缩利用的是文本文件的重复性，将重复的内容只保留一份，并用一个指向这些重复内容的引用来代替多个重复出现的内容，在传输时只传输一份内容，从而减小网络传输的开销。使用WebP格式图片：Google开发的WebP格式图片，可以将图片大小进行更高效的压缩，从而减少文件的大小，提高网站的加载速度。图片延迟加载：对于一些较大的图片，可以使用图片延迟加载的方式来优化加载速度。CDN加速：使用CDN加速服务可以将图片缓存在CDN服务器上，从而加快图片的加载速度，减少对原服务器的请求次数，提高网站的性能和用户体验。

CDN（Content Delivery Network，内容分发⽹络）是指⼀种通过互联⽹互相连接的电脑⽹络系统，利 ⽤最靠近每位⽤户的服务器，更快、更可靠地将⾳乐、图⽚、视频、应⽤程序及其他⽂件发送给⽤户， 来提供⾼性能、可扩展性及低成本的⽹络内容传递给⽤户。

CDN是一种分布式网络服务，通过在全球范围内部署边缘节点，缓存和分发网站的静态资源，如HTML、CSS、JavaScript文件、图片和视频等，从而缩短用户与网站内容之间的物理距离，减少延迟，提高响应速度。CDN，即内容分发网络，是现代互联网架构中不可或缺的一部分，尤其在前端开发领域，CDN的运用极大地提高了网站的性能和用户体验。而对于静态资源，则可以设置较长的缓存时间。由于移动设备的网络状况可能较差，可以利用CDN的智能压缩和图像优化功能，针对移动用户自动提供更小的资源版本，以减少流量消耗和加载时间。

bootcdn https://www.bootcdn.cn/ loli https://cdnjs.loli.net/ Bootstrap CDN https://www.bootstrapcdn.com/ Staticfile https://staticfile.org/ 75CDN https://cdn.baomitu.com/ 今日头条 CDN https://cdn.bytedance.com/ cdnjs https://cdnjs.com/ jsDelivr https://www.jsd