Refactor public assets and retire legacy shop surface

.github/workflows/deploy.yml

@@ -46,13 +46,16 @@ jobs:
     - name: Checkout
       uses: actions/checkout@v4
 
-    - name: Setup Pages
-      uses: actions/configure-pages@v4
-
-    - name: Upload artifact
-      uses: actions/upload-pages-artifact@v3
-      with:
-        path: '.'
+    - name: Setup Pages
+      uses: actions/configure-pages@v4
+
+    - name: Build public artifact
+      run: npm run build:public
+
+    - name: Upload artifact
+      uses: actions/upload-pages-artifact@v3
+      with:
+        path: 'public-dist'
 
     - name: Deploy to GitHub Pages
       id: deployment

.gitignore

@@ -85,7 +85,8 @@ coverage/
 
 # Nuxt.js build / generate output
 .nuxt
-dist
+dist
+public-dist/
 
 # Storybook build outputs
 .out

AGENTS.md

@@ -78,3 +78,11 @@
 - 502 根因是 `com.wjx.aaccx.yui-web` LaunchAgent 仍运行旧的 `python -m http.server 8318`，而 nginx 已代理到 `127.0.0.1:4173`。
 - 修复方式是让该 LaunchAgent 直接运行 `/opt/homebrew/bin/node /Users/wujianxiang/CodeSpace/yui.web/server.js`，并设置 `PORT=4173`。
 - 生产模式下 `ADMIN_TOKEN` 必须为至少 32 字符的强随机值；本次已轮换 `.env` 中旧 9 位弱 token，避免公网服务绕过强密钥校验。
+
+## 2026-06-24 Sub2API 主链路与旧 Shop 退役
+
+- 当前公网主链路为 `Cloudflare Tunnel -> nginx 127.0.0.1:8080 -> Sub2API 127.0.0.1:18080 -> CLIProxyAPI 127.0.0.1:8317`。
+- `https://api.aaccx.pw/v1/*` 和控制台前端都经过 Sub2API；控制台前端资源由 Go embed 编进 Sub2API 后端二进制。
+- yui.web 的 `/shop` 只保留为 Sub2API 跳转入口，不再维护旧登录、注册、账户、管理后台、计费支付和旧发 Key 页面。
+- yui.web 旧浏览器 API 前缀 `/api/auth`、`/api/account`、`/api/admin`、`/api/invites`、`/api/orders` 统一返回 `410 SHOP_LEGACY_API_RETIRED`。
+- 后续不要再围绕 yui.web 旧 Shop 控制台做性能优化；无调用方代码应删除或返回明确退役响应。

anime/index.html

@@ -154,7 +154,7 @@ <h3 class="text-primary dark:text-dark-text text-2xl font-semibold tracking-tigh
             <div class="w-full py-6">
                 <div class="flex flex-col md:flex-row items-center gap-12 rounded-xl bg-white dark:bg-dark-surface overflow-hidden">
                     <div class="relative w-full md:w-1/2 aspect-video bg-cover bg-center rounded-lg overflow-hidden">
-                        <img class="w-full h-full object-cover" src="/images/animate/image.png" alt="Editor's Choice Anime"/>
+                        <img class="w-full h-full object-cover" src="/images/optimized/animate/image.webp" alt="Editor's Choice Anime" width="528" height="760" decoding="async"/>
                     </div>
                     <div class="flex flex-col justify-center gap-6 md:w-1/2">
                         <div class="flex items-center gap-3">
