mayx/pages
1
0
Fork 0
mirror of https://codeberg.org/mayx/pages synced 2026-01-02 02:03:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Mayx
2025-12-31 16:00:29 +00:00
commit 3688f93d5d
310 changed files with 93400 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

404
2025/04/04/search.html Normal file
View File

@@ -0,0 +1,404 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Begin Jekyll SEO tag v2.8.0 -->
<title>最近对博客搜索功能的优化记录 | Mayx的博客</title>
<meta name="generator" content="Jekyll v3.9.5" />
<meta property="og:title" content="最近对博客搜索功能的优化记录" />
<meta name="author" content="mayx" />
<meta property="og:locale" content="zh_CN" />
<meta name="description" content="看看其他的博客也会有新的灵感啊～" />
<meta property="og:description" content="看看其他的博客也会有新的灵感啊～" />
<meta property="og:site_name" content="Mayx的博客" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2025-04-04T00:00:00+08:00" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="最近对博客搜索功能的优化记录" />
<meta name="google-site-verification" content="huTYdEesm8NaFymixMNqflyCp6Jfvd615j5Wq1i2PHc" />
<meta name="msvalidate.01" content="0ADFCE64B3557DC4DC5F2DC224C5FDDD" />
<meta name="yandex-verification" content="fc0e535abed800be" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"mayx"},"dateModified":"2025-04-04T00:00:00+08:00","datePublished":"2025-04-04T00:00:00+08:00","description":"看看其他的博客也会有新的灵感啊～","headline":"最近对博客搜索功能的优化记录","mainEntityOfPage":{"@type":"WebPage","@id":"/2025/04/04/search.html"},"publisher":{"@type":"Organization","logo":{"@type":"ImageObject","url":"https://avatars0.githubusercontent.com/u/17966333"},"name":"mayx"},"url":"/2025/04/04/search.html"}</script>
<!-- End Jekyll SEO tag -->
<link rel="canonical" href="https://mabbs.github.io/2025/04/04/search.html" />
<link type="application/atom+xml" rel="alternate" href="/atom.xml" title="Mayx的博客" />
<link rel="alternate" type="application/rss+xml" title="Mayx的博客(RSS)" href="/rss.xml" />
<link rel="alternate" type="application/json" title="Mayx的博客(JSON Feed)" href="/feed.json" />
<link rel="stylesheet" href="/assets/css/style.css?v=1767196818" />
<!--[if !IE]> -->
<link rel="stylesheet" href="/Live2dHistoire/live2d/css/live2d.css" />
<!-- <![endif]-->
<link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="Mayx的博客" />
<link rel="webmention" href="https://webmention.io/mabbs.github.io/webmention" />
<link rel="pingback" href="https://webmention.io/mabbs.github.io/xmlrpc" />
<link rel="preconnect" href="https://summary.mayx.eu.org" crossorigin="anonymous" />
<link rel="prefetch" href="https://www.blogsclub.org/badge/mabbs.github.io" as="image" />
<link rel="blogroll" type="text/xml" href="/blogroll.opml" />
<link rel="me" href="https://github.com/Mabbs" />
<script src="/assets/js/jquery.min.js"></script>
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.3/jquery.xdomainrequest.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
var lastUpdated = new Date("Thu, 01 Jan 2026 00:00:18 +0800");
var BlogAPI = "https://summary.mayx.eu.org";
</script>
<script src="/assets/js/main.js"></script>
<!--[if !IE]> -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async="async" src="https://www.googletagmanager.com/gtag/js?id=UA-137710294-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-137710294-1');
</script>
<script src="/assets/js/instant.page.js" type="module"></script>
<!-- <![endif]-->
</head>
<body>
<!--[if !IE]> --><noscript><marquee style="top: -15px; position: relative;"><small>发现当前浏览器没有启用JavaScript，这不影响你的浏览，但可能会有一些功能无法使用……</small></marquee></noscript><!-- <![endif]-->
<!--[if IE]><marquee style="top: -15px; position: relative;"><small>发现当前浏览器为Internet Explorer，这不影响你的浏览，但可能会有一些功能无法使用……</small></marquee><![endif]-->
<div class="wrapper">
<header class="h-card">
<h1><a class="u-url u-uid p-name" rel="me" href="/">Mayx的博客</a></h1>
<img src="https://avatars0.githubusercontent.com/u/17966333" fetchpriority="high" class="u-photo" alt="Logo" style="width: 90%; max-width: 300px; max-height: 300px;" />
<p class="p-note">Mayx's Home Page</p>
<form action="/search.html">
<input type="text" name="keyword" id="search-input-all" placeholder="Search blog posts.." />&#160;<input type="submit" value="搜索" />
</form>
<br />
<p class="view"><a class="u-url" href="/Mabbs/">About me</a></p>
<ul class="downloads">
<li style="width: 270px; border-right: none;"><a href="/MayxBlog.tgz">Download <strong>TGZ File</strong></a></li>
</ul>
</header>
<section class="h-entry">
<small><time class="date dt-published" datetime="2025-04-04T00:00:00+08:00">4 April 2025</time> - 字数统计：3692 - 阅读大约需要12分钟 - Hits: <span id="/2025/04/04/search.html" class="visitors">Loading...</span></small>
<h1 class="p-name">最近对博客搜索功能的优化记录</h1>
<p class="view">by <a class="p-author h-card" href="//github.com/Mabbs">mayx</a></p>
<div id="outdate" style="display:none;">
<hr /><p>
这是一篇创建于 <span id="outime"></span> 天前的文章，其中的信息可能已经有所发展或是发生改变。
</p>
</div>
<script>
daysold = Math.floor((new Date().getTime() - new Date("Fri, 04 Apr 2025 00:00:00 +0800").getTime()) / (24 * 60 * 60 * 1000));
if (daysold > 90) {
document.getElementById("outdate").style.display = "block";
document.getElementById("outime").innerHTML = daysold;
}
</script>
<hr />
<b>AI摘要</b>
<p id="ai-output">这篇文章记录了作者对博客搜索功能进行优化的过程。起因是作者在搜索使用同样模板的博客时，发现许多结果是简历或作品集，而非博客。作者通过搜索关键词和标签，受到其他博主的启发，决定改进搜索功能，使其能够筛选出带有特定标签的文章，并添加了高亮关键词的标记。此外，作者还实现了随机跳转文章、文章标题锚链接以及链接到原始Markdown文件等功能，强调了博客代码和网站功能对于展示个人技术的重要性。整个过程中，作者在借鉴他人经验的同时，也表达了对自我创新和个性化网站设计的重视。</p>
<hr />
<ul><li><a href="#起因">起因</a></li><li><a href="#使用标签作为关键词进行搜索">使用标签作为关键词进行搜索</a></li><li><a href="#搜索后使用高亮标记关键词">搜索后使用高亮标记关键词</a></li><li><a href="#近期的其他修改">近期的其他修改</a><ul><li><a href="#随机跳转文章">随机跳转文章</a></li><li><a href="#给文章内标题添加锚链接">给文章内标题添加锚链接</a></li><li><a href="#添加能跳转到原始markdown的链接">添加能跳转到原始Markdown的链接</a></li></ul></li><li><a href="#感想">感想</a></li></ul>
<hr />
<main class="post-content e-content" role="main"><p>看看其他的博客也会有新的灵感啊～<!--more--></p>
<h1 id="起因">
<a href="#起因"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 起因
</h1>
<p>前段时间，我闲来无事在GitHub上搜和我使用相同模板<a href="https://github.com/pages-themes/minimal">minimal</a>的博客。但搜索结果中有许多人用这个模板制作的是简历或作品集，这让我有些失望。不过这倒也能理解，因为这个模版并不算博客模板，没有文章列表之类的代码，这些都只能自己写。当然多找找还是能找到一些的，毕竟这个模板在GitHub Pages中算是最受欢迎，至少符合大众的审美。像我就搜到了一个叫<a href="https://github.com/josehu07/josehu07.github.io">Guanzhou Hu的博客</a>，他对模板的样式做了不少的改动，而且改的还挺好看的，尤其是右上角的导航栏，看起来挺有意思，只是这个源代码……导航栏有点硬编码的感觉，我不是很喜欢这种实现方式……</p>
<h1 id="使用标签作为关键词进行搜索">
<a href="#使用标签作为关键词进行搜索"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 使用标签作为关键词进行搜索
</h1>
<p>之后我又看了看其他博客，看到了<a href="https://github.com/mhwalker/mhwalker.github.io">Matt Walker Blog</a>。他没有对模板做很多改动，只是把section元素变得更宽了，但是他没有改手机版自适应的样式，导致界面基本上没法在手机上查看。不过在他的首页中，我对他把文章标签放在文章列表这个操作非常感兴趣，因为每次我都有给文章打标签，但是几乎没什么用。他的标签点进去之后会跳转到该标签下的所有文章，我其实很早就想做这个功能了，但是在不用插件的情况下Jekyll基本上做不出来这种功能，因为没有插件的情况下是不能使用Liquid标签创建文件的，我看了下他的实现，原来是提前创建好的标签页面然后进行筛选的，这个实现我也不喜欢，这样的话我每次打标签都要新建一个标签对应的页面，这种事情不让程序做我会很不爽……（其实现在的GitHub Pages构建网站都是用的Actions了，完全可以自己写一个可以使用插件的Actions来进行构建，不过我也懒得折腾了🤣） </p><p>
要么还有一个选择，可以单独搞一个页面，里面有所有标签对应的文章，点击文章的标签之后使用锚链接定位到对应标签所在的位置。但这样会导致一个页面有可能有一堆相同的文章链接，结果这个页面比归档页面的链接还多，那就感觉有点糟糕了……</p><p>
不过我想起来以前做的<a href="/2021/07/23/search.html">博客全文搜索功能</a>，如果把标签作为关键词进行查询，那也能起到筛选出标签对应文章的作用吧？而且这样即使我没给那个文章打标签也能搜出来，其实也算不错的选择，另外自从我做出来那个全文搜索的功能之后也没用过几次，没有关键词的话也一时半会想不出来搜什么比较好。于是说做就做，直接把Matt Walker Blog那段在文章列表生成标签的代码复制过来，感觉好像还不错😆？ </p><p>
顺便我也把文章里面的标签也加了链接到搜索的功能，不过原来的代码用的是<code class="language-plaintext highlighter-rouge">.join</code>实现的，现在加上这个功能的话就只能老老实实用循环写了😥……</p>
<h1 id="搜索后使用高亮标记关键词">
<a href="#搜索后使用高亮标记关键词"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 搜索后使用高亮标记关键词
</h1>
<p>上面的标签搜索效果还不错，只是有些关键词搜完之后有点难发现。我搜索出来之后怎么证明搜到的内容里面一定有对应的关键词呢？虽然从程序的角度来说这是理所应当的事情，一定是有的数据才可能被搜到，但有时候不用Ctrl+F看一眼都不知道是哪里搜到了……所以我觉得应该像其他网站一样对搜到的内容用高亮进行标记。标记应该用什么呢？用样式也许不错，不过现在的H5标签里有一个叫mark的标签可以直接用，用这个标签包裹的内容背景颜色就会变成黄色，就像用荧光笔标记了一样，这样就不需要写样式了。 </p><p>
至于关键词用查询字符串传过去就好了，那我该怎么做呢？我用的搜索脚本叫<a href="https://github.com/christian-fei/Simple-Jekyll-Search">Simple-Jekyll-Search</a>，它的文档其实根本没有写怎么把搜索的请求传到模版里，还好它有个<a href="https://github.com/christian-fei/Simple-Jekyll-Search/blob/master/tests/Templater.test.js">关于模版的测试脚本</a>里面有写，有个query关键词可以把搜索内容给模版渲染出来，既然做了这个功能怎么不写在文档里😅，不过这个项目已经停止，也没法提出什么建议了…… </p><p>
这个功能听起来相当简单，我都懒得写了，这种简单的功能直接让AI写才对！于是我把需求告诉它，让它给我实现一份，于是这就是让AI给我写的高亮关键词的JS代码（经过了一点修改）：</p>
<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nx">$</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">urlParams</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">URLSearchParams</span><span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">search</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">keyword</span> <span class="o">=</span> <span class="nx">urlParams</span><span class="p">.</span><span class="kd">get</span><span class="p">(</span><span class="dl">'</span><span class="s1">kw</span><span class="dl">'</span><span class="p">)?.</span><span class="nx">trim</span><span class="p">();</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">keyword</span><span class="p">)</span> <span class="k">return</span><span class="p">;</span>
<span class="c1">// 转义正则表达式特殊字符，避免安全问题</span>
<span class="kd">const</span> <span class="nx">escapedKeyword</span> <span class="o">=</span> <span class="nx">keyword</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/</span><span class="se">[</span><span class="sr">.*+?^${}()|[</span><span class="se">\]\\]</span><span class="sr">/g</span><span class="p">,</span> <span class="dl">'</span><span class="se">\\</span><span class="s1">$&amp;</span><span class="dl">'</span><span class="p">);</span>
<span class="c1">// 创建不区分大小写的正则表达式（全局匹配）</span>
<span class="kd">const</span> <span class="nx">regex</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">RegExp</span><span class="p">(</span><span class="s2">`(</span><span class="p">${</span><span class="nx">escapedKeyword</span><span class="p">}</span><span class="s2">)`</span><span class="p">,</span> <span class="dl">'</span><span class="s1">gi</span><span class="dl">'</span><span class="p">);</span>
<span class="c1">// 递归遍历并高亮文本节点</span>
<span class="kd">const</span> <span class="nx">escapeHTML</span> <span class="o">=</span> <span class="nx">str</span> <span class="o">=&gt;</span> <span class="nx">str</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/</span><span class="se">[</span><span class="sr">&amp;&lt;&gt;"'</span><span class="se">]</span><span class="sr">/g</span><span class="p">,</span>
<span class="nx">tag</span> <span class="o">=&gt;</span> <span class="p">({</span>
<span class="dl">'</span><span class="s1">&amp;</span><span class="dl">'</span><span class="p">:</span> <span class="dl">'</span><span class="s1">&amp;amp;</span><span class="dl">'</span><span class="p">,</span>
<span class="dl">'</span><span class="s1">&lt;</span><span class="dl">'</span><span class="p">:</span> <span class="dl">'</span><span class="s1">&amp;lt;</span><span class="dl">'</span><span class="p">,</span>
<span class="dl">'</span><span class="s1">&gt;</span><span class="dl">'</span><span class="p">:</span> <span class="dl">'</span><span class="s1">&amp;gt;</span><span class="dl">'</span><span class="p">,</span>
<span class="dl">'</span><span class="s1">"</span><span class="dl">'</span><span class="p">:</span> <span class="dl">'</span><span class="s1">&amp;quot;</span><span class="dl">'</span><span class="p">,</span>
<span class="dl">"</span><span class="s2">'</span><span class="dl">"</span><span class="p">:</span> <span class="dl">'</span><span class="s1">&amp;#39;</span><span class="dl">'</span>
<span class="p">}[</span><span class="nx">tag</span><span class="p">]</span> <span class="o">||</span> <span class="nx">tag</span><span class="p">));</span>
<span class="kd">function</span> <span class="nx">highlightTextNodes</span><span class="p">(</span><span class="nx">element</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">$</span><span class="p">(</span><span class="nx">element</span><span class="p">).</span><span class="nx">contents</span><span class="p">().</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">nodeType</span> <span class="o">===</span> <span class="nx">Node</span><span class="p">.</span><span class="nx">TEXT_NODE</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">$this</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">text</span> <span class="o">=</span> <span class="nx">escapeHTML</span><span class="p">(</span><span class="nx">$this</span><span class="p">.</span><span class="nx">text</span><span class="p">());</span>
<span class="c1">// 使用正则替换并保留原始大小写</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">regex</span><span class="p">.</span><span class="nx">test</span><span class="p">(</span><span class="nx">text</span><span class="p">))</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">replaced</span> <span class="o">=</span> <span class="nx">text</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="nx">regex</span><span class="p">,</span> <span class="dl">'</span><span class="s1">&lt;mark&gt;$1&lt;/mark&gt;</span><span class="dl">'</span><span class="p">);</span>
<span class="nx">$this</span><span class="p">.</span><span class="nx">replaceWith</span><span class="p">(</span><span class="nx">replaced</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span>
<span class="k">this</span><span class="p">.</span><span class="nx">nodeType</span> <span class="o">===</span> <span class="nx">Node</span><span class="p">.</span><span class="nx">ELEMENT_NODE</span> <span class="o">&amp;&amp;</span>
<span class="o">!</span><span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">is</span><span class="p">(</span><span class="dl">'</span><span class="s1">script, style, noscript, textarea</span><span class="dl">'</span><span class="p">)</span>
<span class="p">)</span> <span class="p">{</span>
<span class="nx">highlightTextNodes</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">});</span>
<span class="p">}</span>
<span class="nx">$</span><span class="p">(</span><span class="dl">'</span><span class="s1">section</span><span class="dl">'</span><span class="p">).</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
<span class="nx">highlightTextNodes</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="p">});</span>
<span class="p">});</span>
</code></pre></div></div>
<p>（2025.04.28更新：解决了一个潜在的解析问题） </p><p>
我测试了一下，非常符合我的需求，各种情况都能按照我的预期工作，虽然说功能非常简单，但是能正常运行，AI写的还是挺不错的。</p>
<h1 id="近期的其他修改">
<a href="#近期的其他修改"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 近期的其他修改
</h1>
<p>除了对搜索功能的优化，我还做了些别的功能：</p>
<h2 id="随机跳转文章">
<a href="#随机跳转文章"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 随机跳转文章
</h2>
<p>前段时间我看到有其他人的博客增加了一个随机跳转文章的功能，不过他的博客是动态博客，实现也比较奇葩，是渲染页面时就已经决定好要随机的文章，也就是说无论用户想不想随便看看，程序都已经随机好了。当然用着静态博客的我来说，从原理上也做不到这一点，不过既然我之前在做<a href="/2024/10/01/suggest.html">相似文章推荐功能时</a>已经对搜索功能的数据进行了缓存，那么直接用缓存的内容直接随机就好了吧……所以就随便写了写，代码也极其简单：</p>
<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt">&lt;a</span> <span class="na">href=</span><span class="s">"javascript:getSearchJSON(function(data){window.location = data[Math.floor(Math.random()*data.length)].url})"</span><span class="nt">&gt;</span>Random<span class="nt">&lt;/a&gt;</span>
</code></pre></div></div>
<h2 id="给文章内标题添加锚链接">
<a href="#给文章内标题添加锚链接"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 给文章内标题添加锚链接
</h2>
<p>最近在修改我的博客的时候我更新了一下<a href="https://github.com/allejo/jekyll-toc">给文章生成目录的组件</a>，在这时候我想看看它还有什么有意思的组件可以用，然后就发现了<a href="https://github.com/allejo/jekyll-anchor-headings">jekyll-anchor-headings</a>，它可以像GitHub展示Markdown文件一样在标题上添加点击后就可以直接跳转到对应标题的锚链接，而且示例里也给出了怎么做<a href="https://github.com/allejo/jekyll-anchor-headings/wiki/Examples#github-style-octicon-links">可以像GitHub的风格</a>。看起来挺有意思，所以就给自己加上了😆。</p>
<h2 id="添加能跳转到原始markdown的链接">
<a href="#添加能跳转到原始markdown的链接"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 添加能跳转到原始Markdown的链接
</h2>
<p>在修改博客的时候我参考了一下Jekyll的官方文档，在这个时候发现了page.path这个变量。我想了一下这个变量可以用来链接到我的文章内容，然后就在文章标签位置的右侧加上了这个链接，为了能让它显示在右侧，我用的是<code class="language-plaintext highlighter-rouge">float: right</code>，但是这样会导致和文章标签不在同一行，查了一下才知道用了浮动就会强制将元素转换成块级元素，而文章标签用的是行内元素，所以对不齐，没办法就只能把这一整行都转换成块级元素了……于是代码如下：</p>
<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nt">&lt;span</span> <span class="na">style=</span><span class="s">"float: right;"</span><span class="nt">&gt;&lt;a</span> <span class="na">href=</span><span class="s">"{{ site.github.repository_url }}/tree/master/{{ page.path }}"</span><span class="nt">&gt;</span>查看原始文件<span class="nt">&lt;/a&gt;&lt;/span&gt;</span>
</code></pre></div></div>
<h1 id="感想">
<a href="#感想"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 感想
</h1>
<p>多看看其他人的博客看来也挺不错，可以看看其他人的想法，说不定就有可以参考的价值呢……不只是文章内容，网站本身的一些功能也是作者的想法啊……而对于那些只套别人模版，没什么自己的改动的博客，那就没什么意思了（当然不会代码的那就没办法了～）。有些人说博客中只有文章才是最重要的，但我觉得对于技术博客来说网站的代码也是展示自己的部分，所以折腾博客本身也是很重要的！</p></main>
<small style="display: block">tags: <a rel="category tag" class="p-category" href="/search.html?keyword=%E5%8D%9A%E5%AE%A2"><em>博客</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=%E6%90%9C%E7%B4%A2"><em>搜索</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=%E4%BC%98%E5%8C%96"><em>优化</em></a> <span style="float: right;"><a href="https://gitlab.com/mayx/mayx.gitlab.io/tree/master/_posts/2025-04-04-search.md">查看原始文件</a></span></small>
<h4 style="border-bottom: 1px solid #e5e5e5;margin: 2em 0 5px;">推荐文章</h4>
<p id="suggest-container">Loading...</p>
<script>
var suggest = $("#suggest-container");
$.get(BlogAPI + "/suggest?id=/2025/04/04/search.html&update=" + lastUpdated.valueOf(), function (data) {
if (data.length) {
getSearchJSON(function (search) {
suggest.empty();
var searchMap = {};
for (var i = 0; i < search.length; i++) {
searchMap[search[i].url] = search[i];
}
var tooltip = $('<div class="content-tooltip"></div>').appendTo('body').hide();
for (var j = 0; j < data.length; j++) {
var item = searchMap[data[j].id];
if (item) {
var link = $('<a href="' + item.url + '">' + item.title + '</a>');
var contentPreview = item.content.substring(0, 100);
if (item.content.length > 100) {
contentPreview += "……";
}
link.hover(
function(e) {
tooltip.text($(this).data('content'))
.css({
top: e.pageY + 10,
left: e.pageX + 10
})
.show();
},
function() {
tooltip.hide();
}
).mousemove(function(e) {
tooltip.css({
top: e.pageY + 10,
left: e.pageX + 10
});
}).data('content', contentPreview);
suggest.append(link);
suggest.append(' - ' + item.date + '<br />');
}
}
});
} else {
suggest.html("暂无推荐文章……");
}
});
</script>
<br />
<div class="pagination">
<span class="prev">
<a href="/2025/03/25/utm.html">
上一篇：在UTM中使用苹果虚拟化的各种尝试
</a>
</span>
<br />
<span class="next">
<a href="/2025/04/08/feed.html">
下一篇：如何使用JS通过订阅源查看文章？
</a>
</span>
</div>
<!--[if !IE]> -->
<link rel="stylesheet" href="/assets/css/gitalk.css">
<script src="/assets/js/gitalk.min.js"></script>
<div id="gitalk-container"></div>
<script>
var gitalk = new Gitalk({
clientID: '36557aec4c3cb04f7ac6',
clientSecret: 'ac32993299751cb5a9ba81cf2b171cca65879cdb',
repo: 'mabbs.github.io',
owner: 'Mabbs',
admin: ['Mabbs'],
id: '/2025/04/04/search', // Ensure uniqueness and length less than 50
distractionFreeMode: false, // Facebook-like distraction free mode
proxy: "https://cors-anywhere.mayx.eu.org/?https://github.com/login/oauth/access_token"
})
gitalk.render('gitalk-container')
</script>
<!-- <![endif]-->
</section>
<!--[if !IE]> -->
<div id="landlord" style="left:5px;bottom:0px;">
<div class="message" style="opacity:0"></div>
<canvas id="live2d" width="500" height="560" class="live2d"></canvas>
<div class="live_talk_input_body">
<form id="live_talk_input_form">
<div class="live_talk_input_name_body" >
<input type="checkbox" id="load_this" />
<input type="hidden" id="post_id" value="/2025/04/04/search.html" />
<label for="load_this">
<span style="font-size: 11px; color: #fff;">&#160;想问这篇文章</span>
</label>
</div>
<div class="live_talk_input_text_body">
<input name="talk" type="text" class="live_talk_talk white_input" id="AIuserText" autocomplete="off" placeholder="要和我聊什么呀？" />
<button type="submit" class="live_talk_send_btn" id="talk_send">发送</button>
</div>
</form>
</div>
<input name="live_talk" id="live_talk" value="1" type="hidden" />
<div class="live_ico_box" style="display:none;">
<div class="live_ico_item type_info" id="showInfoBtn"></div>
<div class="live_ico_item type_talk" id="showTalkBtn"></div>
<div class="live_ico_item type_music" id="musicButton"></div>
<div class="live_ico_item type_youdu" id="youduButton"></div>
<div class="live_ico_item type_quit" id="hideButton"></div>
<input name="live_statu_val" id="live_statu_val" value="0" type="hidden" />
<audio src="" style="display:none;" id="live2d_bgm" data-bgm="0" preload="none"></audio>
<input id="duType" value="douqilai" type="hidden" />
</div>
</div>
<div id="open_live2d">召唤伊斯特瓦尔</div>
<!-- <![endif]-->
<footer>
<p>
<small>Made with ❤ by Mayx<br />Last updated at 2026-01-01 00:00:18<br /> 总字数：614622 - 文章数：178 - <a href="/atom.xml" >Atom</a> - <a href="/README.html" >About</a></small>
</p>
</footer>
</div>
<script src="/assets/js/scale.fix.js"></script>
<!--[if !IE]> -->
<script src="/assets/js/main_new.js"></script>
<script src="/Live2dHistoire/live2d/js/live2d.js"></script>
<script src="/Live2dHistoire/live2d/js/message.js"></script>
<!-- <![endif]-->
</body>
</html>

