211 字
1 分钟
How to Use jsdelivr CDN

My blog uses a lot of JS and CSS. If all of it is loaded from the server, the load time will be very slow (when I first used this theme hosted on GitHub Pages, the initial load took 40s+). So the JS and CSS files need to be placed on a CDN. The public CDNs I know of are BootCDN and JSDELIVR. jsdelivr can directly load files from GitHub, while bootcdn cannot. I originally used BootCDN, but it’s slower than jsdelivr and only supports official libraries, so I switched to jsdelivr.

How to Load with jsdelivr#

GitHub#

In a nutshell, it’s https://cdn.jsdelivr.net/gh/username/repository@version/directory.

Detailed version:

// Load any GitHub release, commit or branch
// Note: We recommend using npm for projects that support it
https://cdn.jsdelivr.net/gh/user/repo@version/file
// Load jQuery v3.2.1
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js
// Use a version range instead of a specific version
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js
https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js
// Omit the version completely to get the latest version
// You shouldn't use this in production
https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js
// Add ".min" to any JS/CSS file
// If it doesn't exist, we'll generate it for you (and compress it)
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js
// Add "/" at the end to get a directory listing
https://cdn.jsdelivr.net/gh/jquery/jquery/

npm#

Replace gh with npm; there’s no username. Everything else stays the same.

https://cdn.jsdelivr.net/npm/package-name@version/directory

Refreshing the CDN Cache#

Replace https://cdn.jsdelivr.net/ in the URL with https://purge.jsdelivr.net/ and that’s it.

How to Use jsdelivr CDN
https://tski.uk/blog/en/jsdelivr-cdn/
作者
Tokisaki Galaxy
发布于
2021-02-28
许可协议
CC BY