Pigeon For Typecho 主题优化指南:提高网页加载速度的策略

前言

发现主题有些卡顿,通过浏览器F12的网络功能,进行探索。

字体分包

字体是主要的加载 “大户”,花了3s才加载出来

Pigeon For Typecho 主题优化指南:提高网页加载速度的策略

解决办法:在线搜索字体分包工具,执行会得到左边hm文件夹。

/usr/themes/pigeon/assets/fonts/hm

把文件夹上传到服务器,路径在/fonts下(也可以任意,记得路径就好)。

Pigeon For Typecho 主题优化指南:提高网页加载速度的策略

把字体名字复制好。

<link rel="stylesheet" href="

在Pigeon 4.1 设置面板——其他设置——自定义代码添加,添加上方的代码,自行修改网站地址。

body {font-family: 'HarmonyOS_Sans_SC_Medium', sans-serif;}

在Pigeon 4.1 设置面板——其他设置——自定义CSS,添加上方的代码后保存,‘HarmonyOS_Sans_SC_Medium’,自行修改字体名字。

Pigeon For Typecho 主题优化指南:提高网页加载速度的策略

当刷新后显示如上图,则代表成功。

隐藏评论头像

<!-- <img class="avatar" src="<?php echo feature::avatarHtml($comments); ?>" /> -->

在路径usr/themes/pigeon/common内打开comments.php,搜索 comment_list_avatar ,注释如上(也可以删除)。

隐藏评论表情

<!-- <div class="rko"><div class="OwO">OωO</div></div> -->

在路径usr/themes/pigeon/common内打开comments.php,搜索 comment_left,注释如上(也可以删除)。

Pigeon For Typecho 主题优化指南:提高网页加载速度的策略

在comments.php,搜索OwO.json(也可以划到代码底部),同理注释掉。

总结

还有把需要通过外链引用的文件,下载到服务器,在通过自定义CSS,自定义代码添加引用,获得更快的加载速度,当然也可以上传assets到CDN,也能有流畅的体验。且不局限于Pigeon For Typecho,其他的主题也可以字体分包,这是很有效的方法,未完待续……

本文收录于{云心怀鹤}

© 版权声明

相关文章

暂无评论

暂无评论...