This commit is contained in:
小赵同学 committed 2024-08-12 11:51:03 +08:00
1 parent 69576e2e35
commit 11087a9a55
23 files changed
+371 -96

No files matched your search

@@ -22,7 +22,7 @@ https://github.com/instantpage/instant.page
PC端
---
```markdown
```
在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
@@ -30,7 +30,7 @@ PC端
移动端
---
```markdown
```
用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
```
+13 -11
View File
@@ -15,9 +15,9 @@ tags: []
午觉起床仔细查看,原来是我当时买的四年腾讯云轻量服务器马上要到期了,于是去腾讯云官网看看有没有划算的活动,再续几年,不出我所料,腾讯云只对新用户才有优惠活动,而老用户单纯续费不走活动的话,价格不是我这种小博主可以承担的起的
所以只能放弃,再寻它法
所以只能放弃,另辟蹊径
经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,然后再和hugo测试对比,我还是放弃了hexo
经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,在此期间曾拿hugo测试比较,我还是放弃了hexo
没有选择使用 Hexo 的一个最大原因是,Hexo 的性能远远不及 Hugo
@@ -25,13 +25,13 @@ tags: []
下决心转到hugo的这几天里,给我最大的感受就是hugo的主题真的是太少了,大部分都是老外写的,因为自己下载的hugo最新的版本,一些比较老的hugo主题,实际运行会出现奇奇怪怪的报错,试了几个比较满意的主题都遇到各种奇奇怪怪的报错问题,对一个新手来说还真的是蛮打击心态的,找了一圈也没有找到满意的
于是我又萌生了一个大胆的想法,自己尝试写一个自用的hugo主题
于是我又萌生了一个新的想法,要不,自己手搓一个hugo主题
果不其然,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了
万万没想到,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了
不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了
不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了,本地进行简单的测试,然后就匆匆上线了
从此,我的博客彻底定型为hugo
至此,我的博客彻底定型为hugo
## 个人感受
@@ -61,17 +61,17 @@ tags: []
## 主题优化
在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡,这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢
在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡
这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢
![image-20240811222643740](/pics/hugo/migrate-to-hugo/image-20240811222643740.png)
目前主题还是雏形,主题还在开发中,更多功能,敬请期待
主题还在开发中,如果访问期间遇到bug请F5强制刷新缓存
## 特别感谢
特别感谢主题开发期间提供帮助的博友以及开发者(以下排名不分先后)
hugo 官方 https://gohugo.io
Hugo 官方 https://gohugo.io
[团团]( https://t-t.live) https://t-t.live
@@ -79,3 +79,5 @@ hugo 官方 https://gohugo.io
[永恒末匕](https://likaijian.com/) https://likaijian.com
特别感谢主题开发期间提供帮助的博友以及开发者(以上排名不分先后)
+6 -6
View File
@@ -26,12 +26,12 @@
https://github.com/instantpage/instant.page</a></p>
<p>项目的介绍这样写到</p>
<h2 id="pc端">PC端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
</span></span><span style="display:flex;"><span>另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
</span></span><span style="display:flex;"><span>您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</span></span></code></pre></div><h2 id="移动端">移动端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</span></span></code></pre></div><p>
<pre tabindex="0"><code>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</code></pre><h2 id="移动端">移动端</h2>
<pre tabindex="0"><code>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</code></pre><p>
<img data-lazy-src="/pics/2024/03/4028544490.png" alt="" class="lazyload"></p>
<p>汉译过来大概意思就是,当鼠标即将悬停到a标签的之前,对该链接进行预加载,提高访问速度</p>
<p>因为之前有同学反馈我的博客点击文章加载有些慢,于是乎说干就干,项目很简单,如需上手,直接在body标签之前加入一行js代码即可</p>
+11 -10
View File
@@ -17,15 +17,15 @@
<content:encoded><![CDATA[<img loading="lazy" decoding="async" src="/" alt="迁移博客至hugo" /><p>近日,在午休的时候,突然收到了腾讯云的短信,起初以为就是腾讯云的新产品上线的营销短信,也就没管它</p>
<p>午觉起床仔细查看,原来是我当时买的四年腾讯云轻量服务器马上要到期了,于是去腾讯云官网看看有没有划算的活动,再续几年,不出我所料,腾讯云只对新用户才有优惠活动,而老用户单纯续费不走活动的话,价格不是我这种小博主可以承担的起的</p>
<p>所以只能放弃,再寻它法</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,然后再和hugo测试对比,我还是放弃了hexo</p>
<p>所以只能放弃,另辟蹊径</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,在此期间曾拿hugo测试比较,我还是放弃了hexo</p>
<p>没有选择使用 Hexo 的一个最大原因是,Hexo 的性能远远不及 Hugo</p>
<p>我的博客文章从typecho导出大概有一百多篇文章,用hexo构建,大部分情况下需要半分钟,而在老家那个老式办公机,可能是电脑性能太差,经常会出现构建失败,而用hugo却只需要两秒即可构建所有页面及文章,即使我的老式办公机也可以快速构建,极大的原因可能是hugo的底层是go写的,构建速度会比hexo快很多</p>
<p>下决心转到hugo的这几天里,给我最大的感受就是hugo的主题真的是太少了,大部分都是老外写的,因为自己下载的hugo最新的版本,一些比较老的hugo主题,实际运行会出现奇奇怪怪的报错,试了几个比较满意的主题都遇到各种奇奇怪怪的报错问题,对一个新手来说还真的是蛮打击心态的,找了一圈也没有找到满意的</p>
<p>于是我又萌生了一个大胆的想法,自己尝试写一个自用的hugo主题</p>
<p>果不其然,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了</p>
<p>从此,我的博客彻底定型为hugo</p>
<p>于是我又萌生了一个新的想法,要不,自己手搓一个hugo主题</p>
<p>万万没想到,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了,本地进行简单的测试,然后就匆匆上线了</p>
<p>至此,我的博客彻底定型为hugo</p>
<h2 id="个人感受">个人感受</h2>
<p>最大的感受就是静态博客真的很省心,转到了静态博客,我不用再花费相当大的精力去维护LNMP 类型的博客(typecho)</p>
<p>因为静态博客不再依赖数据库,也不会遇到数据库长时间不重启,突然某一天自己熄火</p>
@@ -40,13 +40,13 @@
<p>整体的维护性很差,很多代码我自己现在都看不懂了,属于会改的不想看,不会改的看不懂</p>
<p>为了不耽误各位的时间,就不要来找我要主题了,最后特别感谢大家对我魔改的肯定</p>
<h2 id="主题优化">主题优化</h2>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡,这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡</p>
<p>这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>
<img data-lazy-src="/pics/hugo/migrate-to-hugo/image-20240811222643740.png" alt="image-20240811222643740" class="lazyload"></p>
<p>目前主题还是雏形,主题还在开发中,更多功能,敬请期待</p>
<p>主题还在开发中,如果访问期间遇到bug请F5强制刷新缓存</p>
<h2 id="特别感谢">特别感谢</h2>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以下排名不分先后)</p>
<p>hugo 官方
<p>Hugo 官方
<a
href="/tiaozhuan/index.html?target=aHR0cHM6Ly9nb2h1Z28uaW8%3d"
@@ -99,6 +99,7 @@ https://qq.md</a></p>
target="_blank"
>
https://likaijian.com</a></p>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以上排名不分先后)</p>
]]></content:encoded>
</item>
+3 -3
View File
@@ -72,10 +72,10 @@
uk-scrollspy="target: > .cf-article-item; cls: uk-animation-fade; delay: 0"></div>
</div>
<script>
let UserConfig = {
let UserConfig = {
private_api_url: 'https://circle.usj.cc/',
private_api_url: 'https://fc.5b2.cn/',
page_turning_number: 10,
+1 -1
View File
@@ -1157,7 +1157,7 @@ input[type=submit] {
/*新文章提醒样式*/
.new-post-message {
content: '';
background: url(https://usj.cc/usr/uploads/2023/01/1457247750.png) no-repeat;
background: url(https://usj.cc/pics/2023/01/1457247750.png) no-repeat;
width: 26px;
height: 14px;
background-size: contain;
+32 -1
View File
@@ -76,26 +76,58 @@
<div class="post">
<div class="time">August 11, 2024</div>
<a href="https://usj.cc/post/migrate-to-hugo/">迁移博客至hugo</a>
<span class="new-post-message"></span>
</div>
<div class="post">
<div class="time">April 5, 2024</div>
<a href="https://usj.cc/post/1287/">主机配置单</a>
</div>
<div class="post">
<div class="time">March 16, 2024</div>
<a href="https://usj.cc/post/1284/">一次点亮</a>
</div>
<div class="post">
<div class="time">March 1, 2024</div>
<a href="https://usj.cc/post/1279/">访客体验优化</a>
</div>
<div class="post">
<div class="time">August 3, 2023</div>
<a href="https://usj.cc/post/1243/">家乡随拍</a>
</div>
</div>
@@ -110,7 +142,6 @@
<li class="page-item page-previous">
</li>
</ul>
</div>
+20
View File
@@ -269,6 +269,26 @@
"邹江博客",
"https://www.zoujiang.com",
"https://www.zoujiang.com/logo.jpg"
],
[
"森木志",
"https://oxxx.cn",
"https://gravatar.webp.se/avatar/5a076aa876b435fe788c8eeda004e9ec"
],
[
"土拨许",
"https://zhuo.re",
"https://cravatar.cn/avatar/126bbc02f1aef6228805d330648d9aa1"
],
[
"Jdeal",
"https://www.jdeal.cn",
"https://qn.jdeal.cn/file/favicon.ico"
],
[
"优世界",
"https://usj.cc",
"https://usj.cc/favicon.ico"
]
]
}
+30 -1
View File
@@ -76,26 +76,56 @@
<div class="post">
<div class="time">July 16, 2023</div>
<a href="https://usj.cc/post/1223/">襄阳唐城</a>
</div>
<div class="post">
<div class="time">April 23, 2023</div>
<a href="https://usj.cc/post/1142/">苏州一日游</a>
</div>
<div class="post">
<div class="time">January 29, 2023</div>
<a href="https://usj.cc/post/1081/">Time Taker</a>
</div>
<div class="post">
<div class="time">January 28, 2023</div>
<a href="https://usj.cc/post/1043/">近来二三事</a>
</div>
<div class="post">
<div class="time">September 7, 2022</div>
<a href="https://usj.cc/post/92/">记录篇:将笔记本联想小新pro13网卡由螃蟹网卡换成AX210网卡</a>
</div>
</div>
@@ -112,7 +142,6 @@
<a class="prev" title="上一页" href="/">上一页</a>
</li>
</ul>
</div>
+30 -1
View File
@@ -76,26 +76,56 @@
<div class="post">
<div class="time">August 22, 2022</div>
<a href="https://usj.cc/post/87/">生活篇:温馨提示假期余额不足,浅浅总结一下这个暑假</a>
</div>
<div class="post">
<div class="time">June 29, 2022</div>
<a href="https://usj.cc/post/85/">生活篇:离校,暑假,租房,面试,致那些日子的琐碎事</a>
</div>
<div class="post">
<div class="time">March 24, 2022</div>
<a href="https://usj.cc/post/76/">寒假二三事</a>
</div>
<div class="post">
<div class="time">February 27, 2022</div>
<a href="https://usj.cc/post/75/">2022,除夕过后的那些事</a>
</div>
<div class="post">
<div class="time">February 22, 2022</div>
<a href="https://usj.cc/post/74/">2022,致我的春节回忆录</a>
</div>
</div>
@@ -112,7 +142,6 @@
<a class="prev" title="上一页" href="/page/2/">上一页</a>
</li>
</ul>
</div>
+30 -1
View File
@@ -76,26 +76,56 @@
<div class="post">
<div class="time">December 22, 2021</div>
<a href="https://usj.cc/post/40/">放假之前最后一次的照片合集,再见啦!理工</a>
</div>
<div class="post">
<div class="time">November 9, 2021</div>
<a href="https://usj.cc/post/25/">第一次尝试ai画简笔画,本是给自己设计logo误打误撞画起了简笔画</a>
</div>
<div class="post">
<div class="time">October 7, 2021</div>
<a href="https://usj.cc/post/14/">记录人生第一次洗牙,不得不说感觉真的特别好</a>
</div>
<div class="post">
<div class="time">October 3, 2021</div>
<a href="https://usj.cc/post/12/">我为什么要写博客?这位博主给了我答案</a>
</div>
<div class="post">
<div class="time">October 1, 2021</div>
<a href="https://usj.cc/post/11/">我想,这是一个我人生中最特殊的中秋国庆节</a>
</div>
</div>
@@ -112,7 +142,6 @@
<a class="prev" title="上一页" href="/page/3/">上一页</a>
</li>
</ul>
</div>
+30 -1
View File
@@ -76,26 +76,56 @@
<div class="post">
<div class="time">September 4, 2021</div>
<a href="https://usj.cc/post/4/">2021暑假总结,记录一下这个充实的暑假</a>
</div>
<div class="post">
<div class="time">August 31, 2021</div>
<a href="https://usj.cc/post/1/">无悔</a>
</div>
<div class="post">
<div class="time">August 31, 2021</div>
<a href="https://usj.cc/post/8/">江的南岸叫襄阳,江的北岸叫樊城,这就是人们常说的襄樊</a>
</div>
<div class="post">
<div class="time">August 20, 2021</div>
<a href="https://usj.cc/post/70/">一把过,科二结束!</a>
</div>
<div class="post">
<div class="time">August 16, 2021</div>
<a href="https://usj.cc/post/69/">再次投资科目二,科目二花了400,希望19号一把过吧</a>
</div>
</div>
@@ -112,7 +142,6 @@
<a class="prev" title="上一页" href="/page/4/">上一页</a>
</li>
</ul>
</div>
+30 -1
View File
@@ -76,26 +76,56 @@
<div class="post">
<div class="time">May 16, 2021</div>
<a href="https://usj.cc/post/45/">双休日襄阳游记,与朋友一起,终究还是遗憾而归</a>
</div>
<div class="post">
<div class="time">March 19, 2021</div>
<a href="https://usj.cc/post/65/">这几天都频繁下雨,上课路上被浇成成落汤鸡</a>
</div>
<div class="post">
<div class="time">February 21, 2021</div>
<a href="https://usj.cc/post/64/">开学倒计时,再见,老家</a>
</div>
<div class="post">
<div class="time">February 10, 2021</div>
<a href="https://usj.cc/post/61/">新春快乐!牛年大吉!</a>
</div>
<div class="post">
<div class="time">January 15, 2021</div>
<a href="https://usj.cc/post/60/">祝母校越办越好</a>
</div>
</div>
@@ -112,7 +142,6 @@
<a class="prev" title="上一页" href="/page/5/">上一页</a>
</li>
</ul>
</div>
+30 -1
View File
@@ -76,26 +76,56 @@
<div class="post">
<div class="time">December 27, 2020</div>
<a href="https://usj.cc/post/57/">期末倒计时开始</a>
</div>
<div class="post">
<div class="time">December 22, 2020</div>
<a href="https://usj.cc/post/54/">今年的第一场雪</a>
</div>
<div class="post">
<div class="time">October 15, 2020</div>
<a href="https://usj.cc/post/53/">军训结束</a>
</div>
<div class="post">
<div class="time">October 15, 2020</div>
<a href="https://usj.cc/post/52/">军训太痛苦了,希望早点结束</a>
</div>
<div class="post">
<div class="time">October 1, 2020</div>
<a href="https://usj.cc/post/51/">双节快乐!家与国撞了个满怀</a>
</div>
</div>
@@ -112,7 +142,6 @@
<a class="prev" title="上一页" href="/page/6/">上一页</a>
</li>
</ul>
</div>
+18 -1
View File
@@ -76,16 +76,34 @@
<div class="post">
<div class="time">July 7, 2020</div>
<a href="https://usj.cc/post/50/">高考加油,相信自己</a>
</div>
<div class="post">
<div class="time">July 3, 2020</div>
<a href="https://usj.cc/post/49/">高考即将来临,老师为我们加油打气</a>
</div>
<div class="post">
<div class="time">March 11, 2020</div>
<a href="https://usj.cc/post/47/">老家以前的样子,挺怀念的</a>
</div>
</div>
@@ -100,7 +118,6 @@
<a class="prev" title="上一页" href="/page/7/">上一页</a>
</li>
</ul>
</div>
+6 -6
View File
@@ -88,12 +88,12 @@
https://github.com/instantpage/instant.page</a></p>
<p>项目的介绍这样写到</p>
<h2 id="pc端">PC端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
</span></span><span style="display:flex;"><span>另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
</span></span><span style="display:flex;"><span>您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</span></span></code></pre></div><h2 id="移动端">移动端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</span></span></code></pre></div><p>
<pre tabindex="0"><code>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</code></pre><h2 id="移动端">移动端</h2>
<pre tabindex="0"><code>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</code></pre><p>
<img data-lazy-src="/pics/2024/03/4028544490.png" alt="" class="lazyload"></p>
<p>汉译过来大概意思就是,当鼠标即将悬停到a标签的之前,对该链接进行预加载,提高访问速度</p>
<p>因为之前有同学反馈我的博客点击文章加载有些慢,于是乎说干就干,项目很简单,如需上手,直接在body标签之前加入一行js代码即可</p>
+12 -11
View File
@@ -71,7 +71,7 @@
<article style="margin-bottom: 3.5em;">
<h1 class="post-title" itemprop="name headline">迁移博客至hugo</h1>
<div class="meta">
作者: 小赵同学 浏览: <span id="busuanzi_value_page_uv"></span> 字数: 1538 分类:
作者: 小赵同学 浏览: <span id="busuanzi_value_page_uv"></span> 字数: 1559 分类:
<a href="%e7%94%9f%e6%b4%bb">生活</a>
@@ -79,15 +79,15 @@
<div class="post-content" itemprop="articleBody" uk-scrollspy="target: > hr,h2,p,pre; cls: uk-animation-slide-bottom-small; delay: 0">
<p>近日,在午休的时候,突然收到了腾讯云的短信,起初以为就是腾讯云的新产品上线的营销短信,也就没管它</p>
<p>午觉起床仔细查看,原来是我当时买的四年腾讯云轻量服务器马上要到期了,于是去腾讯云官网看看有没有划算的活动,再续几年,不出我所料,腾讯云只对新用户才有优惠活动,而老用户单纯续费不走活动的话,价格不是我这种小博主可以承担的起的</p>
<p>所以只能放弃,再寻它法</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,然后再和hugo测试对比,我还是放弃了hexo</p>
<p>所以只能放弃,另辟蹊径</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,在此期间曾拿hugo测试比较,我还是放弃了hexo</p>
<p>没有选择使用 Hexo 的一个最大原因是,Hexo 的性能远远不及 Hugo</p>
<p>我的博客文章从typecho导出大概有一百多篇文章,用hexo构建,大部分情况下需要半分钟,而在老家那个老式办公机,可能是电脑性能太差,经常会出现构建失败,而用hugo却只需要两秒即可构建所有页面及文章,即使我的老式办公机也可以快速构建,极大的原因可能是hugo的底层是go写的,构建速度会比hexo快很多</p>
<p>下决心转到hugo的这几天里,给我最大的感受就是hugo的主题真的是太少了,大部分都是老外写的,因为自己下载的hugo最新的版本,一些比较老的hugo主题,实际运行会出现奇奇怪怪的报错,试了几个比较满意的主题都遇到各种奇奇怪怪的报错问题,对一个新手来说还真的是蛮打击心态的,找了一圈也没有找到满意的</p>
<p>于是我又萌生了一个大胆的想法,自己尝试写一个自用的hugo主题</p>
<p>果不其然,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了</p>
<p>从此,我的博客彻底定型为hugo</p>
<p>于是我又萌生了一个新的想法,要不,自己手搓一个hugo主题</p>
<p>万万没想到,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了,本地进行简单的测试,然后就匆匆上线了</p>
<p>至此,我的博客彻底定型为hugo</p>
<h2 id="个人感受">个人感受</h2>
<p>最大的感受就是静态博客真的很省心,转到了静态博客,我不用再花费相当大的精力去维护LNMP 类型的博客(typecho)</p>
<p>因为静态博客不再依赖数据库,也不会遇到数据库长时间不重启,突然某一天自己熄火</p>
@@ -102,13 +102,13 @@
<p>整体的维护性很差,很多代码我自己现在都看不懂了,属于会改的不想看,不会改的看不懂</p>
<p>为了不耽误各位的时间,就不要来找我要主题了,最后特别感谢大家对我魔改的肯定</p>
<h2 id="主题优化">主题优化</h2>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡,这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡</p>
<p>这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>
<img data-lazy-src="/pics/hugo/migrate-to-hugo/image-20240811222643740.png" alt="image-20240811222643740" class="lazyload"></p>
<p>目前主题还是雏形,主题还在开发中,更多功能,敬请期待</p>
<p>主题还在开发中,如果访问期间遇到bug请F5强制刷新缓存</p>
<h2 id="特别感谢">特别感谢</h2>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以下排名不分先后)</p>
<p>hugo 官方
<p>Hugo 官方
<a
href="/tiaozhuan/index.html?target=aHR0cHM6Ly9nb2h1Z28uaW8%3d"
@@ -161,6 +161,7 @@ https://qq.md</a></p>
target="_blank"
>
https://likaijian.com</a></p>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以上排名不分先后)</p>
</div>
<div class="post-tags" style="margin-top: -30px;">
+17 -16
View File
@@ -17,15 +17,15 @@
<content:encoded><![CDATA[<img loading="lazy" decoding="async" src="/" alt="迁移博客至hugo" /><p>近日,在午休的时候,突然收到了腾讯云的短信,起初以为就是腾讯云的新产品上线的营销短信,也就没管它</p>
<p>午觉起床仔细查看,原来是我当时买的四年腾讯云轻量服务器马上要到期了,于是去腾讯云官网看看有没有划算的活动,再续几年,不出我所料,腾讯云只对新用户才有优惠活动,而老用户单纯续费不走活动的话,价格不是我这种小博主可以承担的起的</p>
<p>所以只能放弃,再寻它法</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,然后再和hugo测试对比,我还是放弃了hexo</p>
<p>所以只能放弃,另辟蹊径</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,在此期间曾拿hugo测试比较,我还是放弃了hexo</p>
<p>没有选择使用 Hexo 的一个最大原因是,Hexo 的性能远远不及 Hugo</p>
<p>我的博客文章从typecho导出大概有一百多篇文章,用hexo构建,大部分情况下需要半分钟,而在老家那个老式办公机,可能是电脑性能太差,经常会出现构建失败,而用hugo却只需要两秒即可构建所有页面及文章,即使我的老式办公机也可以快速构建,极大的原因可能是hugo的底层是go写的,构建速度会比hexo快很多</p>
<p>下决心转到hugo的这几天里,给我最大的感受就是hugo的主题真的是太少了,大部分都是老外写的,因为自己下载的hugo最新的版本,一些比较老的hugo主题,实际运行会出现奇奇怪怪的报错,试了几个比较满意的主题都遇到各种奇奇怪怪的报错问题,对一个新手来说还真的是蛮打击心态的,找了一圈也没有找到满意的</p>
<p>于是我又萌生了一个大胆的想法,自己尝试写一个自用的hugo主题</p>
<p>果不其然,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了</p>
<p>从此,我的博客彻底定型为hugo</p>
<p>于是我又萌生了一个新的想法,要不,自己手搓一个hugo主题</p>
<p>万万没想到,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了,本地进行简单的测试,然后就匆匆上线了</p>
<p>至此,我的博客彻底定型为hugo</p>
<h2 id="个人感受">个人感受</h2>
<p>最大的感受就是静态博客真的很省心,转到了静态博客,我不用再花费相当大的精力去维护LNMP 类型的博客(typecho)</p>
<p>因为静态博客不再依赖数据库,也不会遇到数据库长时间不重启,突然某一天自己熄火</p>
@@ -40,13 +40,13 @@
<p>整体的维护性很差,很多代码我自己现在都看不懂了,属于会改的不想看,不会改的看不懂</p>
<p>为了不耽误各位的时间,就不要来找我要主题了,最后特别感谢大家对我魔改的肯定</p>
<h2 id="主题优化">主题优化</h2>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡,这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡</p>
<p>这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>
<img data-lazy-src="/pics/hugo/migrate-to-hugo/image-20240811222643740.png" alt="image-20240811222643740" class="lazyload"></p>
<p>目前主题还是雏形,主题还在开发中,更多功能,敬请期待</p>
<p>主题还在开发中,如果访问期间遇到bug请F5强制刷新缓存</p>
<h2 id="特别感谢">特别感谢</h2>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以下排名不分先后)</p>
<p>hugo 官方
<p>Hugo 官方
<a
href="/tiaozhuan/index.html?target=aHR0cHM6Ly9nb2h1Z28uaW8%3d"
@@ -99,6 +99,7 @@ https://qq.md</a></p>
target="_blank"
>
https://likaijian.com</a></p>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以上排名不分先后)</p>
]]></content:encoded>
</item>
@@ -163,12 +164,12 @@ https://likaijian.com</a></p>
https://github.com/instantpage/instant.page</a></p>
<p>项目的介绍这样写到</p>
<h2 id="pc端">PC端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
</span></span><span style="display:flex;"><span>另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
</span></span><span style="display:flex;"><span>您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</span></span></code></pre></div><h2 id="移动端">移动端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</span></span></code></pre></div><p>
<pre tabindex="0"><code>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</code></pre><h2 id="移动端">移动端</h2>
<pre tabindex="0"><code>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</code></pre><p>
<img data-lazy-src="/pics/2024/03/4028544490.png" alt="" class="lazyload"></p>
<p>汉译过来大概意思就是,当鼠标即将悬停到a标签的之前,对该链接进行预加载,提高访问速度</p>
<p>因为之前有同学反馈我的博客点击文章加载有些慢,于是乎说干就干,项目很简单,如需上手,直接在body标签之前加入一行js代码即可</p>
+17 -16
View File
@@ -17,15 +17,15 @@
<content:encoded><![CDATA[<img loading="lazy" decoding="async" src="/" alt="迁移博客至hugo" /><p>近日,在午休的时候,突然收到了腾讯云的短信,起初以为就是腾讯云的新产品上线的营销短信,也就没管它</p>
<p>午觉起床仔细查看,原来是我当时买的四年腾讯云轻量服务器马上要到期了,于是去腾讯云官网看看有没有划算的活动,再续几年,不出我所料,腾讯云只对新用户才有优惠活动,而老用户单纯续费不走活动的话,价格不是我这种小博主可以承担的起的</p>
<p>所以只能放弃,再寻它法</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,然后再和hugo测试对比,我还是放弃了hexo</p>
<p>所以只能放弃,另辟蹊径</p>
<p>经历差不多三四天内心博弈与挣扎,总算下定决心,我要转静态博客,比较有名的静态博客平台就属hexo,hugo,因为hexo有丰富的主题和插件生态以及很多优秀积极活跃的开发者,所以我首选的静态博客平台是hexo,实际用了几天hexo,在此期间曾拿hugo测试比较,我还是放弃了hexo</p>
<p>没有选择使用 Hexo 的一个最大原因是,Hexo 的性能远远不及 Hugo</p>
<p>我的博客文章从typecho导出大概有一百多篇文章,用hexo构建,大部分情况下需要半分钟,而在老家那个老式办公机,可能是电脑性能太差,经常会出现构建失败,而用hugo却只需要两秒即可构建所有页面及文章,即使我的老式办公机也可以快速构建,极大的原因可能是hugo的底层是go写的,构建速度会比hexo快很多</p>
<p>下决心转到hugo的这几天里,给我最大的感受就是hugo的主题真的是太少了,大部分都是老外写的,因为自己下载的hugo最新的版本,一些比较老的hugo主题,实际运行会出现奇奇怪怪的报错,试了几个比较满意的主题都遇到各种奇奇怪怪的报错问题,对一个新手来说还真的是蛮打击心态的,找了一圈也没有找到满意的</p>
<p>于是我又萌生了一个大胆的想法,自己尝试写一个自用的hugo主题</p>
<p>果不其然,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了</p>
<p>从此,我的博客彻底定型为hugo</p>
<p>于是我又萌生了一个新的想法,要不,自己手搓一个hugo主题</p>
<p>万万没想到,我又遇到了第二个棘手的问题,hugo的文档真的很差,大部分都是机翻,描述的语言晦涩难懂,对于一个新手开发者真的太打击了</p>
<p>不过好在,之前二开过几款typecho主题,所以也是有了点自己的门道,找了几款star比较多的hugo主题,将它的主题源码下载下来,研究学习,经过差不多半个月的摸爬滚打,也算是把主题的雏形慢慢搓出来了,本地进行简单的测试,然后就匆匆上线了</p>
<p>至此,我的博客彻底定型为hugo</p>
<h2 id="个人感受">个人感受</h2>
<p>最大的感受就是静态博客真的很省心,转到了静态博客,我不用再花费相当大的精力去维护LNMP 类型的博客(typecho)</p>
<p>因为静态博客不再依赖数据库,也不会遇到数据库长时间不重启,突然某一天自己熄火</p>
@@ -40,13 +40,13 @@
<p>整体的维护性很差,很多代码我自己现在都看不懂了,属于会改的不想看,不会改的看不懂</p>
<p>为了不耽误各位的时间,就不要来找我要主题了,最后特别感谢大家对我魔改的肯定</p>
<h2 id="主题优化">主题优化</h2>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡,这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>在主题还是typecho版本的时候,有博友反馈pc端的评论弹幕很卡</p>
<p>这次特地重写了弹幕逻辑,各位来访的朋友,是不是感觉很丝滑呢</p>
<p>
<img data-lazy-src="/pics/hugo/migrate-to-hugo/image-20240811222643740.png" alt="image-20240811222643740" class="lazyload"></p>
<p>目前主题还是雏形,主题还在开发中,更多功能,敬请期待</p>
<p>主题还在开发中,如果访问期间遇到bug请F5强制刷新缓存</p>
<h2 id="特别感谢">特别感谢</h2>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以下排名不分先后)</p>
<p>hugo 官方
<p>Hugo 官方
<a
href="/tiaozhuan/index.html?target=aHR0cHM6Ly9nb2h1Z28uaW8%3d"
@@ -99,6 +99,7 @@ https://qq.md</a></p>
target="_blank"
>
https://likaijian.com</a></p>
<p>特别感谢主题开发期间提供帮助的博友以及开发者(以上排名不分先后)</p>
]]></content:encoded>
</item>
@@ -163,12 +164,12 @@ https://likaijian.com</a></p>
https://github.com/instantpage/instant.page</a></p>
<p>项目的介绍这样写到</p>
<h2 id="pc端">PC端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
</span></span><span style="display:flex;"><span>另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
</span></span><span style="display:flex;"><span>您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</span></span></code></pre></div><h2 id="移动端">移动端</h2>
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-markdown" data-lang="markdown"><span style="display:flex;"><span>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</span></span></code></pre></div><p>
<pre tabindex="0"><code>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
</code></pre><h2 id="移动端">移动端</h2>
<pre tabindex="0"><code>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
</code></pre><p>
<img data-lazy-src="/pics/2024/03/4028544490.png" alt="" class="lazyload"></p>
<p>汉译过来大概意思就是,当鼠标即将悬停到a标签的之前,对该链接进行预加载,提高访问速度</p>
<p>因为之前有同学反馈我的博客点击文章加载有些慢,于是乎说干就干,项目很简单,如需上手,直接在body标签之前加入一行js代码即可</p>
+3 -3
View File
@@ -6,10 +6,10 @@
uk-scrollspy="target: > .cf-article-item; cls: uk-animation-fade; delay: 0"></div>
</div>
<script>
// 定义几个全局变量
let UserConfig = {
// 定义几个全局变量
let UserConfig = {
// 填写你的api地址
private_api_url: 'https://circle.usj.cc/',
private_api_url: 'https://fc.5b2.cn/',
// 点击加载更多时,一次最多加载几篇文章,默认10
page_turning_number: 10,
// 头像加载失败时,默认头像地址
+9 -2
View File
@@ -9,6 +9,14 @@
<div class="post">
<div class="time">{{ .Date.Format "January 2, 2006" }}</div>
<a href="{{ .Permalink }}">{{ .Title }}</a>
<!-- 计算每篇文章的发布时间与当前时间的差值 -->
{{ $publishDate := .Date }}
{{ $currentTime := now }}
{{ $timeDiff := div (sub $currentTime.Unix $publishDate.Unix) 3600 }}
<!-- 判断发布时间是否小于 48 小时 -->
{{ if lt $timeDiff 48 }}
<span class="new-post-message"></span>
{{ end }}
</div>
{{ end }}
</div>
@@ -25,7 +33,6 @@
<a class="prev" title="上一页" href="{{ $paginator.Prev.URL }}">上一页</a>
{{ end }}
</li>
</ul>
</div>
{{ end }}
{{ end }}
+1 -1
View File
@@ -1157,7 +1157,7 @@ input[type=submit] {
/*新文章提醒样式*/
.new-post-message {
content: '';
background: url(https://usj.cc/usr/uploads/2023/01/1457247750.png) no-repeat;
background: url(https://usj.cc/pics/2023/01/1457247750.png) no-repeat;
width: 26px;
height: 14px;
background-size: contain;
+20
View File
@@ -269,6 +269,26 @@
"邹江博客",
"https://www.zoujiang.com",
"https://www.zoujiang.com/logo.jpg"
],
[
"森木志",
"https://oxxx.cn",
"https://gravatar.webp.se/avatar/5a076aa876b435fe788c8eeda004e9ec"
],
[
"土拨许",
"https://zhuo.re",
"https://cravatar.cn/avatar/126bbc02f1aef6228805d330648d9aa1"
],
[
"Jdeal",
"https://www.jdeal.cn",
"https://qn.jdeal.cn/file/favicon.ico"
],
[
"优世界",
"https://usj.cc",
"https://usj.cc/favicon.ico"
]
]
}