fly6022
文章18
标签27
分类3
记一次博客优化

记一次博客优化

233,本次博客优化主要对网站的层叠样式表(CSS)以及字体方面做了微调。

🎨 层叠样式表

为了使页面更快响应,我对网站的层叠样式表做了微调及压缩:目前CSS文件的大小由原来的 243 KB 变为了 221 KB

PNG1

经过本地测试,网站首页CSS的响应速度为 33.96 ms

PNG2

在分页测试中,CSS的响应速度为 11.92 ms

实际表现虽然不是很理想,但还是比以往要快的。不过受制于CloudFlare CDN的速度,上云的实际速度会比本地测试慢。

✏ 字体

字体方面,由以往单一的 思源黑体 拓展到 思源黑体+思源宋体+Roboto字体 一并使用。

网站主体部分以及博客文章方面,标题使用思源宋体(font-weight值为800),正文使用思源黑体 + Roboto字体(font-weight值为300)。

字体对比

PNG3

Google Fonts

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:100,200,300,400,500,700,800,900">

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Serif+SC:100,200,300,400,500,700,800,900">

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,200,300,400,500,700,800,900">

本文作者:fly6022
本文链接:https://fly6022.fun/posts/2020-12-26-01/
版权声明:本文采用 署名-非商业性使用-禁止演绎 4.0 国际 (CC BY-NC-ND 4.0) 协议进行许可,转载请注明原出处。