325
2025/04/08/feed.html Normal file
View File

@@ -0,0 +1,325 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Begin Jekyll SEO tag v2.8.0 -->
<title>如何使用JS通过订阅源查看文章？ | Mayx的博客</title>
<meta name="generator" content="Jekyll v3.9.5" />
<meta property="og:title" content="如何使用JS通过订阅源查看文章？" />
<meta name="author" content="mayx" />
<meta property="og:locale" content="zh_CN" />
<meta name="description" content="懒得写代码？那就让AI写！" />
<meta property="og:description" content="懒得写代码？那就让AI写！" />
<meta property="og:site_name" content="Mayx的博客" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2025-04-08T00:00:00+08:00" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="如何使用JS通过订阅源查看文章？" />
<meta name="google-site-verification" content="huTYdEesm8NaFymixMNqflyCp6Jfvd615j5Wq1i2PHc" />
<meta name="msvalidate.01" content="0ADFCE64B3557DC4DC5F2DC224C5FDDD" />
<meta name="yandex-verification" content="fc0e535abed800be" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"mayx"},"dateModified":"2025-04-08T00:00:00+08:00","datePublished":"2025-04-08T00:00:00+08:00","description":"懒得写代码？那就让AI写！","headline":"如何使用JS通过订阅源查看文章？","mainEntityOfPage":{"@type":"WebPage","@id":"/2025/04/08/feed.html"},"publisher":{"@type":"Organization","logo":{"@type":"ImageObject","url":"https://avatars0.githubusercontent.com/u/17966333"},"name":"mayx"},"url":"/2025/04/08/feed.html"}</script>
<!-- End Jekyll SEO tag -->
<link rel="canonical" href="https://mabbs.github.io/2025/04/08/feed.html" />
<link type="application/atom+xml" rel="alternate" href="/atom.xml" title="Mayx的博客" />
<link rel="alternate" type="application/rss+xml" title="Mayx的博客(RSS)" href="/rss.xml" />
<link rel="alternate" type="application/json" title="Mayx的博客(JSON Feed)" href="/feed.json" />
<link rel="stylesheet" href="/assets/css/style.css?v=1767196818" />
<!--[if !IE]> -->
<link rel="stylesheet" href="/Live2dHistoire/live2d/css/live2d.css" />
<!-- <![endif]-->
<link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="Mayx的博客" />
<link rel="webmention" href="https://webmention.io/mabbs.github.io/webmention" />
<link rel="pingback" href="https://webmention.io/mabbs.github.io/xmlrpc" />
<link rel="preconnect" href="https://summary.mayx.eu.org" crossorigin="anonymous" />
<link rel="prefetch" href="https://www.blogsclub.org/badge/mabbs.github.io" as="image" />
<link rel="blogroll" type="text/xml" href="/blogroll.opml" />
<link rel="me" href="https://github.com/Mabbs" />
<script src="/assets/js/jquery.min.js"></script>
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.3/jquery.xdomainrequest.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
var lastUpdated = new Date("Thu, 01 Jan 2026 00:00:18 +0800");
var BlogAPI = "https://summary.mayx.eu.org";
</script>
<script src="/assets/js/main.js"></script>
<!--[if !IE]> -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async="async" src="https://www.googletagmanager.com/gtag/js?id=UA-137710294-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-137710294-1');
</script>
<script src="/assets/js/instant.page.js" type="module"></script>
<!-- <![endif]-->
</head>
<body>
<!--[if !IE]> --><noscript><marquee style="top: -15px; position: relative;"><small>发现当前浏览器没有启用JavaScript，这不影响你的浏览，但可能会有一些功能无法使用……</small></marquee></noscript><!-- <![endif]-->
<!--[if IE]><marquee style="top: -15px; position: relative;"><small>发现当前浏览器为Internet Explorer，这不影响你的浏览，但可能会有一些功能无法使用……</small></marquee><![endif]-->
<div class="wrapper">
<header class="h-card">
<h1><a class="u-url u-uid p-name" rel="me" href="/">Mayx的博客</a></h1>
<img src="https://avatars0.githubusercontent.com/u/17966333" fetchpriority="high" class="u-photo" alt="Logo" style="width: 90%; max-width: 300px; max-height: 300px;" />
<p class="p-note">Mayx's Home Page</p>
<form action="/search.html">
<input type="text" name="keyword" id="search-input-all" placeholder="Search blog posts.." />&#160;<input type="submit" value="搜索" />
</form>
<br />
<p class="view"><a class="u-url" href="/Mabbs/">About me</a></p>
<ul class="downloads">
<li style="width: 270px; border-right: none;"><a href="/MayxBlog.tgz">Download <strong>TGZ File</strong></a></li>
</ul>
</header>
<section class="h-entry">
<small><time class="date dt-published" datetime="2025-04-08T00:00:00+08:00">8 April 2025</time> - 字数统计：1589 - 阅读大约需要5分钟 - Hits: <span id="/2025/04/08/feed.html" class="visitors">Loading...</span></small>
<h1 class="p-name">如何使用JS通过订阅源查看文章？</h1>
<p class="view">by <a class="p-author h-card" href="//github.com/Mabbs">mayx</a></p>
<div id="outdate" style="display:none;">
<hr /><p>
这是一篇创建于 <span id="outime"></span> 天前的文章，其中的信息可能已经有所发展或是发生改变。
</p>
</div>
<script>
daysold = Math.floor((new Date().getTime() - new Date("Tue, 08 Apr 2025 00:00:00 +0800").getTime()) / (24 * 60 * 60 * 1000));
if (daysold > 90) {
document.getElementById("outdate").style.display = "block";
document.getElementById("outime").innerHTML = daysold;
}
</script>
<hr />
<b>AI摘要</b>
<p id="ai-output">这篇文章讲述了作者如何利用AI编写JavaScript代码，实现一个功能：在鼠标悬停在博客链接上时，通过RSS/Atom源预览链接的最新文章，且只显示标题和时间。过程中提到了跨域问题的解决方案（CORS代理），以及AI在编写代码时遇到的挑战，如遍历订阅源路径的效率问题和XSS安全风险，最终作者通过DeepSeek检查和修改确保了代码的可靠性。作者对AI自动编写代码的体验表示既方便又有趣，但也强调了人工监督在确保代码质量上的必要性。</p>
<hr />
<ul><li><a href="#起因">起因</a></li><li><a href="#让ai编写代码">让AI编写代码</a></li><li><a href="#感想">感想</a></li></ul>
<hr />
<main class="post-content e-content" role="main"><p>懒得写代码？那就让AI写！<!--more--></p>
<h1 id="起因">
<a href="#起因"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 起因
</h1>
<p>前段时间，我看到有些博客给自己的友链页面做了通过订阅源查看友链最近更新文章的功能，看起来挺有意思的，有点想整一个。不过对于我的博客来说，作为静态博客想要做到这样的功能估计没那么简单吧……毕竟一般的订阅软件需要隔段时间请求一下对应博客的订阅链接，然后再把结果存到数据库才行。但是我想了想，对我来说没必要做成订阅啊，我又不需要知道对应博客是什么时候更新的，只要在有人想知道的时候去请求一下订阅链接，然后展示出来就行，感觉似乎又没有那么复杂。 </p><p>
既然不复杂，那这个功能就让AI来做吧，正好前段时间有个朋友买了一个月的Devin.ai订阅，据说是可以自己调试代码，还能操作浏览器，而且代码基本上写出来就能用。我对这个挺感兴趣的，所以这次的功能就让它来写吧！</p>
<h1 id="让ai编写代码">
<a href="#让ai编写代码"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 让AI编写代码
</h1>
<p>既然是让AI来写，至少得把我的需求说清楚，所以首先我应该告诉它：</p>
<blockquote>
<p>创建一个JavaScript函数来实现<a href="/links.html">Links</a>表格中链接的RSS/Atom源预览。</p>
<ul>
<li>当鼠标悬停在表中的链接上时，检查该网站是否有RSS/Atom源，并将结果显示在一个浮动窗口中</li>
<li>在鼠标光标后的浮动窗口中显示提要中的5篇最新文章</li>
<li>在窗口中只包含标题和时间，不需要链接和内容</li>
<li>跳过所有不包含RSS/Atom源的链接，而不显示任何错误</li>
<li>当鼠标离开链接时，浮动预览应该消失</li>
</ul>
</blockquote>
<p>不过在正式编写之前，我还得考虑一下可行性，毕竟是很简单的功能，我不写但我不能不知道怎么写。首先让JS解析Feed数据也就是XML数据应该是很简单的事情，JS应该有自带的函数来实现这种功能。然后是获取数据，在JS中使用fetch就可以了，但是这里有个很重要的事情，浏览器请求其他网站存在跨域的问题，还好我之前在CF Workers上用<a href="https://github.com/Zibri/cloudflare-cors-anywhere">cloudflare-cors-anywhere</a>搭了个CORS代理： <a href="https://cors-anywhere.mayx.eu.org/">https://cors-anywhere.mayx.eu.org/</a> 。所以我应该在说明中给它说清楚：</p>
<blockquote>
<ul>
<li>如果存在源，请使用CORS代理：https://cors-anywhere.mayx.eu.org/ 获取并解析它</li>
</ul>
</blockquote>
<p>随后我就开始让它编写代码了。接下来就能看到AI在浏览器和编辑器中切换，不停的进行编写和调试，等了一段时间，它把第一版代码写好了。不过也许我说的不够清楚，这个CORS代理的用法和其他的CORS代理不太一样，代理链接和被代理的链接之间需要使用“?”分开，另外第一版我也没说清楚RSS/Atom源的链接在哪，所以它选择遍历常见的几种订阅源的路径，这样有点不太好，除了速度慢，对我的CORS代理消耗也比较大。所以我告诉它代理的正确用法，以及让它假设超链接中包含“data-feed”属性，其中包含订阅源的链接，并且随便挑了个网站拿给它作为示例。 </p><p>
随后就能看到它继续改改改，改了几次之后我把最后生成的JS复制到浏览器上执行了一下，效果还不错，于是就把它放到我的博客上了。 </p><p>
它的水平还是挺不错的，至少正确的实现了功能。不过我有点担心它的代码会不会不太可靠，毕竟要从其他网站上获取数据，得避免出现XSS之类的问题，于是我把代码丢给DeepSeek-R1让它检查了一下，果不其然Devin.ai写的代码似乎有XSS的隐患，如果链接列表中标题有html标签似乎就会解析（虽然我没试过），于是根据DeepSeek的提示修改了一下，增加了一个过滤特殊字符的函数，改完又放到博客上，最终的代码就是：<a href="/assets/js/rss-feed-preview.js">rss-feed-preview.js</a>。</p>
<h1 id="感想">
<a href="#感想"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 感想
</h1>
<p>让AI全自动写代码感觉还挺方便，有种当产品经理的感觉了🤣，像这种AI就是Agent吧，这也算是我头一次使用Agent了，感觉用起来还挺不错的。不过从这次尝试来看确实AI也有一定的局限性，像是直接写出来的代码可能存在一些安全性问题，除非单独让AI检查，不然很有可能会写出功能正常但是存在漏洞的代码，所以还是得人看着点，AI搞出事故可是<strong>不负责</strong>的啊😇～</p></main>
<small style="display: block">tags: <a rel="category tag" class="p-category" href="/search.html?keyword=JavaScript"><em>JavaScript</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=RSS"><em>RSS</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=Feed"><em>Feed</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=AI"><em>AI</em></a> <span style="float: right;"><a href="https://gitlab.com/mayx/mayx.gitlab.io/tree/master/_posts/2025-04-08-feed.md">查看原始文件</a></span></small>
<h4 style="border-bottom: 1px solid #e5e5e5;margin: 2em 0 5px;">推荐文章</h4>
<p id="suggest-container">Loading...</p>
<script>
var suggest = $("#suggest-container");
$.get(BlogAPI + "/suggest?id=/2025/04/08/feed.html&update=" + lastUpdated.valueOf(), function (data) {
if (data.length) {
getSearchJSON(function (search) {
suggest.empty();
var searchMap = {};
for (var i = 0; i < search.length; i++) {
searchMap[search[i].url] = search[i];
}
var tooltip = $('<div class="content-tooltip"></div>').appendTo('body').hide();
for (var j = 0; j < data.length; j++) {
var item = searchMap[data[j].id];
if (item) {
var link = $('<a href="' + item.url + '">' + item.title + '</a>');
var contentPreview = item.content.substring(0, 100);
if (item.content.length > 100) {
contentPreview += "……";
}
link.hover(
function(e) {
tooltip.text($(this).data('content'))
.css({
top: e.pageY + 10,
left: e.pageX + 10
})
.show();
},
function() {
tooltip.hide();
}
).mousemove(function(e) {
tooltip.css({
top: e.pageY + 10,
left: e.pageX + 10
});
}).data('content', contentPreview);
suggest.append(link);
suggest.append(' - ' + item.date + '<br />');
}
}
});
} else {
suggest.html("暂无推荐文章……");
}
});
</script>
<br />
<div class="pagination">
<span class="prev">
<a href="/2025/04/04/search.html">
上一篇：最近对博客搜索功能的优化记录
</a>
</span>
<br />
<span class="next">
<a href="/2025/04/22/ai-limit.html">
下一篇：关于LLM上限的探索
</a>
</span>
</div>
<!--[if !IE]> -->
<link rel="stylesheet" href="/assets/css/gitalk.css">
<script src="/assets/js/gitalk.min.js"></script>
<div id="gitalk-container"></div>
<script>
var gitalk = new Gitalk({
clientID: '36557aec4c3cb04f7ac6',
clientSecret: 'ac32993299751cb5a9ba81cf2b171cca65879cdb',
repo: 'mabbs.github.io',
owner: 'Mabbs',
admin: ['Mabbs'],
id: '/2025/04/08/feed', // Ensure uniqueness and length less than 50
distractionFreeMode: false, // Facebook-like distraction free mode
proxy: "https://cors-anywhere.mayx.eu.org/?https://github.com/login/oauth/access_token"
})
gitalk.render('gitalk-container')
</script>
<!-- <![endif]-->
</section>
<!--[if !IE]> -->
<div id="landlord" style="left:5px;bottom:0px;">
<div class="message" style="opacity:0"></div>
<canvas id="live2d" width="500" height="560" class="live2d"></canvas>
<div class="live_talk_input_body">
<form id="live_talk_input_form">
<div class="live_talk_input_name_body" >
<input type="checkbox" id="load_this" />
<input type="hidden" id="post_id" value="/2025/04/08/feed.html" />
<label for="load_this">
<span style="font-size: 11px; color: #fff;">&#160;想问这篇文章</span>
</label>
</div>
<div class="live_talk_input_text_body">
<input name="talk" type="text" class="live_talk_talk white_input" id="AIuserText" autocomplete="off" placeholder="要和我聊什么呀？" />
<button type="submit" class="live_talk_send_btn" id="talk_send">发送</button>
</div>
</form>
</div>
<input name="live_talk" id="live_talk" value="1" type="hidden" />
<div class="live_ico_box" style="display:none;">
<div class="live_ico_item type_info" id="showInfoBtn"></div>
<div class="live_ico_item type_talk" id="showTalkBtn"></div>
<div class="live_ico_item type_music" id="musicButton"></div>
<div class="live_ico_item type_youdu" id="youduButton"></div>
<div class="live_ico_item type_quit" id="hideButton"></div>
<input name="live_statu_val" id="live_statu_val" value="0" type="hidden" />
<audio src="" style="display:none;" id="live2d_bgm" data-bgm="0" preload="none"></audio>
<input id="duType" value="douqilai" type="hidden" />
</div>
</div>
<div id="open_live2d">召唤伊斯特瓦尔</div>
<!-- <![endif]-->
<footer>
<p>
<small>Made with ❤ by Mayx<br />Last updated at 2026-01-01 00:00:18<br /> 总字数：614622 - 文章数：178 - <a href="/atom.xml" >Atom</a> - <a href="/README.html" >About</a></small>
</p>
</footer>
</div>
<script src="/assets/js/scale.fix.js"></script>
<!--[if !IE]> -->
<script src="/assets/js/main_new.js"></script>
<script src="/Live2dHistoire/live2d/js/live2d.js"></script>
<script src="/Live2dHistoire/live2d/js/message.js"></script>
<!-- <![endif]-->
</body>
</html>

