博客速度优化篇-二

前言

本教程适用于未备案的站点备案站点直接用Edgeone就行了

由于我的域名再Spaceship注册 无法在国内进行ICP备案(萌ICP备案又何尝不是备案呢)嗯 总而言之 就是没有ICP备案用不了国内的CDN节点 我一直想把博客迁移到Edgeone上面 也要备案 但由于域名迁移费用太大 所以安居在Vercel Netlify其实也不错 但是现在的免费额度就等于没有 然后就发现了这个JSDMirror - 极速、免费、全球化的前端 CDN 镜像

国内CDN加速

这就很棒了 这就是说 你只需要在Github建立一个公开的仓库 把加载慢的资源全部丢进去 然后通过这个访问

https://cdn.jsdmirror.com/gh/用户名/仓库名@main/文件名称

我访问这个加速资源 嗯 时Edgeone的重庆CDN!

你只需要给AI说这个 就可以让它帮你改代码啦

Anzhiyu主题CDN文件在themes/anzhiyu/scripts/events/cdn.js这下面 进去后 直接复制粘贴下面的内容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
/**
* AnZhiYu
* Merge CDN
*/

"use strict";

const { version } = require("../../package.json");
const path = require("path");

hexo.extend.filter.register("before_generate", () => {
const themeConfig = hexo.theme.config;
const { CDN } = themeConfig;

const thirdPartySrc = hexo.render.renderSync({ path: path.join(hexo.theme_dir, "/plugins.yml"), engine: "yaml" });
const internalSrc = {
main: {
name: "hexo-theme-anzhiyu",
file: "js/main.js",
version,
},
utils: {
name: "hexo-theme-anzhiyu",
file: "js/utils.js",
version,
},
translate: {
name: "hexo-theme-anzhiyu",
file: "js/tw_cn.js",
version,
},
local_search: {
name: "hexo-theme-anzhiyu",
file: "js/search/local-search.js",
version,
},
algolia_js: {
name: "hexo-theme-anzhiyu",
file: "js/search/algolia.js",
version,
},
random_friends_post_js: {
name: "hexo-theme-anzhiyu",
file: "js/anzhiyu/random_friends_post.js",
version,
},
right_click_menu_js: {
name: "hexo-theme-anzhiyu",
file: "js/anzhiyu/right_click_menu.js",
version,
},
comment_barrage_js: {
name: "hexo-theme-anzhiyu",
file: "js/anzhiyu/comment_barrage.js",
version,
},
ai_abstract_js: {
name: "hexo-theme-anzhiyu",
file: "js/anzhiyu/ai_abstract.js",
version,
},
people_js: {
name: "hexo-theme-anzhiyu",
file: "js/anzhiyu/people.js",
version,
},
};

const minFile = file => {
return file.replace(/(?<!\.min)\.(js|css)$/g, ext => ".min" + ext);
};

const createCDNLink = (data, type, cond = "") => {
Object.keys(data).map(key => {
let { name, version, file, other_name } = data[key];

const cdnjs_name = other_name || name;
const cdnjs_file = file.replace(/^[lib|dist]*\/|browser\//g, "");
const min_cdnjs_file = minFile(cdnjs_file);
if (cond === "internal") file = `source/${file}`;
const min_file = minFile(file);
const verType = CDN.version ? `@${version}` : "";

const value = {
version,
name,
file,
cdnjs_file,
min_file,
min_cdnjs_file,
cdnjs_name,
};
const cdnSource = {
local: cond === "internal" ? cdnjs_file : `/pluginsSrc/${name}/${file}`,
jsdelivr: `https://cdn.jsdelivr.net/npm/${name}${verType}/${min_file}`,
unpkg: `https://unpkg.com/${name}${verType}/${file}`,
cdnjs: `https://cdnjs.cloudflare.com/ajax/libs/${cdnjs_name}/${version}/${min_cdnjs_file}`,
elemecdn: `https://npm.elemecdn.com/${name}${verType}/${file}`,
onmicrosoft: `https://npm.onmicrosoft.cn/${name}${verType}/${file}`,
cbd: `https://cdn.cbd.int/${name}${verType}/${file}`,
anheyu: `https://cdn.anheyu.com/npm/${name}${verType}/${min_file}`,
jsdmirror: `https://cdn.jsdmirror.com/npm/${name}${verType}/${min_file}`,
custom: (CDN.custom_format || "").replace(/\$\{(.+?)\}/g, (match, $1) => value[$1]),
};

data[key] = cdnSource[type];
});

if (cond === "internal") data["main_css"] = "css/index.css";
return data;
};

// delete null value
const deleteNullValue = obj => {
if (!obj) return;
for (const i in obj) {
obj[i] === null && delete obj[i];
}
return obj;
};

themeConfig.asset = Object.assign(
createCDNLink(internalSrc, CDN.internal_provider, "internal"),
createCDNLink(thirdPartySrc, CDN.third_party_provider),
deleteNullValue(CDN.option)
);
});

然后在主题配置文件配置CDN这个大约在755行左右

1
2
3
4
5
6
7
CDN:
internal_provider: local
third_party_provider: jsdmirror
version: true
option:
twikoo: https://npm.onmicrosoft.cn/twikoo@1.7.15/dist/twikoo.all.min.js
fontawesome: https://npm.onmicrosoft.cn/@fortawesome/fontawesome-free@6.5.1/css/all.min.css

响应速度优化

Vercel和Cloudflare的国内响应速度真是一言难尽 大多数时间 Tcping常年出现中国红的盛景

这时候xingpingcn/enhanced-FaaS-in-China: 提升部署在cloudflare、vercel或netlify的网页在中国的访问速度和稳定性 cf优选域名 | cf优选ip | cloudflare | vercel | netlify | 加速 | 国内 | 中国 | 境内 | 大陆这个项目就很棒了

  • 如果你的网站部署在vercel,则把 cname 记录改为:
    • vercel-cname.xingpingcn.top
  • 如果你的网站部署在netlify,则把 cname 记录改为:
    • netlify-cname.xingpingcn.top
  • 如果你的网站部署在cf上,则把 cname 记录改为:
    • cf-cname.xingpingcn.top

这么优化后速度那是相当可观了Tcping测试

最后

至此 博客优化就完成了!