From 803857298f4d32e2f17036923d6f8b08a6cbe3ca Mon Sep 17 00:00:00 2001 From: Super_Z <1401203083@qq.com> Date: Wed, 24 Jun 2026 01:38:08 +0000 Subject: [PATCH] 051da664-7c0a-4d7b-8129-36efb67f35b3 --- src/app/globals.css | 12 ++++++++ src/app/layout.tsx | 12 ++++++-- src/app/page.tsx | 16 +++++----- worklog.md | 72 +++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 103 insertions(+), 9 deletions(-) diff --git a/src/app/globals.css b/src/app/globals.css index 4126c5311..36441b5db 100755 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -8,6 +8,7 @@ --color-foreground: var(--foreground); --font-sans: var(--font-geist-sans); --font-mono: var(--font-geist-mono); + --font-display: var(--font-display); --color-sidebar-ring: var(--sidebar-ring); --color-sidebar-border: var(--sidebar-border); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); @@ -144,6 +145,17 @@ -webkit-text-fill-color: transparent; } +/* v0.10.1 调研落地：Orbitron 科幻显示字体工具类 */ +.font-display { + font-family: var(--font-display), var(--font-geist-sans), sans-serif; + letter-spacing: 0.02em; +} +/* 数值/技术文本使用 Orbitron 增强科幻感 */ +.font-tech { + font-family: var(--font-display), var(--font-geist-mono), monospace; + letter-spacing: 0.04em; +} + /* 通用脉冲 */ @keyframes echo-glow { 0%, 100% { opacity: 0.6; } diff --git a/src/app/layout.tsx b/src/app/layout.tsx index a9510509c..ceb72766c 100755 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,5 +1,5 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; +import { Geist, Geist_Mono, Orbitron } from "next/font/google"; import "./globals.css"; import { Toaster } from "@/components/ui/toaster"; @@ -13,6 +13,14 @@ const geistMono = Geist_Mono({ subsets: ["latin"], }); +// v0.10.1 调研落地：Orbitron 科幻显示字体（用于标题/数值/全息UI） +const orbitron = Orbitron({ + variable: "--font-display", + subsets: ["latin"], + weight: ["400", "500", "600", "700", "900"], + display: "swap", +}); + export const metadata: Metadata = { title: "回响星核 · Echo Nexus", description: "原创深空考古放置策略游戏 — 解码记忆晶体，拼凑以太文明的回响，跨越维度发起接触。", @@ -42,7 +50,7 @@ export default function RootLayout({ return ( {children} diff --git a/src/app/page.tsx b/src/app/page.tsx index 346069c22..409e8c690 100755 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -13,12 +13,14 @@ import { ExpeditionPanel } from "@/components/game/ExpeditionPanel"; import { AchievementsPanel } from "@/components/game/AchievementsPanel"; import { AchievementNotifier } from "@/components/game/AchievementNotifier"; import { ConstellationPanel } from "@/components/game/ConstellationPanel"; -import { ConstellationDialog } from "@/components/game/ConstellationDialog"; -import { ChronicleDialog } from "@/components/game/ChronicleDialog"; import { BeaconPanel } from "@/components/game/BeaconPanel"; import { TutorialOverlay } from "@/components/game/TutorialOverlay"; -import { OfflineReportDialog } from "@/components/game/OfflineReportDialog"; -import { CruiseMode } from "@/components/game/CruiseMode"; +// v0.10.1 性能优化：重型对话框/全屏组件动态导入，减少首屏 bundle +import dynamic from "next/dynamic"; +const ChronicleDialog = dynamic(() => import("@/components/game/ChronicleDialog").then(m => ({ default: m.ChronicleDialog })), { ssr: false }); +const ConstellationDialog = dynamic(() => import("@/components/game/ConstellationDialog").then(m => ({ default: m.ConstellationDialog })), { ssr: false }); +const OfflineReportDialog = dynamic(() => import("@/components/game/OfflineReportDialog").then(m => ({ default: m.OfflineReportDialog })), { ssr: false }); +const CruiseMode = dynamic(() => import("@/components/game/CruiseMode").then(m => ({ default: m.CruiseMode })), { ssr: false }); import { AttributesPanel } from "@/components/game/AttributesPanel"; import { ExplorationRadar } from "@/components/game/ExplorationRadar"; import { RelicCodex } from "@/components/game/RelicCodex"; @@ -181,8 +183,8 @@ export default function Page() {
-

回响星核

-

+

回响星核

+

ECHO NEXUS · v0.10

@@ -271,7 +273,7 @@ export default function Page() { {/* 顶部状态条 */}
- CRYSTAL CORE · ONLINE + CRYSTAL CORE · ONLINE
diff --git a/worklog.md b/worklog.md index 46eeb55b7..78969ecbf 100755 --- a/worklog.md +++ b/worklog.md @@ -929,3 +929,75 @@ Stage Summary: - 🟡 成就系统价值化（成就解锁主动技能）— 待 v0.11 - 🟡 VLM 建议：解码区 hover 效果 / 状态文字对比 / 星云背景 - 🟡 部署 gh-pages + +--- + +## v0.10.1 第1轮迭代循环 — 调研落地 + 性能优化（2026-01-24） + +### 本轮循环阶段 +- **调研主题**：放置游戏设计哲学 + 科幻字体资源 + Next.js bundle 优化 +- **工单状态**：Gitea 无 open 工单（#2 已于 v0.10 关闭） + +### 调研发现（附 URL） +1. **放置游戏设计哲学**（Eric Guan - Idle Game Design Principles） + - URL: https://ericguan.substack.com/p/idle-game-design-principles + - 核心思想：idle 游戏 = 核心循环 + 暂停循环 + 回来重投资。深度来自"长目标 + 短反馈" + - 可落地：增加"长目标"系统（已有遗迹图鉴，可深化"文明兴衰时间线"） +2. **Universal Paperclips 叙事深度**（New Yorker + Northeastern 论文） + - URL: https://www.newyorker.com/culture/culture-desk/the-unexpected-philosophical-depths-of-the-clicker-game-universal-paperclips + - URL: https://repository.library.northeastern.edu/files/neu:bz617n08c/fulltext.pdf + - 核心思想：incremental game 可以承载哲学叙事（存在主义/AI伦理/宇宙尺度） + - 可落地：遗迹图鉴故事碎片可增加"哲学拷问"层（如"飞升是否是逃避？"） +3. **科幻字体资源**（Google Fonts - Orbitron） + - URL: https://fonts.google.com/specimen/Orbitron + - CC-BY 免费，几何无衬线，专为科幻 HUD 设计 + - 已落地：集成到标题/数值/技术文本 +4. **Next.js bundle 优化**（web.dev + Medium 70% 优化案例） + - URL: https://web.dev/articles/code-splitting-with-dynamic-imports-in-nextjs + - 核心方法：next/dynamic 对按需组件动态导入，ssr:false 跳过 SSR + - 已落地：4 个重型对话框动态导入 + +### 本轮目标 +1. ✅ 集成 Orbitron 科幻字体（调研资源落地） +2. ✅ 动态导入重型对话框（性能优化） +3. ✅ 部署 + QA 验证 + +### 已完成的修改 +**文件变更：** +- `src/app/layout.tsx`：新增 Orbitron 字体导入（--font-display 变量） +- `src/app/globals.css`：新增 .font-display / .font-tech 工具类 +- `src/app/page.tsx`： + - 主标题 + 版本号 + 状态条应用 Orbitron + - ChronicleDialog/ConstellationDialog/OfflineReportDialog/CruiseMode 改为 next/dynamic 动态导入（ssr:false） + +### 性能优化记录 +| 指标 | 优化前 | 优化后 | 变化 | +|------|--------|--------|------| +| 总 bundle | 1.7M | 1.7M | 持平（字体增加抵消拆分） | +| 主 chunk | 572K | 373K | **-199K (-35%)** | +| 动态拆分 chunk | - | 98K（对话框独立） | 首屏不加载 | + +**优化方法**：next/dynamic + ssr:false 将 4 个按需对话框从主 chunk 拆出，首屏只加载核心 UI，对话框点击时才加载。 + +### 验证结果 +- ✅ lint 零错误 +- ✅ 构建成功（4.8s 编译） +- ✅ gh-pages 部署成功（HTTP 200） +- ✅ VLM 验证：Orbitron 字体生效，标题科幻感增强，四色全息保持，无渲染异常 +- ✅ 动态导入对话框功能正常：编年史对话框点击打开正常，内容完整 +- ✅ agent-browser 交互测试通过 + +### 未解决问题 +- 🟡 CSS 175K 偏大，未优化（下一轮可考虑 purge unused Tailwind） +- 🟡 Orbitron 字体增加约 30K，可考虑只加载 400/700 两个 weight + +### 下一轮调研项（循环延续） +1. **架构思想**：放置游戏存档系统架构（增量序列化 vs 全量），参考 Universal Paperclips 的存档设计 +2. **叙事思想**：ludonarrative harmony（玩法与叙事和谐）在放置游戏中的应用，如何让"解码晶体"动作本身承载叙事 +3. **资源调研**：freepd.com（CC0 音乐）/ mixkit 深空音效 / game-icons.net（CC-BY 图标扩展） +4. **性能优化**：CSS purge + Zustand selector 细粒度拆分（检查 useGameStore 过宽订阅） +5. **功能扩展**：基于 Eric Guan "长目标"思想，深化遗迹图鉴为"文明兴衰时间线" + +### 定时任务 +- job_id=228705，每 20 分钟（1200秒）执行一轮完整迭代循环 +- 循环结构：调研→工单→策划→开发（嵌套性能优化）→发布→记录下一轮调研项