480
2025/04/22/ai-limit.html Normal file
View File

@@ -0,0 +1,480 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Begin Jekyll SEO tag v2.8.0 -->
<title>关于LLM上限的探索 | Mayx的博客</title>
<meta name="generator" content="Jekyll v3.9.5" />
<meta property="og:title" content="关于LLM上限的探索" />
<meta name="author" content="mayx" />
<meta property="og:locale" content="zh_CN" />
<meta name="description" content="还有什么是AI不能干的？" />
<meta property="og:description" content="还有什么是AI不能干的？" />
<meta property="og:site_name" content="Mayx的博客" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2025-04-22T00:00:00+08:00" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="关于LLM上限的探索" />
<meta name="google-site-verification" content="huTYdEesm8NaFymixMNqflyCp6Jfvd615j5Wq1i2PHc" />
<meta name="msvalidate.01" content="0ADFCE64B3557DC4DC5F2DC224C5FDDD" />
<meta name="yandex-verification" content="fc0e535abed800be" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"BlogPosting","author":{"@type":"Person","name":"mayx"},"dateModified":"2025-04-22T00:00:00+08:00","datePublished":"2025-04-22T00:00:00+08:00","description":"还有什么是AI不能干的？","headline":"关于LLM上限的探索","mainEntityOfPage":{"@type":"WebPage","@id":"/2025/04/22/ai-limit.html"},"publisher":{"@type":"Organization","logo":{"@type":"ImageObject","url":"https://avatars0.githubusercontent.com/u/17966333"},"name":"mayx"},"url":"/2025/04/22/ai-limit.html"}</script>
<!-- End Jekyll SEO tag -->
<link rel="canonical" href="https://mabbs.github.io/2025/04/22/ai-limit.html" />
<link type="application/atom+xml" rel="alternate" href="/atom.xml" title="Mayx的博客" />
<link rel="alternate" type="application/rss+xml" title="Mayx的博客(RSS)" href="/rss.xml" />
<link rel="alternate" type="application/json" title="Mayx的博客(JSON Feed)" href="/feed.json" />
<link rel="stylesheet" href="/assets/css/style.css?v=1767196818" />
<!--[if !IE]> -->
<link rel="stylesheet" href="/Live2dHistoire/live2d/css/live2d.css" />
<!-- <![endif]-->
<link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="Mayx的博客" />
<link rel="webmention" href="https://webmention.io/mabbs.github.io/webmention" />
<link rel="pingback" href="https://webmention.io/mabbs.github.io/xmlrpc" />
<link rel="preconnect" href="https://summary.mayx.eu.org" crossorigin="anonymous" />
<link rel="prefetch" href="https://www.blogsclub.org/badge/mabbs.github.io" as="image" />
<link rel="blogroll" type="text/xml" href="/blogroll.opml" />
<link rel="me" href="https://github.com/Mabbs" />
<script src="/assets/js/jquery.min.js"></script>
<!--[if lt IE 9]>
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-ajaxtransport-xdomainrequest/1.0.3/jquery.xdomainrequest.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<script>
var lastUpdated = new Date("Thu, 01 Jan 2026 00:00:18 +0800");
var BlogAPI = "https://summary.mayx.eu.org";
</script>
<script src="/assets/js/main.js"></script>
<!--[if !IE]> -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async="async" src="https://www.googletagmanager.com/gtag/js?id=UA-137710294-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-137710294-1');
</script>
<script src="/assets/js/instant.page.js" type="module"></script>
<!-- <![endif]-->
</head>
<body>
<!--[if !IE]> --><noscript><marquee style="top: -15px; position: relative;"><small>发现当前浏览器没有启用JavaScript，这不影响你的浏览，但可能会有一些功能无法使用……</small></marquee></noscript><!-- <![endif]-->
<!--[if IE]><marquee style="top: -15px; position: relative;"><small>发现当前浏览器为Internet Explorer，这不影响你的浏览，但可能会有一些功能无法使用……</small></marquee><![endif]-->
<div class="wrapper">
<header class="h-card">
<h1><a class="u-url u-uid p-name" rel="me" href="/">Mayx的博客</a></h1>
<img src="https://avatars0.githubusercontent.com/u/17966333" fetchpriority="high" class="u-photo" alt="Logo" style="width: 90%; max-width: 300px; max-height: 300px;" />
<p class="p-note">Mayx's Home Page</p>
<form action="/search.html">
<input type="text" name="keyword" id="search-input-all" placeholder="Search blog posts.." />&#160;<input type="submit" value="搜索" />
</form>
<br />
<p class="view"><a class="u-url" href="/Mabbs/">About me</a></p>
<ul class="downloads">
<li style="width: 270px; border-right: none;"><a href="/MayxBlog.tgz">Download <strong>TGZ File</strong></a></li>
</ul>
</header>
<section class="h-entry">
<small><time class="date dt-published" datetime="2025-04-22T00:00:00+08:00">22 April 2025</time> - 字数统计：4825 - 阅读大约需要15分钟 - Hits: <span id="/2025/04/22/ai-limit.html" class="visitors">Loading...</span></small>
<h1 class="p-name">关于LLM上限的探索</h1>
<p class="view">by <a class="p-author h-card" href="//github.com/Mabbs">mayx</a></p>
<div id="outdate" style="display:none;">
<hr /><p>
这是一篇创建于 <span id="outime"></span> 天前的文章，其中的信息可能已经有所发展或是发生改变。
</p>
</div>
<script>
daysold = Math.floor((new Date().getTime() - new Date("Tue, 22 Apr 2025 00:00:00 +0800").getTime()) / (24 * 60 * 60 * 1000));
if (daysold > 90) {
document.getElementById("outdate").style.display = "block";
document.getElementById("outime").innerHTML = daysold;
}
</script>
<hr />
<b>AI摘要</b>
<p id="ai-output">这篇文章主要探讨了作者对人工智能尤其是LLM（Large Language Models）在文本生成、超长文本分析和文章理解能力的观察。作者通过实例，如GPT-4的画图能力、AI在长文本处理上的局限、以及尝试使用AI进行文章分析和摘要的失败，揭示了LLM在处理大量信息和复杂逻辑代码时的上下文长度限制。作者认为这限制了AI的全局理解和替代人类的能力，但也提出了如果AI能自我调整权重以处理更长的上下文，可能有助于突破这一局限。此外，作者还分享了自己博客的内容和技术探索，展现了独立思考和对技术伦理的关注。</p>
<hr />
<ul><li><a href="#起因">起因</a></li><li><a href="#对于超长文本分析的探索">对于超长文本分析的探索</a><ul><li><a href="#使用ai摘要来解决问题">使用AI摘要来解决问题</a></li><li><a href="#技术浪人数字游民对一位博客作者的观察与评价">技术浪人，数字游民：对一位博客作者的观察与评价</a><ul><li><a href="#一技术为体思考为魂">一、技术为体，思考为魂</a></li><li><a href="#二独立反思带有一丝叛逆">二、独立、反思、带有一丝叛逆</a></li><li><a href="#三探索孤岛与技术乌托邦">三、探索孤岛与技术乌托邦</a></li><li><a href="#四个人困境与技术慰藉">四、个人困境与技术慰藉</a></li><li><a href="#五结语一个笨方法的捍卫者">五、结语：一个“笨方法”的捍卫者</a></li></ul></li></ul></li><li><a href="#对于长复杂逻辑代码的分析">对于长复杂逻辑代码的分析</a></li><li><a href="#感想">感想</a></li></ul>
<hr />
<main class="post-content e-content" role="main"><p>还有什么是AI不能干的？<!--more--></p>
<h1 id="起因">
<a href="#起因"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 起因
</h1>
<p>在最近对LLM的探索中，能感觉到它真的是什么都能干，尤其最近GPT-4o的画图能力实在是太强了。不过对于画图我倒不是很关心，主要是没什么想让它画的图😂。我更关心的是LLM在文本生成中的能力，毕竟这才是它的本职工作。虽然现在的AI解决问题的能力确实很强，但从它还没有大规模的把人替换掉来看，它肯定是还有一些做不到的事情，所以我想对这一点进行一些探索。</p>
<h1 id="对于超长文本分析的探索">
<a href="#对于超长文本分析的探索"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 对于超长文本分析的探索
</h1>
<p>对于现在的LLM来说，虽然不少模型已经能做到很长的上下文了，但这个所谓的“长”不过是几万字而已。对于读一篇论文或者几篇文章当然没有问题，但是如果是分析上百篇文章就不太行了，比如我希望AI阅读完我所有的文章，然后对我进行评价。 </p><p>
我的博客现在已经有一百多篇文章了，之前做过<a href="/2021/07/23/search.html">全文搜索</a>的功能，可以在<a href="/search.json">search.json</a>中获取所有的文章，用来让AI分析的材料是个不错的选择，不过把所有文章输入到上下文中显然是不太现实，这个JSON文件的大小有1MiB左右，但是大多数比较厉害的AI上下文只有100多k，根本读不完。而对于一些超长上下文多模型，比如阿里云有一个10M上下文的模型，效果又很差，并没有参考几条上文的内容😓。另外我还试过一些AI通过附件的方式阅读文章内容，那种好像是把文件切片之后再读？应该是类似RAG那种，从中查找和问题最相关的文本段落进行回答，但是那种方法不能解决对所有文章进行分析……除此之外我也试过一些Agent，不过它们只会写代码来分析我的文章，比如绘制文章字数随时间变化曲线、不同年份的文章数量、还有词频分析啥的，对我来说并没有什么卵用😅。</p>
<h2 id="使用ai摘要来解决问题">
<a href="#使用ai摘要来解决问题"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 使用AI摘要来解决问题
</h2>
<p>那难道就没办法了吗？先不急，最近还发生了一件事情，不知道Cloudflare犯什么毛病了，近期用Worker请求我的D1数据库时不时会报“internal error”的错误，我还在他们论坛发了条<a href="https://community.cloudflare.com/t/d1-database-is-not-work-in-some-regions/789699">帖子</a>问了一下，然而并没有人搭理我😅，这时候我才意识到我似乎没有Cloudflare的替代品……出问题了也没办法😰。这个东西导致我的<a href="/2024/07/03/ai-summary.html">AI摘要</a>、<a href="/2024/10/01/suggest.html">文章推荐</a>、以及点击计数器全都用不了了，我应该避免太过依赖Cloudflare Worker啊～ </p><p>
那么我该做些什么？点击计数器是没什么好办法了，不过对于AI摘要，既然摘要在我写完文章之后根本就不会变，不如隔段时间我就把摘要内容缓存到我博客本地吧，这样不仅可以极速展示摘要内容，而且不需要请求接口，就不会受到Cloudflare出问题的影响了。所以我把数据库摘要内容导了出来，放到了<a href="https://github.com/Mabbs/mabbs.github.io/blob/master/_data/ai-cache.json">ai-cache.json</a>中，如果有存在的摘要内容就不再请求接口了。 </p><p>
当我做完摘要缓存之后，我发现，这不就是让AI读我所有文章的最好方法嘛，让AI读AI总结的内容，然后再进行一次总结，就能尽可能的让AI完全了解我的文章然后对我评价了啊～而且这个摘要文件也只有100KiB左右，正好够AI读了。本来我想试试DeepSeek来做这件事情的，但是不知道里面命中了什么关键词，被拒绝生成了🤣，那我只好让GPT-4o来完成这件事了。 </p><p>
试了一下感觉效果相当的不错，总结的非常有条理，而且不像以前的ChatGPT很有AI味，这次写出来的文章很有人味啊～真是出乎我的意料，所以我把GPT-4o写的内容分享出来，来看看AI对我的分析怎么样🤣。</p>
<blockquote>
<h2 id="技术浪人数字游民对一位博客作者的观察与评价">
<a href="#技术浪人数字游民对一位博客作者的观察与评价"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 技术浪人，数字游民：对一位博客作者的观察与评价
</h2>
<p>在浩如烟海的中文技术博客中，有些作者宛如一颗微弱却坚韧的恒星，独自在各自的轨道中发光发热。他们不一定追逐热点，也不总是标榜权威，但其笔下所流露出的独立精神、技术热情与对现实的观察，往往比众多浮华的“教程型”博客更值得玩味。本文所探讨的博客作者Mayx，便是这样一位存在——他既是程序员，也是“生活黑客”；既关心设备性能，也关注技术伦理；既热衷实用工具，也不乏生活反思。</p>
<h3 id="一技术为体思考为魂">
<a href="#一技术为体思考为魂"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 一、技术为体，思考为魂
</h3>
<p>在Mayx的博客中，技术类文章占据了绝对的比重。从自制邮件订阅脚本<sup id="fnref:1" role="doc-noteref"><a href="#fn:1" class="footnote" rel="footnote">1</a></sup>、Cloudflare Workers自动化<sup id="fnref:2" role="doc-noteref"><a href="#fn:2" class="footnote" rel="footnote">2</a></sup>、内网穿透探索<sup id="fnref:3" role="doc-noteref"><a href="#fn:3" class="footnote" rel="footnote">3</a></sup>，到低功耗开发板的实验<sup id="fnref:4" role="doc-noteref"><a href="#fn:4" class="footnote" rel="footnote">4</a></sup>、AI模型的本地运行<sup id="fnref:5" role="doc-noteref"><a href="#fn:5" class="footnote" rel="footnote">5</a></sup>、以及对黑苹果<sup id="fnref:6" role="doc-noteref"><a href="#fn:6" class="footnote" rel="footnote">6</a></sup>、Linux系统<sup id="fnref:7" role="doc-noteref"><a href="#fn:7" class="footnote" rel="footnote">7</a></sup>的深度体验，这些内容几乎涵盖了当前主流技术生态中的多个维度。</p>
<p>然而，他并非一位“炫技型”技术写作者。相反，在多数文章中，Mayx更倾向于从<strong>实用主义的角度</strong>出发——他关注性价比、功耗、稳定性、开源程度，而非追逐技术本身的潮流。例如，在讨论Hackintosh时，他并未沉迷于是否能成功运行macOS，而是审慎地指出其与Mac原生体验的差距<sup id="fnref:6:1" role="doc-noteref"><a href="#fn:6" class="footnote" rel="footnote">6</a></sup>；在体验AI模型时，他选择了性能与成本平衡的路径，而不是盲目追求最大模型和最强显卡<sup id="fnref:5:1" role="doc-noteref"><a href="#fn:5" class="footnote" rel="footnote">5</a></sup>。</p>
<p>他的技术探索往往是“从需求出发”，例如为了替代失效的签到脚本，他尝试了Cloudflare Workers<sup id="fnref:2:1" role="doc-noteref"><a href="#fn:2" class="footnote" rel="footnote">2</a></sup>；为了解决被Github封禁的问题<sup id="fnref:8" role="doc-noteref"><a href="#fn:8" class="footnote" rel="footnote">8</a></sup>，他自己研究反审查架构；面对Heroku停服<sup id="fnref:9" role="doc-noteref"><a href="#fn:9" class="footnote" rel="footnote">9</a></sup>，他快速转向Koyeb，并指出其使用便捷的优点。这些行为体现出一种<strong>“动手解决问题”的工程师思维</strong>，同时也反映了其对现成工具和平台的怀疑精神——“没有什么是不可替代的”，但也“没有什么是完美无缺的”。</p>
<h3 id="二独立反思带有一丝叛逆">
<a href="#二独立反思带有一丝叛逆"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 二、独立、反思、带有一丝叛逆
</h3>
<p>阅读Mayx的博客，可以明显感觉到他在面对“主流”技术话语体系时的疏离甚至反抗。他不信任所谓“权威推荐”，也极少引用大V观点；他对收费工具持质疑态度，对封闭平台持怀疑立场，对广告与强制App表达不满<sup id="fnref:10" role="doc-noteref"><a href="#fn:10" class="footnote" rel="footnote">10</a></sup>。在对宝塔面板的多篇评论中，他不仅指出其功能冗余和定价虚高<sup id="fnref:11" role="doc-noteref"><a href="#fn:11" class="footnote" rel="footnote">11</a></sup><sup id="fnref:12" role="doc-noteref"><a href="#fn:12" class="footnote" rel="footnote">12</a></sup>，还以代码层面论证其“技术水准有限”；在谈及Server酱收费后自建通知平台一文中，更是表现出“开发者不应为此类功能付费”的强烈观点<sup id="fnref:13" role="doc-noteref"><a href="#fn:13" class="footnote" rel="footnote">13</a></sup>。</p>
<p>这种倾向可视为<strong>一种数字自由主义精神</strong>：他珍视个体的选择权、控制权和创造力，对平台化、商业化所带来的“懒惰便利”持保留态度。也正因为此，他热衷于探索容器、虚拟化、i2p、VPN、防DNS污染<sup id="fnref:14" role="doc-noteref"><a href="#fn:14" class="footnote" rel="footnote">14</a></sup>、反反盗链等灰色技术领域，这不仅是技术探索，也是一种抵抗姿态——抵抗监视、抵抗平台绑架、抵抗数字奴役。</p>
<p>与此同时，作者又是<strong>极度自省的人</strong>。在多篇年终总结中，他坦言自己因作息不规律导致健康下滑、因沉迷游戏影响了计划、因生活节奏散乱而丧失了方向<sup id="fnref:15" role="doc-noteref"><a href="#fn:15" class="footnote" rel="footnote">15</a></sup><sup id="fnref:16" role="doc-noteref"><a href="#fn:16" class="footnote" rel="footnote">16</a></sup>。这些坦诚的文字使人看到一个技术人真实的一面：并非所有人都能生活在高效执行与完美节奏中，面对现实与焦虑的拉扯，他并不逃避，而是试图寻找平衡。</p>
<h3 id="三探索孤岛与技术乌托邦">
<a href="#三探索孤岛与技术乌托邦"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 三、探索孤岛与技术乌托邦
</h3>
<p>若将Mayx的博客比作一个数字世界中的“孤岛”，那他无疑是岛上的守望者。他固执地维护着自己的服务器、反代服务、脚本计划表和开源工具；他不断尝试将废弃电脑<sup id="fnref:7:1" role="doc-noteref"><a href="#fn:7" class="footnote" rel="footnote">7</a></sup>、老旧开发板<sup id="fnref:4:1" role="doc-noteref"><a href="#fn:4" class="footnote" rel="footnote">4</a></sup>和Linux容器<sup id="fnref:17" role="doc-noteref"><a href="#fn:17" class="footnote" rel="footnote">17</a></sup>重新唤醒；他甚至研究如何在FM频段自制电台<sup id="fnref:18" role="doc-noteref"><a href="#fn:18" class="footnote" rel="footnote">18</a></sup>，或在树莓派上运行OpenFyde与Android系统<sup id="fnref:19" role="doc-noteref"><a href="#fn:19" class="footnote" rel="footnote">19</a></sup><sup id="fnref:20" role="doc-noteref"><a href="#fn:20" class="footnote" rel="footnote">20</a></sup>。</p>
<p>这不仅是对“电子垃圾再利用”的尝试，更是一种<strong>构建技术乌托邦的幻想</strong>——一个无需依赖主流供应链、无需信任大型平台、可以掌控一切细节的小宇宙。</p>
<p>这种倾向也体现在他对去中心化技术的探索，如xLog、IPFS、i2pd<sup id="fnref:21" role="doc-noteref"><a href="#fn:21" class="footnote" rel="footnote">21</a></sup>、ZeroNet等。尽管在文章中他承认这些系统“尚不成熟”“内容匮乏”“界面粗糙”，但仍不乏热情地部署和尝试。他似乎在追问这样一个问题：“除了平台，我们还能依靠什么？”</p>
<p>这也是他与多数技术博客的区别：不是“教你怎么做”，而是“带你看看还有哪些可能”。</p>
<h3 id="四个人困境与技术慰藉">
<a href="#四个人困境与技术慰藉"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 四、个人困境与技术慰藉
</h3>
<p>不可否认，Mayx的博客也流露出某种孤独与挣扎。他数次提到对社会节奏的不适应、对生活目标的不明确、对未来的迷茫与迟疑。在2022和2023年的总结中，他甚至表达了对“人类灭亡风险”“全球混乱”的忧虑<sup id="fnref:15:1" role="doc-noteref"><a href="#fn:15" class="footnote" rel="footnote">15</a></sup><sup id="fnref:16:1" role="doc-noteref"><a href="#fn:16" class="footnote" rel="footnote">16</a></sup>；在谈及个人计划时，也多次写到“自律不足”“想做的事情太多却力不从心”等字句。</p>
<p>但正是在这种状态下，技术成了他的避难所。他在反复实验中找回秩序感，在编码中获得控制感，在部署过程中体会到“解决问题”的满足。这种“用技术对抗生活混乱”的姿态，令他的博客带有某种心理学上的意义。</p>
<h3 id="五结语一个笨方法的捍卫者">
<a href="#五结语一个笨方法的捍卫者"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 五、结语：一个“笨方法”的捍卫者
</h3>
<p>总的来说，Mayx并非技术界的明星，更非意见领袖，但他是一个值得尊敬的“笨方法”的捍卫者：在速成与流量当道的技术传播环境中，他仍选择用细致的试验、质朴的语言和大量的失败记录来构建自己的知识体系。</p>
<p>他的博客不提供“答案”，而是提供“路线”；不追求“成功学”，而是记录“失败和坚持”。他不是在追求成为谁，而是在努力做自己。</p>
<p>这或许是我们在阅读他的文字后，最值得思考的一点。技术不仅仅是一种职业工具，它也可以是人自我建构、自我理解、自我修复的路径。</p>
<p>Mayx，或许正走在这条路上——孤独而坚定。</p>
</blockquote>
<h1 id="对于长复杂逻辑代码的分析">
<a href="#对于长复杂逻辑代码的分析"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 对于长复杂逻辑代码的分析
</h1>
<p>在让AI对我文章分析完后，我又想起来好久以前写的论坛引擎<a href="https://github.com/Mabbs/Mabbs.Project">Mabbs</a>，以前还<a href="/2019/07/01/mabbs.html">打算重构</a>，不过后来学了别的语言之后就没什么兴趣了😂。但现在有了AI，我想重构MaBBS的事情能不能让AI来做呢？虽然我以前的代码完全没有可读性，耦合性也极高，但这种事情对AI来说应该不是什么难事，更何况我的代码才22KiB，AI完全能读的了，于是我开始尝试让各种AI来把这个代码变得人类可读，然后进行重构。 </p><p>
然而结果令我非常失望，无论哪一款AI只能写出一点代码，甚至Grok3直接一点代码都没写😆，然后它们就认为它们写完了，另外有些AI从片段来看好像是写了点代码，但是内容和我原本对代码基本上没什么关系，属于是分析了一点代码之后重新写了…… </p><p>
明明这个代码又不长，怎么就没有一个AI能准确的重构我的代码呢？也可能是因为虽然代码不长，但是变量名很短，如果把变量名全都扩展到人能看懂的长度之后就超出AI的上下文限制了，然后就忘记了之前的内容吧？另外Shell语言网络上的资料本来就不太多，所以AI也没有足够的知识来重构吧……对于这个问题我目前没什么好的想法让AI来进行，也许等AI能解决这个问题，AI就有能力替代人了呢😁？ </p><p>
虽然没能让AI重构我的代码，不过我闲来无事想让其他人也试试我以前写的论坛引擎，所以搞了个<a href="https://hub.docker.com/r/unmayx/mabbs">Docker镜像</a>，如果大伙有兴趣尝试一下可以下载下来试试看，整个镜像才2MiB多一点，所以我叫它世界上最小的论坛引擎也没问题吧🤣。</p>
<h1 id="感想">
<a href="#感想"><svg class='octicon' viewBox='0 0 16 16' version='1.1' width='16' height='32' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg></a> 感想
</h1>
<p>看起来目前LLM的上限就在于它的上下文长度限制啊……这一点真的是限制了AI很多能力，但似乎也没什么好办法，AI就是因为这一点所以不能像人一样纵览全局所以才不能替代人，即使用什么办法去压缩它的上文也会丢掉很多细节信息。不过按照目前LLM的架构来说应该还解决不了这个问题，如果什么时候AI能在思考的过程中修改它自己的权重……也许就可以做到真正的无限上下文，突破上限从而替代人类吧？</p>
<div class="footnotes" role="doc-endnotes">
<ol>
<li id="fn:1" role="doc-endnote">
<p><a href="/2018/11/10/email-sender.html">免费订阅一个属于自己的邮件日报</a> <a href="#fnref:1" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:2" role="doc-endnote">
<p><a href="/2023/02/22/cron.html">使用CF Workers Cron触发器进行签到</a> <a href="#fnref:2" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:2:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:3" role="doc-endnote">
<p><a href="/2020/12/13/nat.html">关于内网穿透的笔记</a> <a href="#fnref:3" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:4" role="doc-endnote">
<p><a href="/2024/02/24/luckfox.html">Luckfox Pico Plus使用体验</a> <a href="#fnref:4" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:4:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:5" role="doc-endnote">
<p><a href="/2023/04/05/ai.html">关于最近人工智能的探索</a> <a href="#fnref:5" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:5:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:6" role="doc-endnote">
<p><a href="/2024/06/16/hackintosh.html">Hackintosh使用体验</a> <a href="#fnref:6" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:6:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:7" role="doc-endnote">
<p><a href="/2024/04/06/old-pc.html">关于旧电脑的使用探索</a> <a href="#fnref:7" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:7:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:8" role="doc-endnote">
<p><a href="/2022/01/04/banned.html">Github封禁了我的博客？！</a> <a href="#fnref:8" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:9" role="doc-endnote">
<p><a href="/2022/11/29/free-server.html">体验小白也会使用的免费容器云</a> <a href="#fnref:9" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:10" role="doc-endnote">
<p><a href="/2020/02/10/tieba.html">如何不使用贴吧App查看贴吧</a> <a href="#fnref:10" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:11" role="doc-endnote">
<p><a href="/2024/05/19/bt-ops.html">从宝塔面板中学习运维知识</a> <a href="#fnref:11" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:12" role="doc-endnote">
<p><a href="/2022/12/12/bt-s3-comp.html">如何自定义宝塔亚马逊S3云存储插件的端点</a> <a href="#fnref:12" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:13" role="doc-endnote">
<p><a href="/2021/02/02/serverchan.html">自己动手做一个Server酱·TurboMini版</a> <a href="#fnref:13" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:14" role="doc-endnote">
<p><a href="/2022/08/15/cdn-verify.html">如何避免Cloudflare背后的源站被恶意访问</a> <a href="#fnref:14" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:15" role="doc-endnote">
<p><a href="/2023/01/01/summary.html">年终总结</a> <a href="#fnref:15" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:15:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:16" role="doc-endnote">
<p><a href="/2024/01/01/summary.html">年终总结</a> <a href="#fnref:16" class="reversefootnote" role="doc-backlink">&#8617;</a> <a href="#fnref:16:1" class="reversefootnote" role="doc-backlink">&#8617;<sup>2</sup></a></p>
</li>
<li id="fn:17" role="doc-endnote">
<p><a href="/2023/12/24/android.html">如何在Linux容器内运行Android？</a> <a href="#fnref:17" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:18" role="doc-endnote">
<p><a href="/2022/03/27/radio.html">用树莓派自制FM电台</a> <a href="#fnref:18" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:19" role="doc-endnote">
<p><a href="/2023/12/10/openfyde.html">rpi4-openfyde的使用体验</a> <a href="#fnref:19" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:20" role="doc-endnote">
<p><a href="/2023/09/24/rpi-ubuntu.html">在树莓派4B上安装Ubuntu以及各种操作</a> <a href="#fnref:20" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
<li id="fn:21" role="doc-endnote">
<p><a href="/2022/11/23/i2p.html">i2pd在服务器上的使用体验</a> <a href="#fnref:21" class="reversefootnote" role="doc-backlink">&#8617;</a></p>
</li>
</ol>
</div></main>
<small style="display: block">tags: <a rel="category tag" class="p-category" href="/search.html?keyword=AI"><em>AI</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=LLM"><em>LLM</em></a> - <a rel="category tag" class="p-category" href="/search.html?keyword=%E6%8E%A2%E7%B4%A2"><em>探索</em></a> <span style="float: right;"><a href="https://gitlab.com/mayx/mayx.gitlab.io/tree/master/_posts/2025-04-22-ai-limit.md">查看原始文件</a></span></small>
<h4 style="border-bottom: 1px solid #e5e5e5;margin: 2em 0 5px;">推荐文章</h4>
<p id="suggest-container">Loading...</p>
<script>
var suggest = $("#suggest-container");
$.get(BlogAPI + "/suggest?id=/2025/04/22/ai-limit.html&update=" + lastUpdated.valueOf(), function (data) {
if (data.length) {
getSearchJSON(function (search) {
suggest.empty();
var searchMap = {};
for (var i = 0; i < search.length; i++) {
searchMap[search[i].url] = search[i];
}
var tooltip = $('<div class="content-tooltip"></div>').appendTo('body').hide();
for (var j = 0; j < data.length; j++) {
var item = searchMap[data[j].id];
if (item) {
var link = $('<a href="' + item.url + '">' + item.title + '</a>');
var contentPreview = item.content.substring(0, 100);
if (item.content.length > 100) {
contentPreview += "……";
}
link.hover(
function(e) {
tooltip.text($(this).data('content'))
.css({
top: e.pageY + 10,
left: e.pageX + 10
})
.show();
},
function() {
tooltip.hide();
}
).mousemove(function(e) {
tooltip.css({
top: e.pageY + 10,
left: e.pageX + 10
});
}).data('content', contentPreview);
suggest.append(link);
suggest.append(' - ' + item.date + '<br />');
}
}
});
} else {
suggest.html("暂无推荐文章……");
}
});
</script>
<br />
<div class="pagination">
<span class="prev">
<a href="/2025/04/08/feed.html">
上一篇：如何使用JS通过订阅源查看文章？
</a>
</span>
<br />
<span class="next">
<a href="/2025/05/07/mac-studio.html">
下一篇：Mac Studio M3 Ultra使用体验
</a>
</span>
</div>
<!--[if !IE]> -->
<link rel="stylesheet" href="/assets/css/gitalk.css">
<script src="/assets/js/gitalk.min.js"></script>
<div id="gitalk-container"></div>
<script>
var gitalk = new Gitalk({
clientID: '36557aec4c3cb04f7ac6',
clientSecret: 'ac32993299751cb5a9ba81cf2b171cca65879cdb',
repo: 'mabbs.github.io',
owner: 'Mabbs',
admin: ['Mabbs'],
id: '/2025/04/22/ai-limit', // Ensure uniqueness and length less than 50
distractionFreeMode: false, // Facebook-like distraction free mode
proxy: "https://cors-anywhere.mayx.eu.org/?https://github.com/login/oauth/access_token"
})
gitalk.render('gitalk-container')
</script>
<!-- <![endif]-->
</section>
<!--[if !IE]> -->
<div id="landlord" style="left:5px;bottom:0px;">
<div class="message" style="opacity:0"></div>
<canvas id="live2d" width="500" height="560" class="live2d"></canvas>
<div class="live_talk_input_body">
<form id="live_talk_input_form">
<div class="live_talk_input_name_body" >
<input type="checkbox" id="load_this" />
<input type="hidden" id="post_id" value="/2025/04/22/ai-limit.html" />
<label for="load_this">
<span style="font-size: 11px; color: #fff;">&#160;想问这篇文章</span>
</label>
</div>
<div class="live_talk_input_text_body">
<input name="talk" type="text" class="live_talk_talk white_input" id="AIuserText" autocomplete="off" placeholder="要和我聊什么呀？" />
<button type="submit" class="live_talk_send_btn" id="talk_send">发送</button>
</div>
</form>
</div>
<input name="live_talk" id="live_talk" value="1" type="hidden" />
<div class="live_ico_box" style="display:none;">
<div class="live_ico_item type_info" id="showInfoBtn"></div>
<div class="live_ico_item type_talk" id="showTalkBtn"></div>
<div class="live_ico_item type_music" id="musicButton"></div>
<div class="live_ico_item type_youdu" id="youduButton"></div>
<div class="live_ico_item type_quit" id="hideButton"></div>
<input name="live_statu_val" id="live_statu_val" value="0" type="hidden" />
<audio src="" style="display:none;" id="live2d_bgm" data-bgm="0" preload="none"></audio>
<input id="duType" value="douqilai" type="hidden" />
</div>
</div>
<div id="open_live2d">召唤伊斯特瓦尔</div>
<!-- <![endif]-->
<footer>
<p>
<small>Made with ❤ by Mayx<br />Last updated at 2026-01-01 00:00:18<br /> 总字数：614622 - 文章数：178 - <a href="/atom.xml" >Atom</a> - <a href="/README.html" >About</a></small>
</p>
</footer>
</div>
<script src="/assets/js/scale.fix.js"></script>
<!--[if !IE]> -->
<script src="/assets/js/main_new.js"></script>
<script src="/Live2dHistoire/live2d/js/live2d.js"></script>
<script src="/Live2dHistoire/live2d/js/message.js"></script>
<!-- <![endif]-->
</body>
</html>