@@ -218,37 +218,37 @@ <h2 class="text-primary dark:text-dark-text text-lg font-display font-semibold"
 
     <script>
         const animeData = [
-            { image: '/images/animate/image.png', title: 'Anime Collection 1', genre: 'Action', rating: '9.5' },
-            { image: '/images/animate/image copy.png', title: 'Anime Collection 2', genre: 'Romance', rating: '9.2' },
-            { image: '/images/animate/image copy 2.png', title: 'Anime Collection 3', genre: 'Slice of Life', rating: '8.8' },
-            { image: '/images/animate/image copy 3.png', title: 'Anime Collection 4', genre: 'Fantasy', rating: '9.0' },
-            { image: '/images/animate/image copy 4.png', title: 'Anime Collection 5', genre: 'Drama', rating: '9.3' },
-            { image: '/images/animate/image copy 5.png', title: 'Anime Collection 6', genre: 'Action', rating: '8.9' },
-            { image: '/images/animate/image copy 6.png', title: 'Anime Collection 7', genre: 'Music', rating: '9.1' },
-            { image: '/images/animate/image copy 7.png', title: 'Anime Collection 8', genre: 'Romance', rating: '8.7' },
-            { image: '/images/animate/image copy 8.png', title: 'Anime Collection 9', genre: 'Slice of Life', rating: '9.4' },
-            { image: '/images/animate/image copy 9.png', title: 'Anime Collection 10', genre: 'Fantasy', rating: '8.6' },
-            { image: '/images/animate/image copy 10.png', title: 'Anime Collection 11', genre: 'Action', rating: '9.2' },
-            { image: '/images/animate/image copy 11.png', title: 'Anime Collection 12', genre: 'Drama', rating: '8.8' },
-            { image: '/images/animate/image copy 12.png', title: 'Anime Collection 13', genre: 'Romance', rating: '9.0' },
-            { image: '/images/animate/image copy 13.png', title: 'Anime Collection 14', genre: 'Music', rating: '8.5' },
-            { image: '/images/animate/image copy 14.png', title: 'Anime Collection 15', genre: 'Slice of Life', rating: '9.1' },
-            { image: '/images/animate/image copy 15.png', title: 'Anime Collection 16', genre: 'Fantasy', rating: '8.9' },
-            { image: '/images/animate/image copy 16.png', title: 'Anime Collection 17', genre: 'Action', rating: '9.3' },
-            { image: '/images/animate/image copy 17.png', title: 'Anime Collection 18', genre: 'Drama', rating: '8.7' },
-            { image: '/images/animate/image copy 18.png', title: 'Anime Collection 19', genre: 'Romance', rating: '9.0' },
-            { image: '/images/animate/image copy 19.png', title: 'Anime Collection 20', genre: 'Music', rating: '8.8' },
-            { image: '/images/animate/image copy 20.png', title: 'Anime Collection 21', genre: 'Slice of Life', rating: '9.2' },
-            { image: '/images/animate/image copy 21.png', title: 'Anime Collection 22', genre: 'Fantasy', rating: '8.6' },
-            { image: '/images/animate/image copy 22.png', title: 'Anime Collection 23', genre: 'Action', rating: '9.4' },
-            { image: '/images/animate/image copy 23.png', title: 'Anime Collection 24', genre: 'Drama', rating: '8.9' },
-            { image: '/images/animate/image copy 24.png', title: 'Anime Collection 25', genre: 'Romance', rating: '9.1' },
-            { image: '/images/animate/image copy 25.png', title: 'Anime Collection 26', genre: 'Music', rating: '8.5' },
-            { image: '/images/animate/image copy 26.png', title: 'Anime Collection 27', genre: 'Slice of Life', rating: '9.0' },
-            { image: '/images/animate/image copy 27.png', title: 'Anime Collection 28', genre: 'Fantasy', rating: '8.8' },
-            { image: '/images/animate/image copy 28.png', title: 'Anime Collection 29', genre: 'Action', rating: '9.3' },
-            { image: '/images/animate/image copy 29.png', title: 'Anime Collection 30', genre: 'Drama', rating: '8.7' },
-            { image: '/images/animate/image copy 30.png', title: 'Anime Collection 31', genre: 'Romance', rating: '9.2' },
+            { image: '/images/optimized/animate/image.webp', title: 'Anime Collection 1', genre: 'Action', rating: '9.5' },
+            { image: '/images/optimized/animate/image copy.webp', title: 'Anime Collection 2', genre: 'Romance', rating: '9.2' },
+            { image: '/images/optimized/animate/image copy 2.webp', title: 'Anime Collection 3', genre: 'Slice of Life', rating: '8.8' },
+            { image: '/images/optimized/animate/image copy 3.webp', title: 'Anime Collection 4', genre: 'Fantasy', rating: '9.0' },
+            { image: '/images/optimized/animate/image copy 4.webp', title: 'Anime Collection 5', genre: 'Drama', rating: '9.3' },
+            { image: '/images/optimized/animate/image copy 5.webp', title: 'Anime Collection 6', genre: 'Action', rating: '8.9' },
+            { image: '/images/optimized/animate/image copy 6.webp', title: 'Anime Collection 7', genre: 'Music', rating: '9.1' },
+            { image: '/images/optimized/animate/image copy 7.webp', title: 'Anime Collection 8', genre: 'Romance', rating: '8.7' },
+            { image: '/images/optimized/animate/image copy 8.webp', title: 'Anime Collection 9', genre: 'Slice of Life', rating: '9.4' },
+            { image: '/images/optimized/animate/image copy 9.webp', title: 'Anime Collection 10', genre: 'Fantasy', rating: '8.6' },
+            { image: '/images/optimized/animate/image copy 10.webp', title: 'Anime Collection 11', genre: 'Action', rating: '9.2' },
+            { image: '/images/optimized/animate/image copy 11.webp', title: 'Anime Collection 12', genre: 'Drama', rating: '8.8' },
+            { image: '/images/optimized/animate/image copy 12.webp', title: 'Anime Collection 13', genre: 'Romance', rating: '9.0' },
+            { image: '/images/optimized/animate/image copy 13.webp', title: 'Anime Collection 14', genre: 'Music', rating: '8.5' },
+            { image: '/images/optimized/animate/image copy 14.webp', title: 'Anime Collection 15', genre: 'Slice of Life', rating: '9.1' },
+            { image: '/images/optimized/animate/image copy 15.webp', title: 'Anime Collection 16', genre: 'Fantasy', rating: '8.9' },
+            { image: '/images/optimized/animate/image copy 16.webp', title: 'Anime Collection 17', genre: 'Action', rating: '9.3' },
+            { image: '/images/optimized/animate/image copy 17.webp', title: 'Anime Collection 18', genre: 'Drama', rating: '8.7' },
+            { image: '/images/optimized/animate/image copy 18.webp', title: 'Anime Collection 19', genre: 'Romance', rating: '9.0' },
+            { image: '/images/optimized/animate/image copy 19.webp', title: 'Anime Collection 20', genre: 'Music', rating: '8.8' },
+            { image: '/images/optimized/animate/image copy 20.webp', title: 'Anime Collection 21', genre: 'Slice of Life', rating: '9.2' },
+            { image: '/images/optimized/animate/image copy 21.webp', title: 'Anime Collection 22', genre: 'Fantasy', rating: '8.6' },
+            { image: '/images/optimized/animate/image copy 22.webp', title: 'Anime Collection 23', genre: 'Action', rating: '9.4' },
+            { image: '/images/optimized/animate/image copy 23.webp', title: 'Anime Collection 24', genre: 'Drama', rating: '8.9' },
+            { image: '/images/optimized/animate/image copy 24.webp', title: 'Anime Collection 25', genre: 'Romance', rating: '9.1' },
+            { image: '/images/optimized/animate/image copy 25.webp', title: 'Anime Collection 26', genre: 'Music', rating: '8.5' },
+            { image: '/images/optimized/animate/image copy 26.webp', title: 'Anime Collection 27', genre: 'Slice of Life', rating: '9.0' },
+            { image: '/images/optimized/animate/image copy 27.webp', title: 'Anime Collection 28', genre: 'Fantasy', rating: '8.8' },
+            { image: '/images/optimized/animate/image copy 28.webp', title: 'Anime Collection 29', genre: 'Action', rating: '9.3' },
+            { image: '/images/optimized/animate/image copy 29.webp', title: 'Anime Collection 30', genre: 'Drama', rating: '8.7' },
+            { image: '/images/optimized/animate/image copy 30.webp', title: 'Anime Collection 31', genre: 'Romance', rating: '9.2' },
         ];
 
         let currentIndex = 0;
