zqlit/blog
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化一下博客的性能

Browse Source
This commit is contained in:
zqlit committed 2026-05-20 14:33:05 +08:00
1 parent 15421ff0ac
commit 427b17d7a0
24 files changed
+2045 -148
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

GitHubblog.tmp-links.html
+536
View File
@@ -0,0 +1,536 @@
<!DOCTYPE html>
<html lang="zh-cn">
<head><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1316&amp;path=livereload" data-no-instant defer></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>友链</title>
<meta name="description" content="" />
<link rel="canonical" href="http://localhost:1316/links.html" /><meta name="keywords" content="大学,教程,blog,优世界,优设计,博客,大学生博客,生活,文案" />
<meta property="og:title" content="友链" />
<meta property="og:description" content="" />
<meta property="og:type" content="article" />
<meta property="og:url" content="http://localhost:1316/links.html" />
<meta property="og:site_name" content="优世界" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="友链" />
<meta name="twitter:description" content="" />
<link rel="alternate" type="application/rss+xml" title="优世界" href="/rss.xml">
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<script async src="https://019e3dec-3312-7873-862a-3f56ac99ea83.spst2.com/ustat.js"></script>
<script>
(function () {
try {
var theme = localStorage.getItem('theme');
if (!theme) {
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
theme = 'dark';
} else {
theme = 'light';
}
}
document.documentElement.setAttribute('data-theme', theme);
if (window.matchMedia) {
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
if (!localStorage.getItem('theme')) {
var newTheme = event.matches ? "dark" : "light";
document.documentElement.setAttribute('data-theme', newTheme);
}
});
}
} catch (e) {}
})();
</script>
<link rel="preload" href="/font/zql-v2.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="/font/remixicon.woff2" as="font" type="font/woff2" crossorigin>
<script>
window.siteConfig = {
artalk: {
server: "https:\/\/artalk.usj.cc",
site: "优世界",
emoticons: "http:\/\/localhost:1316\/emotion\/OwO.json",
gravatar: "https:\/\/cravatar.cn\/avatar\/"
},
author: {
avatar: "\/image\/avatar\/tx7.jpg",
description: "不以物喜，不以己悲"
},
barrage: {
enableHitokoto: true ,
hitokotoUrl: "https:\/\/v1.hitokoto.cn?c=a\u0026c=b\u0026c=c\u0026c=d\u0026c=i"
}
};
</script>
<link rel="stylesheet" href="/css/style.min.7201c0e9ef7fa574d6fbab1efcb309790f11bbf063b86f0d8d36527afe7d209b.css">
<link rel="stylesheet" href="/css/libs/Artalk.min.c18a4adffe1319c3471e50565ff505ca8ca75eaf46d5661085de4918f94d6b4c.css"><style>
body, [data-theme="dark"] body {
background-image: url('/image/background/deno.webp') !important;
background-size: contain !important;
background-repeat: round !important;
background-position: center !important;
background-attachment: fixed !important;
}
</style><style>
@media only screen and (max-width: 768px) {
.items {
grid-template-columns: repeat(1, 1fr) !important;
grid-gap: 10px;
}
.link-des,.link-name{
right: 13px;
}
}
.items {
width: 100%;
height: 100%;
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 10px;
justify-content: space-between;
}
.item-box {
background-color: white;
border-radius: 5px;
padding: 8px;
height: 300px;
box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
}
.website-img {
margin: 0 auto;
width: 90%;
}
.website-img img {
width: 100%;
height: 150px;
object-fit: contain;
}
.website-go-button {
margin: 0 auto;
width: 95%;
border-radius: 5px;
font-size: 14px;
padding: 5px;
text-align: center;
background-color: black;
color: white;
}
.link-info {
padding: 8px;
width: 100%;
height: 90px;
display: flex;
justify-content: center;
align-items: center;
}
.link-avatar {
width: 40%;
display: flex;
align-items: center;
}
.link-avatar img {
position: relative;
left: 5px;
width: 50px;
height: 50px;
}
.link-text-main {
width: 55%;
display: flex;
flex-direction: column;
}
.link-name {
position: relative;
right: 10px;
bottom: 5px;
width: 100%;
height: 50%;
font-weight: 600;
}
.link-des {
position: relative;
right: 10px;
top: 1px;
width: 100%;
height: 50%;
}
</style>
<script src="/js/instantpage.min.js" type="module" defer></script>
<script>console.log("\n %c Amigo Theme %c https://usj.cc \n", "color: #fadfa3; background: #030307; padding:3px; font-size:12px;", "color: #ffffff;background: #16171a; padding: 3px; font-size: 12px;");</script>
<meta name="template" content="Amigo" />
</head>
</head>
<body>
<script>
window.barrageConfig = {
enableHitokoto: true ,
hitokotoUrl: "https:\/\/v1.hitokoto.cn?c=a\u0026c=b\u0026c=c\u0026c=d\u0026c=i",
hitokotoAvatar: "\/image\/avatar\/tx7.jpg"
};
</script>
<div class="barrager"></div>
<div class="main">
<div class="container">
<div class="header">
<div class="header-top">
<div class="header-avatar load-memos-editor" id="theme-toggle-avatar">
<img src="/image/avatar/tx7.jpg" class="blog-img" width="80" height="80" alt="优世界" decoding="async" fetchpriority="high" />
<div class="avatar-theme-tip">
点击头像切换昼夜
</div>
</div>
<div class="header-info">
<div class="header-social ">
<a href="https://github.com/zqlit" title="GitHub" target="_blank"><i class="ri-github-fill"></i></a>
<a href="#" title="我的主页" target="_blank"><i class="ri-at-line"></i></a>
<a href="/rss.xml" title="Rss订阅" target="_blank"><i class="ri-rss-fill"></i></a>
</div>
<div class="header-bio ">不以物喜，不以己悲</div>
</div>
</div>
<nav class="header-menu">
<ul class="flat">
<li class="active "><a href="/">首页</a></li>
<li class="active "><a href="/about.html">关于</a></li>
<li class="active "><a href="/circles.html">友圈</a></li>
<li class="active "><a href="/comment.html">留言</a></li>
<li class="active "><a href="/archives.html">归档</a></li>
<li class="active "><a href="/links.html">友链</a></li>
</ul>
</nav>
</div>
<div id="pjax-wrapper" style="position: relative; min-height: 50vh;">
<div id="pjax-container">
<style>
.links ul>li {
position: relative;
padding-left: 1.75em;
}
.links a {
color: var(--link-color-light);
font-weight: 500;
text-decoration: none;
}
.links li {
margin-top: .5em;
margin-bottom: .5em;
}
.links ul>li:before {
content: "";
position: absolute;
background-color: #d1d5db;
border-radius: 50%;
width: .375em;
height: .375em;
top: .6875em;
left: .25em;
}
.url-name {
position: relative;
display: inline-block;
}
.url-name::before {
content: "";
position: absolute;
height: 12px;
bottom: 3px;
left: -4px;
z-index: -1;
background-color: #5d5d5d;
opacity: .3;
transform: skew(-35deg);
transition: opacity .2s ease;
border-radius: 3px 8px 10px 6px;
transition: 0.1s ease background-color;
width: 112%;
}
.url-name:hover::before {
opacity: 0.5;
}
[data-theme="dark"] .links a {
color: var(--link-color-dark);
}
[data-theme="dark"] .url-name::before {
background-color: #e5e7eb;
opacity: 0.18;
}
[data-theme="dark"] .url-name:hover::before {
opacity: 0.35;
}
</style>
<div class="post-content" itemprop="articleBody">
<div class="links">
<ul id="links-list" uk-scrollspy="target: > li; cls: uk-animation-slide-bottom-small; delay: 50">
</ul>
</div>
</div>
<script>
(function() {
var list = document.getElementById('links-list');
if (!list) return;
var CACHE_KEY = 'friend-links-v1';
var CACHE_OPTIONS = {
version: 2,
softTtl: 6 * 60 * 60 * 1000,
hardTtl: 24 * 60 * 60 * 1000,
validate: function(data) {
return !!data && Array.isArray(data.links);
}
};
function escapeHtml(value) {
return String(value || '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#39;');
}
function renderState(message, className) {
list.innerHTML = '<li class="' + className + '">' + escapeHtml(message) + '</li>';
}
function renderLinks(links) {
if (!Array.isArray(links) || links.length === 0) {
renderState('暂无友链数据', 'links-empty');
return;
}
var html = '';
links.forEach(function(l) {
html += '<li><a href="' + escapeHtml(l.url) + '" class="url-name" target="_blank" rel="noopener noreferrer">' + escapeHtml(l.name) + '</a><span style="margin-left: 13px;">' + escapeHtml(l.description || '') + '</span></li>';
});
list.innerHTML = html;
}
function logCache(event, payload) {
if (window.BrowserCache && typeof window.BrowserCache.log === 'function') {
window.BrowserCache.log('[LinksCache][' + event + ']', payload);
}
}
function fetchLinks() {
logCache('fetch', {
key: window.BrowserCache ? window.BrowserCache.buildKey(CACHE_KEY) : CACHE_KEY,
softTtl: window.BrowserCache ? window.BrowserCache.formatDuration(CACHE_OPTIONS.softTtl) : CACHE_OPTIONS.softTtl,
hardTtl: window.BrowserCache ? window.BrowserCache.formatDuration(CACHE_OPTIONS.hardTtl) : CACHE_OPTIONS.hardTtl
});
return fetch('https://rssapi.usj.cc/api/links')
.then(function(res) {
if (!res.ok) throw new Error('Failed to fetch links');
return res.json();
})
.then(function(data) {
var links = Array.isArray(data.links) ? data.links : [];
var payload = { links: links };
window.BrowserCache.write(CACHE_KEY, CACHE_OPTIONS, payload);
return payload;
});
}
var cached = window.BrowserCache && window.BrowserCache.read(CACHE_KEY, CACHE_OPTIONS);
if (cached) {
logCache('render', {
key: cached.key,
age: cached.ageText,
isFresh: cached.isFresh,
softTtl: cached.softTtlText,
hardTtl: cached.hardTtlText
});
renderLinks(cached.data.links);
if (cached.isFresh) {
return;
}
} else {
renderState('友链加载中...', 'links-loading');
}
fetchLinks()
.then(function(payload) {
renderLinks(payload.links);
})
.catch(function(err) {
if (window.BrowserCache && window.BrowserCache.isDebug && window.BrowserCache.isDebug()) {
console.error('Links Error:', err);
}
if (!cached) {
renderState('友链加载失败，请稍后刷新重试', 'links-error');
}
});
})();
</script>
</div>
</div>
<div class="footer">
<nav class="nav" style="clear: both;">
© 2019 - 2026
<br>
<a href="https://beian.miit.gov.cn/" target="_blank"><span style="color:#999999;">鄂ICP备2022015735号-1</span></a>
<br>
本站由<a href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral" target="blank" title="又拍云"
style="display:inline-block;text-decoration:none;height:20px;line-height:20px;">
<span style="color: var(--contentColor);font-weight: 700;">又拍云CDN</span>
</a>提供CDN加速服务
<br>
</nav>
</div>
</div>
</div>
<div class="floating-tools">
<a href="javascript:;" id="search-btn" title="搜索文章">
<i class="ri-search-line"></i>
</a>
<a href="javascript:;" id="theme-toggle" title="切换主题">
<i class="ri-sun-line"></i>
</a>
<a href="#Comments" id="to-comments" title="跳转评论">
<i class="ri-chat-2-line"></i>
</a>
<a href="#" id="back-to-top" title="返回顶部">
<i class="ri-arrow-up-line"></i>
</a>
</div>
<div id="search-modal" class="search-modal">
<div class="search-modal-content">
<div class="search-header">
<h3>搜索文章</h3>
<span class="close-search">&times;</span>
</div>
<div class="search-body">
<div class="search-input-wrapper">
<input type="text" id="search-input" placeholder="输入关键词搜索..." autocomplete="off">
<button id="search-submit"><i class="ri-search-line"></i></button>
</div>
<div id="search-results" class="search-results">
<p class="search-tip">输入关键词并回车进行搜索</p>
</div>
</div>
</div>
</div>
<script defer src="/js/bundle.min.ca22314448750e3cd87573167443c4f61447dd8c77fdb2a8ecf962e6e770a7b7.js"></script>
<script>
window.enableInfiniteScroll = false ;
</script>
<script async src="/js/bsz.js"></script>
</body>
</html>