[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"public:announcements":3,"footer:categories:zh":4,"tag:detail:vue:zh":132,"public:navigations:zh":139,"tag:posts:vue:zh:1":183},[],[5,23,39,55,71,88,103,117],{"id":6,"name":7,"slug":12,"description":13,"icon":18,"color":19,"cover_image":20,"created_at":21,"post_count":22},1,{"en":8,"ja":9,"zh":10,"zh_Hant":11},"Technology","テクノロジー","技术","技術","technology",{"en":14,"ja":15,"zh":16,"zh_Hant":17},"Cutting-edge technology exploration and in-depth analysis covering programming languages, frameworks, and architecture design","プログラミング言語、フレームワーク、アーキテクチャ設計を含む先端技術の探究","前沿技术探索与深度分析，涵盖编程语言、框架、架构设计等核心领域","前沿技術探索與深度分析，涵蓋編程語言、框架、架構設計等核心領域","heroicons:cog-6-tooth","#6366f1",null,"2026-09-30T18:09:53.633610Z",8,{"id":24,"name":25,"slug":29,"description":30,"icon":35,"color":36,"cover_image":20,"created_at":37,"post_count":38},2,{"en":26,"ja":27,"zh":28,"zh_Hant":28},"Tutorial","チュートリアル","教程","tutorial",{"en":31,"ja":32,"zh":33,"zh_Hant":34},"Hands-on tutorials from scratch with clear steps and complete code for developers at all levels","ゼロから始める実践的なチュートリアル。明確な手順と完全なコードで、全てのレベルの開発者に最適","从零开始的实战教程，步骤清晰，代码完整，适合各阶段开发者学习","從零開始的實戰教程，步驟清晰，代碼完整，適合各階段開發者學習","heroicons:academic-cap","#10b981","2026-09-30T18:09:53.641581Z",6,{"id":40,"name":41,"slug":45,"description":46,"icon":51,"color":52,"cover_image":20,"created_at":53,"post_count":54},3,{"en":42,"ja":43,"zh":44,"zh_Hant":44},"Frontend","フロントエンド","前端","frontend",{"en":47,"ja":48,"zh":49,"zh_Hant":50},"Full coverage of web frontend development including Vue, React, new CSS features, and performance optimization","Vue、React、CSSの新機能やパフォーマンス最適化を含むWebフロントエンド開発の全領域","Web前端开发全栈覆盖，包括Vue、React、CSS新特性及性能优化等话题","Web前端開發全棧覆蓋，包括Vue、React、CSS新特性及性能優化等話題","heroicons:computer-desktop","#ec4899","2026-09-30T18:09:53.644838Z",7,{"id":56,"name":57,"slug":62,"description":63,"icon":68,"color":69,"cover_image":20,"created_at":70,"post_count":40},4,{"en":58,"ja":59,"zh":60,"zh_Hant":61},"Backend","バックエンド","后端","後端","backend",{"en":64,"ja":65,"zh":66,"zh_Hant":67},"Server-side development best practices including API design, database optimization, and microservices architecture","API設計、データベース最適化、マイクロサービスアーキテクチャを含むサーバーサイド開発の実践","服务端开发实战经验，API设计、数据库优化、微服务架构等深度内容","服務端開發實戰經驗，API設計、數據庫優化、微服務架構等深度內容","heroicons:server-stack","#f59e0b","2026-09-30T18:09:53.647836Z",{"id":72,"name":73,"slug":78,"description":79,"icon":84,"color":85,"cover_image":20,"created_at":86,"post_count":87},5,{"en":74,"ja":75,"zh":76,"zh_Hant":77},"Fullstack","フルスタック","全栈","全棧","fullstack",{"en":80,"ja":81,"zh":82,"zh_Hant":83},"End-to-end development guides covering the full project lifecycle and technology stack selection","フロントエンドからバックエンドまでの開発プロセス全体をカバーするガイド","从前端到后端的全流程开发指南，覆盖完整项目生命周期与技术选型","從前端到後端的全流程開發指南，覆蓋完整項目生命週期與技術選型","heroicons:swatch","#8b5cf6","2026-09-30T18:09:53.650513Z",0,{"id":38,"name":89,"slug":94,"description":95,"icon":100,"color":101,"cover_image":20,"created_at":102,"post_count":56},{"en":90,"ja":91,"zh":92,"zh_Hant":93},"Essays","エッセイ","随笔","隨筆","essays",{"en":96,"ja":97,"zh":98,"zh_Hant":99},"Technical reflections and development insights recording the programmer's growth journey","プログラマーの成長の軌跡を記録する技術的考察と開発の洞察","技术思考与开发心得分享，记录程序员成长路上的点滴感悟","技術思考與開發心得分享，記錄程序員成長路上的點滴感悟","heroicons:pencil-square","#f43f5e","2026-09-30T18:09:53.653105Z",{"id":54,"name":104,"slug":108,"description":109,"icon":114,"color":115,"cover_image":20,"created_at":116,"post_count":56},{"en":105,"ja":106,"zh":107,"zh_Hant":107},"Tools","ツール","工具","tools",{"en":110,"ja":111,"zh":112,"zh_Hant":113},"Development toolchain and productivity tool recommendations to supercharge your development experience","開発効率を飛躍的に向上させるツールチェーンと生産性ツールの推奨","开发工具链与效率提升利器推荐，让你的开发体验如虎添翼","開發工具鏈與效率提升利器推薦，讓你的開發體驗如虎添翼","heroicons:wrench-screwdriver","#06b6d4","2026-09-30T18:09:53.655605Z",{"id":22,"name":118,"slug":123,"description":124,"icon":129,"color":130,"cover_image":20,"created_at":131,"post_count":87},{"en":119,"ja":120,"zh":121,"zh_Hant":122},"Translation","翻訳","翻译","翻譯","translation",{"en":125,"ja":126,"zh":127,"zh_Hant":128},"Curated translations of high-quality foreign technical articles to keep up with international trends","国際的な技術トレンドを追うための厳選された海外技術記事の翻訳","优质外文技术文章精选翻译，紧跟国际技术前沿动态","優質外文技術文章精選翻譯，緊跟國際技術前沿動態","heroicons:language","#84cc16","2026-09-30T18:09:53.658041Z",{"id":40,"name":133,"slug":135,"color":136,"icon":20,"is_active":137,"created_at":138,"post_count":72},{"en":134,"ja":134,"zh":134,"zh_Hant":134},"Vue","vue","#42b883",true,"2026-09-30T18:09:53.672512Z",[140,150,156,163,170,177],{"id":6,"title":141,"url":146,"icon":20,"parent_id":20,"location":147,"order":6,"is_active":137,"target_blank":148,"created_at":149,"updated_at":20},{"zh":142,"en":143,"ja":144,"zh_TW":145},"首页","Home","ホーム","首頁","\u002F","header",false,"2026-09-30T18:09:54.251095Z",{"id":24,"title":151,"url":155,"icon":20,"parent_id":20,"location":147,"order":24,"is_active":137,"target_blank":148,"created_at":149,"updated_at":20},{"zh":152,"en":153,"ja":154,"zh_TW":152},"文章","Posts","記事","\u002Fposts",{"id":40,"title":157,"url":162,"icon":20,"parent_id":20,"location":147,"order":40,"is_active":137,"target_blank":148,"created_at":149,"updated_at":20},{"zh":158,"en":159,"ja":160,"zh_TW":161},"分类","Categories","カテゴリー","分類","\u002Fcategories",{"id":56,"title":164,"url":169,"icon":20,"parent_id":20,"location":147,"order":56,"is_active":137,"target_blank":148,"created_at":149,"updated_at":20},{"zh":165,"en":166,"ja":167,"zh_TW":168},"标签","Tags","タグ","標籤","\u002Ftags",{"id":72,"title":171,"url":176,"icon":20,"parent_id":20,"location":147,"order":72,"is_active":137,"target_blank":148,"created_at":149,"updated_at":20},{"zh":172,"en":173,"ja":174,"zh_TW":175},"关于","About","概要","關於","\u002Fpage\u002Fabout",{"id":38,"title":178,"url":182,"icon":20,"parent_id":20,"location":147,"order":38,"is_active":137,"target_blank":148,"created_at":149,"updated_at":20},{"zh":179,"en":180,"ja":181,"zh_TW":179},"留言板","Guestbook","ゲストブック","\u002Fpage\u002Fguestbook",{"items":184,"total":72,"page":6,"page_size":295,"total_pages":6},[185,216,241,260,276],{"id":186,"title":187,"subtitle":20,"slug":188,"excerpt":189,"cover_image":20,"author":190,"category":193,"tags":194,"status":212,"views":213,"likes_count":87,"comments_count":38,"is_pinned":148,"created_at":214,"published_at":214,"updated_at":215,"reading_time":6},30,"PWA 离线应用实战：Service Worker + IndexedDB + Background Sync","post-30-PWA离线应用实战","逐步构建可安装、可离线运行、网络恢复自动同步的 Progressive Web App：Service Worker 缓存策略（Cache First \u002F Stale-While-Revalidate）、IndexedDB 封装结构化本地数据、Background Sync 后台队列在用户离线操作后网络恢复时自动提交变更，附完整 TS 代码。",{"id":6,"username":191,"nickname":191,"avatar":20,"cover_image":20,"bio":20,"website":20,"github":20,"avatar_source":20,"resolved_avatar_url":20,"title":20,"created_at":192},"Choyeon","2026-09-30T18:09:53.330367Z",{"id":40,"name":44,"slug":45,"description":49,"icon":51,"color":52,"cover_image":20,"created_at":53,"post_count":87},[195,200,205,206],{"id":54,"name":196,"slug":197,"color":198,"icon":20,"is_active":137,"created_at":199,"post_count":87},"JavaScript","javascript","#f7df1e","2026-09-30T18:09:53.683194Z",{"id":38,"name":201,"slug":202,"color":203,"icon":20,"is_active":137,"created_at":204,"post_count":87},"TypeScript","typescript","#3178c6","2026-09-30T18:09:53.680697Z",{"id":40,"name":134,"slug":135,"color":136,"icon":20,"is_active":137,"created_at":138,"post_count":87},{"id":207,"name":208,"slug":209,"color":210,"icon":20,"is_active":137,"created_at":211,"post_count":87},20,"Next.js","nextjs","#000000","2026-09-30T18:09:53.721362Z","published",173,"2026-09-28T13:09:53.733462Z","2026-10-01T10:32:41.195068Z",{"id":217,"title":218,"subtitle":20,"slug":219,"excerpt":220,"cover_image":20,"author":221,"category":222,"tags":223,"status":212,"views":237,"likes_count":87,"comments_count":238,"is_pinned":148,"created_at":239,"published_at":239,"updated_at":240,"reading_time":6},29,"Tailwind CSS v4 新特性：Zero-config + CSS-native 变量","post-29-TailwindC","Tailwind CSS v4 是一次架构级升级：彻底抛弃 tailwind.config.js，用 @theme 块在原生 CSS 文件声明设计令牌；新增 @import \"tailwindcss\" 单入口代替 postcss.config；内置 CSS 变量、容器查询原生支持、oxc 引擎提速 10-40 倍、颜色函数简化。",{"id":6,"username":191,"nickname":191,"avatar":20,"cover_image":20,"bio":20,"website":20,"github":20,"avatar_source":20,"resolved_avatar_url":20,"title":20,"created_at":192},{"id":40,"name":44,"slug":45,"description":49,"icon":51,"color":52,"cover_image":20,"created_at":53,"post_count":87},[224,230,231,236],{"id":225,"name":226,"slug":227,"color":228,"icon":20,"is_active":137,"created_at":229,"post_count":87},14,"CSS","css","#1572b6","2026-09-30T18:09:53.704077Z",{"id":38,"name":201,"slug":202,"color":203,"icon":20,"is_active":137,"created_at":204,"post_count":87},{"id":56,"name":232,"slug":233,"color":234,"icon":20,"is_active":137,"created_at":235,"post_count":87},"React","react","#61dafb","2026-09-30T18:09:53.675301Z",{"id":40,"name":134,"slug":135,"color":136,"icon":20,"is_active":137,"created_at":138,"post_count":87},345,10,"2026-09-26T09:09:53.733462Z","2026-10-02T00:04:32.576406Z",{"id":238,"title":242,"subtitle":20,"slug":243,"excerpt":244,"cover_image":20,"author":245,"category":246,"tags":247,"status":212,"views":257,"likes_count":87,"comments_count":24,"is_pinned":148,"created_at":258,"published_at":258,"updated_at":259,"reading_time":6},"CSS Container Queries 完全指南","post-10-CSSContai","彻底掌握现代响应式 CSS：Container Queries 让组件基于父容器尺寸自适应（而非视口），配合 :has() 父选择器实现依赖后代状态的样式变化，彻底改变组件化响应式设计范式。",{"id":6,"username":191,"nickname":191,"avatar":20,"cover_image":20,"bio":20,"website":20,"github":20,"avatar_source":20,"resolved_avatar_url":20,"title":20,"created_at":192},{"id":40,"name":44,"slug":45,"description":49,"icon":51,"color":52,"cover_image":20,"created_at":53,"post_count":87},[248,249,250,251],{"id":225,"name":226,"slug":227,"color":228,"icon":20,"is_active":137,"created_at":229,"post_count":87},{"id":40,"name":134,"slug":135,"color":136,"icon":20,"is_active":137,"created_at":138,"post_count":87},{"id":56,"name":232,"slug":233,"color":234,"icon":20,"is_active":137,"created_at":235,"post_count":87},{"id":252,"name":253,"slug":254,"color":255,"icon":20,"is_active":137,"created_at":256,"post_count":87},15,"性能优化","performance","#f97316","2026-09-30T18:09:53.707190Z",393,"2026-08-31T18:09:53.733462Z","2026-10-02T00:03:32.040924Z",{"id":40,"title":261,"subtitle":20,"slug":262,"excerpt":263,"cover_image":20,"author":264,"category":265,"tags":266,"status":212,"views":273,"likes_count":87,"comments_count":56,"is_pinned":148,"created_at":274,"published_at":274,"updated_at":275,"reading_time":6},"Vue 3 组合式 API 实战","post-3-Vue3组合式","Vue 3 的组合式 API (Composition API) 彻底改变了 Vue 组件的组织方式。本文通过构建一个复杂的电商筛选器组件，演示 ref\u002Freactive 的选择、computed\u002Fwatch 的合理使用、自定义组合函数 (Composable) 的抽离原则、生命周期钩子的时机以及 provide\u002Finject 进行跨层级状态传递的正确姿势。",{"id":6,"username":191,"nickname":191,"avatar":20,"cover_image":20,"bio":20,"website":20,"github":20,"avatar_source":20,"resolved_avatar_url":20,"title":20,"created_at":192},{"id":40,"name":44,"slug":45,"description":49,"icon":51,"color":52,"cover_image":20,"created_at":53,"post_count":87},[267,268,269],{"id":40,"name":134,"slug":135,"color":136,"icon":20,"is_active":137,"created_at":138,"post_count":87},{"id":38,"name":201,"slug":202,"color":203,"icon":20,"is_active":137,"created_at":204,"post_count":87},{"id":270,"name":42,"slug":45,"color":271,"icon":20,"is_active":137,"created_at":272,"post_count":87},26,"#94a3b8","2026-09-30T18:09:53.760103Z",620,"2026-08-21T15:09:53.733462Z","2026-09-30T21:02:54.379568Z",{"id":24,"title":277,"subtitle":20,"slug":278,"excerpt":279,"cover_image":20,"author":280,"category":281,"tags":282,"status":212,"views":292,"likes_count":87,"comments_count":38,"is_pinned":148,"created_at":293,"published_at":293,"updated_at":294,"reading_time":6},"Nuxt 3 进阶 - SSR 与 SSG 深度解析","post-2-Nuxt3进阶","Nuxt 3 基于 Vue 3 和 Vite 构建，带来了全新的渲染引擎 Nitro。本文深入剖析服务端渲染(SSR)、静态站点生成(SSG)、增量静态再生(ISR)三种核心模式的工作原理、适用场景与性能差异。配合真实代码演示如何配置渲染策略、优化首屏加载时间、处理缓存策略，打造极致用户体验。",{"id":6,"username":191,"nickname":191,"avatar":20,"cover_image":20,"bio":20,"website":20,"github":20,"avatar_source":20,"resolved_avatar_url":20,"title":20,"created_at":192},{"id":24,"name":28,"slug":29,"description":33,"icon":35,"color":36,"cover_image":20,"created_at":37,"post_count":87},[283,289,290,291],{"id":284,"name":285,"slug":286,"color":287,"icon":20,"is_active":137,"created_at":288,"post_count":87},19,"Nuxt","nuxt","#00dc82","2026-09-30T18:09:53.718454Z",{"id":40,"name":134,"slug":135,"color":136,"icon":20,"is_active":137,"created_at":138,"post_count":87},{"id":270,"name":42,"slug":45,"color":271,"icon":20,"is_active":137,"created_at":272,"post_count":87},{"id":252,"name":253,"slug":254,"color":255,"icon":20,"is_active":137,"created_at":256,"post_count":87},394,"2026-08-18T23:09:53.733462Z","2026-10-01T10:19:19.004506Z",9]