8.11
This commit is contained in:
1 parent
78a6cc46cd
commit
e86aebf49b
86 files changed
+1064
-391
No files matched your search
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<div class="post">
|
||||
<div class="time">August 11, 2024</div>
|
||||
<a href="https://usj.cc/post/migrate-to-hugo/">迁移博客至hugo</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">April 5, 2024</div>
|
||||
<a href="https://usj.cc/post/1287/">主机配置单</a>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/1243/">家乡随拍</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">July 16, 2023</div>
|
||||
<a href="https://usj.cc/post/1223/">襄阳唐城</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/92/">记录篇:将笔记本联想小新pro13网卡由螃蟹网卡换成AX210网卡</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">August 22, 2022</div>
|
||||
<a href="https://usj.cc/post/87/">生活篇:温馨提示假期余额不足,浅浅总结一下这个暑假</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/74/">2022,致我的春节回忆录</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">December 22, 2021</div>
|
||||
<a href="https://usj.cc/post/40/">放假之前最后一次的照片合集,再见啦!理工</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/11/">我想,这是一个我人生中最特殊的中秋国庆节</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">September 4, 2021</div>
|
||||
<a href="https://usj.cc/post/4/">2021暑假总结,记录一下这个充实的暑假</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/69/">再次投资科目二,科目二花了400,希望19号一把过吧</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">May 16, 2021</div>
|
||||
<a href="https://usj.cc/post/45/">双休日襄阳游记,与朋友一起,终究还是遗憾而归</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/60/">祝母校越办越好</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">December 27, 2020</div>
|
||||
<a href="https://usj.cc/post/57/">期末倒计时开始</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
@@ -89,11 +94,6 @@
|
||||
<a href="https://usj.cc/post/51/">双节快乐!家与国撞了个满怀</a>
|
||||
</div>
|
||||
|
||||
<div class="post">
|
||||
<div class="time">July 7, 2020</div>
|
||||
<a href="https://usj.cc/post/50/">高考加油,相信自己</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</article>
|
||||
<ul class="pagination">
|
||||
|
||||
@@ -69,6 +69,11 @@
|
||||
<div class="post-list section">
|
||||
|
||||
|
||||
<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>
|
||||
|
||||
@@ -26,21 +26,18 @@
|
||||
https://github.com/instantpage/instant.page</a></p>
|
||||
<p>项目的介绍这样写到</p>
|
||||
<h2 id="pc端">PC端</h2>
|
||||
<pre><code>在用户单击链接之前,他们会将鼠标悬停在该链接上。当用户悬停 65 毫秒时,他们有二分之一的机会点击该链接,因此 instant.page此时开始预加载,平均为页面预加载留下超过 300 毫秒的时间。
|
||||
另一种选择是在用户开始按下鼠标时加载页面而不进行预加载。这使得未使用的请求为零,同时仍然将页面加载平均提高了 80 毫秒。
|
||||
您还可以在悬停时或链接可见时进行预加载,并在用户开始按下鼠标时触发点击,从而使您的页面成为世界上最快的页面。
|
||||
</code></pre>
|
||||
<h2 id="移动端">移动端</h2>
|
||||
<pre><code>用户在释放之前开始触摸显示屏,平均留出90 毫秒的时间来预加载页面。
|
||||
</code></pre>
|
||||
<p>
|
||||
<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>
|
||||
<img data-lazy-src="/pics/2024/03/4028544490.png" alt="" class="lazyload"></p>
|
||||
<p>汉译过来大概意思就是,当鼠标即将悬停到a标签的之前,对该链接进行预加载,提高访问速度</p>
|
||||
<p>因为之前有同学反馈我的博客点击文章加载有些慢,于是乎说干就干,项目很简单,如需上手,直接在body标签之前加入一行js代码即可</p>
|
||||
<p>代码如下</p>
|
||||
<pre><code><script src="//instant.page/5.2.0" type="module" integrity="sha384-jnZyxPjiipYXnSU0ygqeac2q7CVYMbh84q0uHVRRxEtvFPiQYbXWUorga2aqZJ0z"></script>
|
||||
</code></pre>
|
||||
<p>
|
||||
<div class="highlight"><pre tabindex="0" style="background-color:#f8f8f8;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-js" data-lang="js"><span style="display:flex;"><span><span style="color:#ce5c00;font-weight:bold"><</span><span style="color:#000">script</span> <span style="color:#000">src</span><span style="color:#ce5c00;font-weight:bold">=</span><span style="color:#4e9a06">"//instant.page/5.2.0"</span> <span style="color:#000">type</span><span style="color:#ce5c00;font-weight:bold">=</span><span style="color:#4e9a06">"module"</span> <span style="color:#000">integrity</span><span style="color:#ce5c00;font-weight:bold">=</span><span style="color:#4e9a06">"sha384-jnZyxPjiipYXnSU0ygqeac2q7CVYMbh84q0uHVRRxEtvFPiQYbXWUorga2aqZJ0z"</span><span style="color:#ce5c00;font-weight:bold">><</span><span style="color:#a40000">/script></span>
|
||||
</span></span></code></pre></div><p>
|
||||
<img data-lazy-src="/pics/2024/03/1392231476.png" alt="" class="lazyload"></p>
|
||||
<p>如上截图所示,当鼠标即将点击到文章链接,instant.page会对文章链接执行预加载,从而提高页面渲染速度</p>
|
||||
<p>各位来访的朋友,有没有觉得速度比之前更快呢</p>
|
||||
|
||||
Reference in new issue
Block a user