@@ -288,7 +288,7 @@ <h2 class="text-primary dark:text-dark-text text-lg font-display font-semibold"
             return `
                 <div class="anime-item group flex flex-col gap-4 cursor-pointer">
                     <div class="relative aspect-[3/4] w-full overflow-hidden rounded-lg bg-gray-100 dark:bg-dark-card">
-                        <img class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105" alt="${title}" src="${item.image}" loading="lazy" decoding="async"/>
+                        <img class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105" alt="${title}" src="${item.image}" width="528" height="760" loading="lazy" decoding="async"/>
                         <div class="absolute inset-0 bg-black/0 group-hover:bg-black/10 transition-colors duration-300"></div>
                     </div>
                     <div class="flex flex-col gap-1">

blog/back-to-vibe-coding-ai-driven-dev-before.html

@@ -145,7 +145,7 @@ <h1 class="text-4xl md:text-5xl font-display font-bold text-primary dark:text-da
 
         <div class="w-full max-w-4xl mx-auto px-6">
             <div class="aspect-video rounded-lg overflow-hidden bg-gray-100 dark:bg-dark-card shadow-lg">
-                <img class="w-full h-full object-cover" src="/images/blog/back-to-vibe-coding/00-cover-prompt-to-loop.png" alt="从 Prompt 到 Loop 的文章封面"/>
+                <img class="w-full h-full object-cover" src="/images/optimized/blog/back-to-vibe-coding/00-cover-prompt-to-loop.webp" alt="从 Prompt 到 Loop 的文章封面" width="1400" height="602" decoding="async"/>
             </div>
         </div>
 
@@ -168,7 +168,7 @@ <h1 class="text-4xl md:text-5xl font-display font-bold text-primary dark:text-da
 
                 <h2 class="text-primary dark:text-dark-text">01 你到底在用哪种 AI Coding 工具？</h2>
                 <figure class="article-figure">
-                    <img src="/images/blog/back-to-vibe-coding/01-tool-entry-desktop-cli.png" alt="工具入口不同，工作流也不同" loading="lazy" decoding="async"/>
+                    <img src="/images/optimized/blog/back-to-vibe-coding/01-tool-entry-desktop-cli.webp" alt="工具入口不同，工作流也不同" width="1400" height="933" loading="lazy" decoding="async"/>
                 </figure>
                 <p>先从最小白的问题开始：桌面端和 CLI 到底有什么区别？</p>
                 <p>在我看来，桌面端更像“人看的工作台”。它适合聊天、复制内容、整理 PDF 等文档、生成图片、跨应用操作。比如你让 AI 写一段邮件、整理一份文档、生成一张图片，桌面端的体验通常会更自然，因为它更接近我们平时使用软件的方式。</p>
@@ -207,7 +207,7 @@ <h2 class="text-primary dark:text-dark-text">01 你到底在用哪种 AI Coding
 
                 <h2 class="text-primary dark:text-dark-text">02 AI Coding APP 不是聊天框，而是 Agent Harness工程</h2>
                 <figure class="article-figure">
-                    <img src="/images/blog/back-to-vibe-coding/02-agent-harness-project-site.png" alt="不是聊天框，而是进入项目现场" loading="lazy" decoding="async"/>
+                    <img src="/images/optimized/blog/back-to-vibe-coding/02-agent-harness-project-site.webp" alt="不是聊天框，而是进入项目现场" width="1400" height="933" loading="lazy" decoding="async"/>
                 </figure>
                 <p>很多人用 Claude Code / Codex，还是 ChatGPT 的使用习惯：</p>
                 <blockquote>
@@ -228,7 +228,7 @@ <h2 class="text-primary dark:text-dark-text">02 AI Coding APP 不是聊天框，
 
                 <h2 class="text-primary dark:text-dark-text">03 Prompt Engineering还有用，但没那么有用了</h2>
                 <figure class="article-figure">
-                    <img src="/images/blog/back-to-vibe-coding/03-prompt-to-loop-system.png" alt="Prompt 是零件，Loop 才是系统" loading="lazy" decoding="async"/>
+                    <img src="/images/optimized/blog/back-to-vibe-coding/03-prompt-to-loop-system.webp" alt="Prompt 是零件，Loop 才是系统" width="1400" height="933" loading="lazy" decoding="async"/>
                 </figure>
                 <p>讲到这里，就可以回到最近很火的那个说法：提示词工程是不是已经死了？</p>
                 <p>我觉得这个说法有传播性，但不够准确。</p>
@@ -257,7 +257,7 @@ <h2 class="text-primary dark:text-dark-text">03 Prompt Engineering还有用，
 
                 <h2 class="text-primary dark:text-dark-text">04 如何用长期记忆更高效地使用 Codex、Claude Code？</h2>
                 <figure class="article-figure">
-                    <img src="/images/blog/back-to-vibe-coding/04-rules-as-manual.png" alt="规则文件让上下文变成资产" loading="lazy" decoding="async"/>
+                    <img src="/images/optimized/blog/back-to-vibe-coding/04-rules-as-manual.webp" alt="规则文件让上下文变成资产" width="1400" height="933" loading="lazy" decoding="async"/>
                 </figure>
                 <p>讲到这里，就会进入一个很关键的问题：如果 AI Coding APP 不是普通聊天框，那我们到底应该怎么更高效地使用它？</p>
                 <p>我的理解是，第一步不是去写一个更长的 Prompt，而是先把那些长期重复出现的规则沉淀下来。</p>
@@ -320,7 +320,7 @@ <h2 class="text-primary dark:text-dark-text">04 如何用长期记忆更高效
 
                 <h2 class="text-primary dark:text-dark-text">05 Skill：把规则进一步拆成可复用能力</h2>
                 <figure class="article-figure">
-                    <img src="/images/blog/back-to-vibe-coding/05-skill-automation-machine.png" alt="Skill 是可复用动作，Automation 让它启动" loading="lazy" decoding="async"/>
+                    <img src="/images/optimized/blog/back-to-vibe-coding/05-skill-automation-machine.webp" alt="Skill 是可复用动作，Automation 让它启动" width="1400" height="933" loading="lazy" decoding="async"/>
                 </figure>
                 <p>如果说 AGENTS.md / CLAUDE.md 更像项目规则，那么 Skill 更像一套可复用的工作流模块。</p>
                 <p>项目规则解决的是“这个项目里应该怎么做”。Skill 解决的是“遇到某一类任务时，应该按什么流程做”。</p>

blog/speakmore-cloud-input.html

@@ -135,7 +135,7 @@ <h1 id="articleTitle" class="text-4xl md:text-5xl font-display font-bold text-pr
 
         <div class="w-full max-w-4xl mx-auto px-6">
             <div class="aspect-video rounded-lg overflow-hidden bg-gray-100 dark:bg-dark-card shadow-lg">
-                <img id="articleHeroImage" class="w-full h-full object-cover" src="/images/blog/speakmore-note-cover-guizang.png" alt="SpeakMore 文章封面"/>
+                <img id="articleHeroImage" class="w-full h-full object-cover" src="/images/optimized/blog/speakmore-note-cover-guizang.webp" alt="SpeakMore 文章封面" width="1600" height="838" decoding="async"/>
             </div>
         </div>
 

js/blog-data.js

@@ -3,7 +3,7 @@
         {
             id: 12,
             publishedAt: '2026-06-16',
-            image: '/images/blog/back-to-vibe-coding/00-cover-prompt-to-loop.png',
+            image: '/images/optimized/blog/back-to-vibe-coding/00-cover-prompt-to-loop.webp',
             category: 'AI',
             author: 'Yui',
             link: '/blog/back-to-vibe-coding-ai-driven-dev-before',
@@ -69,7 +69,7 @@
         {
             id: 10,
             publishedAt: '2026-06-04',
-            image: '/images/blog/speakmore-note-cover-guizang.png',
+            image: '/images/optimized/blog/speakmore-note-cover-guizang.webp',
             category: 'AI',
             author: 'Yui',
             link: '/blog/speakmore-cloud-input',