[{"data":1,"prerenderedAt":2912},["ShallowReactive",2],{"article-/topics/nuxt/nuxt-compatibility-layer-gradual-upgrade-guide":3,"related-nuxt":349,"content-query-03EbV5Glcg":2661},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"date":10,"topic":5,"author":11,"tags":12,"image":18,"imageQuery":19,"pexelsPhotoId":20,"pexelsUrl":21,"featured":6,"readingTime":22,"body":23,"_type":343,"_id":344,"_source":345,"_file":346,"_stem":347,"_extension":348},"/topics/nuxt/nuxt-compatibility-layer-gradual-upgrade-guide","nuxt",false,"","兼容层与渐进式升级：把 Nuxt 升级从一次性迁移改造成可控工程过程","Nuxt 升级最怕的不是改动多，而是改动无法分批验证。本文从 compatibility layer、灰度迁移和风险隔离出发，讲清如何把版本升级做成渐进式工程过程。","2026-04-28","HTMLPAGE 团队",[13,14,15,16,17],"Nuxt","Compatibility Layer","Migration Strategy","Upgrade","Engineering Process","/images/topics/nuxt/nuxt-compatibility-layer-gradual-upgrade-guide.jpg","software upgrade migration planning on laptop workspace",34803987,"https://www.pexels.com/photo/laptop-displaying-code-with-colorful-lighting-34803987/",14,{"type":24,"children":25,"toc":332},"root",[26,34,39,46,51,71,76,81,86,114,119,125,130,153,158,171,176,181,186,191,209,214,220,225,248,253,258,286,291,296,301],{"type":27,"tag":28,"props":29,"children":30},"element","p",{},[31],{"type":32,"value":33},"text","很多团队害怕升级 Nuxt，并不是因为不知道要改什么，而是担心一旦开始，就会牵一发动全身。页面、模块、构建、部署、监控全部受影响，最后升级项目变成一场高风险切换。",{"type":27,"tag":28,"props":35,"children":36},{},[37],{"type":32,"value":38},"兼容层与渐进式升级的价值，就在于把这类“大切换”拆成多个可验证的小步骤。",{"type":27,"tag":40,"props":41,"children":43},"h2",{"id":42},"兼容层的核心作用是给团队争取验证空间",[44],{"type":32,"value":45},"兼容层的核心作用，是给团队争取验证空间",{"type":27,"tag":28,"props":47,"children":48},{},[49],{"type":32,"value":50},"兼容层不是为了长期停留在“半新半旧”的状态，而是为了在迁移期间降低切换成本。它通常承担几个职责：",{"type":27,"tag":52,"props":53,"children":54},"ul",{},[55,61,66],{"type":27,"tag":56,"props":57,"children":58},"li",{},[59],{"type":32,"value":60},"让旧代码在新版本下先跑起来",{"type":27,"tag":56,"props":62,"children":63},{},[64],{"type":32,"value":65},"给模块和插件留出适配窗口",{"type":27,"tag":56,"props":67,"children":68},{},[69],{"type":32,"value":70},"让团队可以逐段验证而不是一次性梭哈",{"type":27,"tag":28,"props":72,"children":73},{},[74],{"type":32,"value":75},"因此兼容层更像升级过程中的缓冲区，而不是最终架构。",{"type":27,"tag":40,"props":77,"children":79},{"id":78},"渐进式升级要先拆出独立验证面",[80],{"type":32,"value":78},{"type":27,"tag":28,"props":82,"children":83},{},[84],{"type":32,"value":85},"想把升级做得可控，第一步不是立刻改代码，而是先把系统拆成能独立观察的验证面：",{"type":27,"tag":52,"props":87,"children":88},{},[89,94,99,104,109],{"type":27,"tag":56,"props":90,"children":91},{},[92],{"type":32,"value":93},"构建链路",{"type":27,"tag":56,"props":95,"children":96},{},[97],{"type":32,"value":98},"页面渲染",{"type":27,"tag":56,"props":100,"children":101},{},[102],{"type":32,"value":103},"数据获取",{"type":27,"tag":56,"props":105,"children":106},{},[107],{"type":32,"value":108},"中间件和认证",{"type":27,"tag":56,"props":110,"children":111},{},[112],{"type":32,"value":113},"第三方模块",{"type":27,"tag":28,"props":115,"children":116},{},[117],{"type":32,"value":118},"这样每推进一段，都能知道风险主要落在哪一层，而不是所有问题混在一起。",{"type":27,"tag":40,"props":120,"children":122},{"id":121},"先处理高收益低耦合部分再推进核心链路",[123],{"type":32,"value":124},"先处理高收益低耦合部分，再推进核心链路",{"type":27,"tag":28,"props":126,"children":127},{},[128],{"type":32,"value":129},"更稳的升级顺序通常不是从最核心页面开始，而是从收益明显、耦合较低的部分先试点：",{"type":27,"tag":52,"props":131,"children":132},{},[133,138,143,148],{"type":27,"tag":56,"props":134,"children":135},{},[136],{"type":32,"value":137},"配置项和目录结构",{"type":27,"tag":56,"props":139,"children":140},{},[141],{"type":32,"value":142},"基础模块兼容性",{"type":27,"tag":56,"props":144,"children":145},{},[146],{"type":32,"value":147},"少量低风险页面",{"type":27,"tag":56,"props":149,"children":150},{},[151],{"type":32,"value":152},"核心业务流最后验证",{"type":27,"tag":28,"props":154,"children":155},{},[156],{"type":32,"value":157},"这种策略的价值在于，团队能先建立对新版本的理解，再处理最难的业务链路。",{"type":27,"tag":159,"props":160,"children":165},"pre",{"className":161,"code":163,"language":164,"meta":7},[162],"language-ts","export default defineNuxtConfig({\n  future: {\n    compatibilityVersion: 4,\n  },\n})\n","ts",[166],{"type":27,"tag":167,"props":168,"children":169},"code",{"__ignoreMap":7},[170],{"type":32,"value":163},{"type":27,"tag":28,"props":172,"children":173},{},[174],{"type":32,"value":175},"类似配置的意义，不是“一键完成升级”，而是帮助团队在迁移期明确当前处于哪一阶段。",{"type":27,"tag":40,"props":177,"children":179},{"id":178},"兼容层期间要严格限制新增技术债",[180],{"type":32,"value":178},{"type":27,"tag":28,"props":182,"children":183},{},[184],{"type":32,"value":185},"很多迁移项目失败，不是因为兼容层没价值，而是因为一边迁移、一边继续往旧模式里加新代码。这样会让系统长期停在过渡态。",{"type":27,"tag":28,"props":187,"children":188},{},[189],{"type":32,"value":190},"更稳的做法是明确规则：",{"type":27,"tag":52,"props":192,"children":193},{},[194,199,204],{"type":27,"tag":56,"props":195,"children":196},{},[197],{"type":32,"value":198},"新代码优先按新约定写",{"type":27,"tag":56,"props":200,"children":201},{},[202],{"type":32,"value":203},"旧代码只做必要修补，不再扩大旧模式",{"type":27,"tag":56,"props":205,"children":206},{},[207],{"type":32,"value":208},"兼容层存在的模块要有清理期限",{"type":27,"tag":28,"props":210,"children":211},{},[212],{"type":32,"value":213},"如果没有退出机制，兼容层会从缓冲区变成永久负担。",{"type":27,"tag":40,"props":215,"children":217},{"id":216},"一个常见失败案例升级计划存在但始终推进不完",[218],{"type":32,"value":219},"一个常见失败案例：升级计划存在，但始终推进不完",{"type":27,"tag":28,"props":221,"children":222},{},[223],{"type":32,"value":224},"这类项目通常会出现：",{"type":27,"tag":52,"props":226,"children":227},{},[228,233,238,243],{"type":27,"tag":56,"props":229,"children":230},{},[231],{"type":32,"value":232},"没拆验证面，问题一来就是全局性",{"type":27,"tag":56,"props":234,"children":235},{},[236],{"type":32,"value":237},"兼容层没有退出时间",{"type":27,"tag":56,"props":239,"children":240},{},[241],{"type":32,"value":242},"新旧模式长期并存",{"type":27,"tag":56,"props":244,"children":245},{},[246],{"type":32,"value":247},"缺少基线和回滚策略",{"type":27,"tag":28,"props":249,"children":250},{},[251],{"type":32,"value":252},"最后升级不再是工程项目，而变成持续消耗团队精力的背景噪音。",{"type":27,"tag":40,"props":254,"children":256},{"id":255},"一份可直接复用的检查清单",[257],{"type":32,"value":255},{"type":27,"tag":52,"props":259,"children":260},{},[261,266,271,276,281],{"type":27,"tag":56,"props":262,"children":263},{},[264],{"type":32,"value":265},"兼容层是否被当作迁移缓冲区，而不是长期方案",{"type":27,"tag":56,"props":267,"children":268},{},[269],{"type":32,"value":270},"是否先拆出了可独立验证的构建、渲染和模块边界",{"type":27,"tag":56,"props":272,"children":273},{},[274],{"type":32,"value":275},"升级顺序是否遵循先低耦合后核心链路的原则",{"type":27,"tag":56,"props":277,"children":278},{},[279],{"type":32,"value":280},"迁移期间是否限制了旧模式的继续扩张",{"type":27,"tag":56,"props":282,"children":283},{},[284],{"type":32,"value":285},"兼容层是否有明确退出条件、时间点和回滚策略",{"type":27,"tag":40,"props":287,"children":289},{"id":288},"总结",[290],{"type":32,"value":288},{"type":27,"tag":28,"props":292,"children":293},{},[294],{"type":32,"value":295},"兼容层与渐进式升级的本质，是把版本迁移从一次性风险事件改造成分阶段工程过程。只要先把验证面、试点顺序和退出机制设计清楚，Nuxt 升级就会更像项目管理问题，而不是纯粹的技术赌博。",{"type":27,"tag":28,"props":297,"children":298},{},[299],{"type":32,"value":300},"进一步阅读：",{"type":27,"tag":52,"props":302,"children":303},{},[304,314,323],{"type":27,"tag":56,"props":305,"children":306},{},[307],{"type":27,"tag":308,"props":309,"children":311},"a",{"href":310},"/topics/nuxt/nuxt4-migration-complete-guide",[312],{"type":32,"value":313},"Nuxt 4 迁移完整指南",{"type":27,"tag":56,"props":315,"children":316},{},[317],{"type":27,"tag":308,"props":318,"children":320},{"href":319},"/topics/nuxt/nuxt4-new-directory-structure-conventions",[321],{"type":32,"value":322},"Nuxt 新文件结构与约定变化",{"type":27,"tag":56,"props":324,"children":325},{},[326],{"type":27,"tag":308,"props":327,"children":329},{"href":328},"/topics/nuxt/nuxt-runtime-config-management",[330],{"type":32,"value":331},"Nuxt 运行时配置管理",{"title":7,"searchDepth":333,"depth":333,"links":334},3,[335,337,338,339,340,341,342],{"id":42,"depth":336,"text":45},2,{"id":78,"depth":336,"text":78},{"id":121,"depth":336,"text":124},{"id":178,"depth":336,"text":178},{"id":216,"depth":336,"text":219},{"id":255,"depth":336,"text":255},{"id":288,"depth":336,"text":288},"markdown","content:topics:nuxt:nuxt-compatibility-layer-gradual-upgrade-guide.md","content","topics/nuxt/nuxt-compatibility-layer-gradual-upgrade-guide.md","topics/nuxt/nuxt-compatibility-layer-gradual-upgrade-guide","md",[350,1337,2121],{"_path":351,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":352,"description":353,"date":354,"topic":5,"author":11,"tags":355,"image":361,"featured":362,"readingTime":363,"body":364,"_type":343,"_id":1334,"_source":345,"_file":1335,"_stem":1336,"_extension":348},"/topics/nuxt/nitro-engine-deep-dive","Nitro 引擎深度剖析","讲透 Nuxt/Nitro 的运行时模型、路由与中间件、存储层与缓存、部署适配与性能调优，帮助你把服务端能力当成可控的工程系统。","2026-01-20",[13,356,357,358,359,360],"Nitro","SSR","Serverless","Edge","缓存","/images/topics/nuxt/nitro.jpg",true,21,{"type":24,"children":365,"toc":1302},[366,371,384,389,447,452,457,461,467,472,496,501,519,522,528,533,556,561,564,586,598,616,627,640,646,669,672,678,683,714,719,732,735,741,753,766,771,789,794,807,810,816,821,839,845,864,870,875,880,909,912,918,923,941,946,964,970,983,989,1002,1008,1021,1026,1039,1042,1048,1054,1067,1073,1086,1092,1105,1108,1114,1119,1142,1147,1160,1163,1169,1174,1232,1237,1255,1258,1262,1274,1279],{"type":27,"tag":40,"props":367,"children":369},{"id":368},"nitro-引擎深度剖析",[370],{"type":32,"value":352},{"type":27,"tag":28,"props":372,"children":373},{},[374,376,382],{"type":32,"value":375},"在 Nuxt 3/4 的体系里，Nitro 不是“一个服务器”，而是一套",{"type":27,"tag":377,"props":378,"children":379},"strong",{},[380],{"type":32,"value":381},"可移植的服务端运行时与构建产物规范",{"type":32,"value":383},"。",{"type":27,"tag":28,"props":385,"children":386},{},[387],{"type":32,"value":388},"它把你在开发时写的：",{"type":27,"tag":52,"props":390,"children":391},{},[392,403,414,425,436],{"type":27,"tag":56,"props":393,"children":394},{},[395,401],{"type":27,"tag":167,"props":396,"children":398},{"className":397},[],[399],{"type":32,"value":400},"server/api/*",{"type":32,"value":402},"（API 路由）",{"type":27,"tag":56,"props":404,"children":405},{},[406,412],{"type":27,"tag":167,"props":407,"children":409},{"className":408},[],[410],{"type":32,"value":411},"server/routes/*",{"type":32,"value":413},"（更底层路由）",{"type":27,"tag":56,"props":415,"children":416},{},[417,423],{"type":27,"tag":167,"props":418,"children":420},{"className":419},[],[421],{"type":32,"value":422},"server/middleware/*",{"type":32,"value":424},"（中间件）",{"type":27,"tag":56,"props":426,"children":427},{},[428,434],{"type":27,"tag":167,"props":429,"children":431},{"className":430},[],[432],{"type":32,"value":433},"server/plugins/*",{"type":32,"value":435},"（启动插件）",{"type":27,"tag":56,"props":437,"children":438},{},[439,445],{"type":27,"tag":167,"props":440,"children":442},{"className":441},[],[443],{"type":32,"value":444},"storage",{"type":32,"value":446},"（KV/文件/内存等存储抽象）",{"type":27,"tag":28,"props":448,"children":449},{},[450],{"type":32,"value":451},"统一编译成一个可以部署到多种环境的产物：Node Server、Serverless、Edge（取决于适配器与能力集）。",{"type":27,"tag":28,"props":453,"children":454},{},[455],{"type":32,"value":456},"这篇文章按“你要在生产上稳定运行”的视角，拆解 Nitro 的关键构件，并给出性能与可观测性落地建议。",{"type":27,"tag":458,"props":459,"children":460},"hr",{},[],{"type":27,"tag":40,"props":462,"children":464},{"id":463},"_1-nitro-的定位从-nuxt-ssr-到通用服务端运行时",[465],{"type":32,"value":466},"1. Nitro 的定位：从 Nuxt SSR 到“通用服务端运行时”",{"type":27,"tag":28,"props":468,"children":469},{},[470],{"type":32,"value":471},"Nitro 解决两类问题：",{"type":27,"tag":473,"props":474,"children":475},"ol",{},[476,486],{"type":27,"tag":56,"props":477,"children":478},{},[479,484],{"type":27,"tag":377,"props":480,"children":481},{},[482],{"type":32,"value":483},"运行时统一",{"type":32,"value":485},"：开发/生产环境一致的请求处理模型",{"type":27,"tag":56,"props":487,"children":488},{},[489,494],{"type":27,"tag":377,"props":490,"children":491},{},[492],{"type":32,"value":493},"部署可移植",{"type":32,"value":495},"：同一套代码可输出到不同部署目标",{"type":27,"tag":28,"props":497,"children":498},{},[499],{"type":32,"value":500},"你可以把 Nitro 看作 Nuxt 的“服务端内核”，而 Nuxt 只是围绕它提供：",{"type":27,"tag":52,"props":502,"children":503},{},[504,509,514],{"type":27,"tag":56,"props":505,"children":506},{},[507],{"type":32,"value":508},"视图渲染（SSR/RSC 相关能力）",{"type":27,"tag":56,"props":510,"children":511},{},[512],{"type":32,"value":513},"资源构建（Vite/Webpack）",{"type":27,"tag":56,"props":515,"children":516},{},[517],{"type":32,"value":518},"路由与数据获取的上层抽象",{"type":27,"tag":458,"props":520,"children":521},{},[],{"type":27,"tag":40,"props":523,"children":525},{"id":524},"_2-请求生命周期一次请求在-nitro-里怎么走",[526],{"type":32,"value":527},"2. 请求生命周期：一次请求在 Nitro 里怎么走？",{"type":27,"tag":28,"props":529,"children":530},{},[531],{"type":32,"value":532},"简化后的请求链路：",{"type":27,"tag":473,"props":534,"children":535},{},[536,541,546,551],{"type":27,"tag":56,"props":537,"children":538},{},[539],{"type":32,"value":540},"入口适配器接收请求（Node/Serverless/Edge）",{"type":27,"tag":56,"props":542,"children":543},{},[544],{"type":32,"value":545},"进入 Nitro 的 H3 请求处理器（统一事件模型）",{"type":27,"tag":56,"props":547,"children":548},{},[549],{"type":32,"value":550},"依次执行：中间件 → 路由匹配 → handler",{"type":27,"tag":56,"props":552,"children":553},{},[554],{"type":32,"value":555},"写回响应（含 headers、缓存策略、流式输出等）",{"type":27,"tag":28,"props":557,"children":558},{},[559],{"type":32,"value":560},"关键点：Nitro 用统一的事件对象承载请求上下文，这让你在不同部署目标下写出的 server 代码保持一致。",{"type":27,"tag":458,"props":562,"children":563},{},[],{"type":27,"tag":40,"props":565,"children":567},{"id":566},"_3-路由系统serverapi-与-serverroutes-的区别",[568,570,576,578,584],{"type":32,"value":569},"3. 路由系统：",{"type":27,"tag":167,"props":571,"children":573},{"className":572},[],[574],{"type":32,"value":575},"server/api",{"type":32,"value":577}," 与 ",{"type":27,"tag":167,"props":579,"children":581},{"className":580},[],[582],{"type":32,"value":583},"server/routes",{"type":32,"value":585}," 的区别",{"type":27,"tag":587,"props":588,"children":590},"h3",{"id":589},"_31-serverapi",[591,593],{"type":32,"value":592},"3.1 ",{"type":27,"tag":167,"props":594,"children":596},{"className":595},[],[597],{"type":32,"value":400},{"type":27,"tag":52,"props":599,"children":600},{},[601,606,611],{"type":27,"tag":56,"props":602,"children":603},{},[604],{"type":32,"value":605},"面向 API 的约定式目录",{"type":27,"tag":56,"props":607,"children":608},{},[609],{"type":32,"value":610},"通常返回 JSON",{"type":27,"tag":56,"props":612,"children":613},{},[614],{"type":32,"value":615},"与 Nuxt 的开发体验高度整合",{"type":27,"tag":587,"props":617,"children":619},{"id":618},"_32-serverroutes",[620,622],{"type":32,"value":621},"3.2 ",{"type":27,"tag":167,"props":623,"children":625},{"className":624},[],[626],{"type":32,"value":411},{"type":27,"tag":52,"props":628,"children":629},{},[630,635],{"type":27,"tag":56,"props":631,"children":632},{},[633],{"type":32,"value":634},"更底层，更贴近“HTTP 路由”",{"type":27,"tag":56,"props":636,"children":637},{},[638],{"type":32,"value":639},"更适合做：Webhook、回调、代理、特殊 content-type",{"type":27,"tag":587,"props":641,"children":643},{"id":642},"_33-实践建议",[644],{"type":32,"value":645},"3.3 实践建议",{"type":27,"tag":52,"props":647,"children":648},{},[649,659],{"type":27,"tag":56,"props":650,"children":651},{},[652,654],{"type":32,"value":653},"普通业务 API：优先 ",{"type":27,"tag":167,"props":655,"children":657},{"className":656},[],[658],{"type":32,"value":575},{"type":27,"tag":56,"props":660,"children":661},{},[662,664],{"type":32,"value":663},"需要更强控制（stream、代理、非 JSON）：用 ",{"type":27,"tag":167,"props":665,"children":667},{"className":666},[],[668],{"type":32,"value":583},{"type":27,"tag":458,"props":670,"children":671},{},[],{"type":27,"tag":40,"props":673,"children":675},{"id":674},"_4-中间件全局逻辑的正确放置",[676],{"type":32,"value":677},"4. 中间件：全局逻辑的正确放置",{"type":27,"tag":28,"props":679,"children":680},{},[681],{"type":32,"value":682},"Nitro 中的中间件通常用于：",{"type":27,"tag":52,"props":684,"children":685},{},[686,691,704,709],{"type":27,"tag":56,"props":687,"children":688},{},[689],{"type":32,"value":690},"鉴权/鉴别请求来源",{"type":27,"tag":56,"props":692,"children":693},{},[694,696,702],{"type":32,"value":695},"注入 ",{"type":27,"tag":167,"props":697,"children":699},{"className":698},[],[700],{"type":32,"value":701},"requestId",{"type":32,"value":703},"、trace 信息",{"type":27,"tag":56,"props":705,"children":706},{},[707],{"type":32,"value":708},"统一错误处理与日志",{"type":27,"tag":56,"props":710,"children":711},{},[712],{"type":32,"value":713},"基础安全 headers",{"type":27,"tag":28,"props":715,"children":716},{},[717],{"type":32,"value":718},"一个推荐的中间件职责边界：",{"type":27,"tag":52,"props":720,"children":721},{},[722,727],{"type":27,"tag":56,"props":723,"children":724},{},[725],{"type":32,"value":726},"中间件只做“横切关注点”",{"type":27,"tag":56,"props":728,"children":729},{},[730],{"type":32,"value":731},"不做具体业务（避免耦合与隐式依赖）",{"type":27,"tag":458,"props":733,"children":734},{},[],{"type":27,"tag":40,"props":736,"children":738},{"id":737},"_5-storage-抽象让缓存与数据存取可替换",[739],{"type":32,"value":740},"5. Storage 抽象：让缓存与数据存取可替换",{"type":27,"tag":28,"props":742,"children":743},{},[744,746,751],{"type":32,"value":745},"Nitro 的一个被低估的能力是 ",{"type":27,"tag":167,"props":747,"children":749},{"className":748},[],[750],{"type":32,"value":444},{"type":32,"value":752},"：",{"type":27,"tag":52,"props":754,"children":755},{},[756,761],{"type":27,"tag":56,"props":757,"children":758},{},[759],{"type":32,"value":760},"提供 KV 风格 API",{"type":27,"tag":56,"props":762,"children":763},{},[764],{"type":32,"value":765},"可接入内存、文件、Redis 等（取决于配置与环境）",{"type":27,"tag":28,"props":767,"children":768},{},[769],{"type":32,"value":770},"你可以用它做：",{"type":27,"tag":52,"props":772,"children":773},{},[774,779,784],{"type":27,"tag":56,"props":775,"children":776},{},[777],{"type":32,"value":778},"缓存（页面片段、API 结果）",{"type":27,"tag":56,"props":780,"children":781},{},[782],{"type":32,"value":783},"限流计数器",{"type":27,"tag":56,"props":785,"children":786},{},[787],{"type":32,"value":788},"临时会话信息",{"type":27,"tag":28,"props":790,"children":791},{},[792],{"type":32,"value":793},"设计原则：",{"type":27,"tag":52,"props":795,"children":796},{},[797,802],{"type":27,"tag":56,"props":798,"children":799},{},[800],{"type":32,"value":801},"把 storage 当成“可失效缓存”，不要当主数据库",{"type":27,"tag":56,"props":803,"children":804},{},[805],{"type":32,"value":806},"明确 TTL 与清理策略",{"type":27,"tag":458,"props":808,"children":809},{},[],{"type":27,"tag":40,"props":811,"children":813},{"id":812},"_6-缓存策略把快变成可控的工程能力",[814],{"type":32,"value":815},"6. 缓存策略：把“快”变成可控的工程能力",{"type":27,"tag":28,"props":817,"children":818},{},[819],{"type":32,"value":820},"Nitro 里的缓存往往涉及三层：",{"type":27,"tag":473,"props":822,"children":823},{},[824,829,834],{"type":27,"tag":56,"props":825,"children":826},{},[827],{"type":32,"value":828},"CDN 缓存（边缘）",{"type":27,"tag":56,"props":830,"children":831},{},[832],{"type":32,"value":833},"Nitro 运行时缓存（storage）",{"type":27,"tag":56,"props":835,"children":836},{},[837],{"type":32,"value":838},"上游服务缓存（数据库/服务端）",{"type":27,"tag":587,"props":840,"children":842},{"id":841},"_61-api-缓存的推荐做法",[843],{"type":32,"value":844},"6.1 API 缓存的推荐做法",{"type":27,"tag":52,"props":846,"children":847},{},[848,859],{"type":27,"tag":56,"props":849,"children":850},{},[851,853],{"type":32,"value":852},"对“读多写少”的接口做 ",{"type":27,"tag":167,"props":854,"children":856},{"className":855},[],[857],{"type":32,"value":858},"stale-while-revalidate",{"type":27,"tag":56,"props":860,"children":861},{},[862],{"type":32,"value":863},"缓存 key 必须包含：用户态/语言/地区/权限等关键维度",{"type":27,"tag":587,"props":865,"children":867},{"id":866},"_62-不要缓存带用户身份的响应除非你非常确定",[868],{"type":32,"value":869},"6.2 不要缓存“带用户身份”的响应（除非你非常确定）",{"type":27,"tag":28,"props":871,"children":872},{},[873],{"type":32,"value":874},"最容易出事故的是把 A 用户的数据缓存给 B 用户。",{"type":27,"tag":28,"props":876,"children":877},{},[878],{"type":32,"value":879},"建议：",{"type":27,"tag":52,"props":881,"children":882},{},[883,888],{"type":27,"tag":56,"props":884,"children":885},{},[886],{"type":32,"value":887},"默认对用户态接口不缓存",{"type":27,"tag":56,"props":889,"children":890},{},[891,893,899,901,907],{"type":32,"value":892},"必须缓存时，key 中加入 ",{"type":27,"tag":167,"props":894,"children":896},{"className":895},[],[897],{"type":32,"value":898},"userId",{"type":32,"value":900}," 或 ",{"type":27,"tag":167,"props":902,"children":904},{"className":903},[],[905],{"type":32,"value":906},"session",{"type":32,"value":908}," 维度",{"type":27,"tag":458,"props":910,"children":911},{},[],{"type":27,"tag":40,"props":913,"children":915},{"id":914},"_7-部署适配为什么同一套代码能跑在不同环境",[916],{"type":32,"value":917},"7. 部署适配：为什么同一套代码能跑在不同环境？",{"type":27,"tag":28,"props":919,"children":920},{},[921],{"type":32,"value":922},"Nitro 的部署产物通常包含：",{"type":27,"tag":52,"props":924,"children":925},{},[926,931,936],{"type":27,"tag":56,"props":927,"children":928},{},[929],{"type":32,"value":930},"编译后的 server bundle",{"type":27,"tag":56,"props":932,"children":933},{},[934],{"type":32,"value":935},"路由清单与运行时配置",{"type":27,"tag":56,"props":937,"children":938},{},[939],{"type":32,"value":940},"静态资源与预渲染结果（如果启用）",{"type":27,"tag":28,"props":942,"children":943},{},[944],{"type":32,"value":945},"在不同目标下的差异主要在：",{"type":27,"tag":52,"props":947,"children":948},{},[949,954,959],{"type":27,"tag":56,"props":950,"children":951},{},[952],{"type":32,"value":953},"运行时能力（Node API 是否可用）",{"type":27,"tag":56,"props":955,"children":956},{},[957],{"type":32,"value":958},"冷启动与并发模型",{"type":27,"tag":56,"props":960,"children":961},{},[962],{"type":32,"value":963},"文件系统是否可写",{"type":27,"tag":587,"props":965,"children":967},{"id":966},"_71-node-server",[968],{"type":32,"value":969},"7.1 Node Server",{"type":27,"tag":52,"props":971,"children":972},{},[973,978],{"type":27,"tag":56,"props":974,"children":975},{},[976],{"type":32,"value":977},"能力最完整",{"type":27,"tag":56,"props":979,"children":980},{},[981],{"type":32,"value":982},"适合长连接、websocket（需配合平台）",{"type":27,"tag":587,"props":984,"children":986},{"id":985},"_72-serverless",[987],{"type":32,"value":988},"7.2 Serverless",{"type":27,"tag":52,"props":990,"children":991},{},[992,997],{"type":27,"tag":56,"props":993,"children":994},{},[995],{"type":32,"value":996},"冷启动成本、执行时长限制",{"type":27,"tag":56,"props":998,"children":999},{},[1000],{"type":32,"value":1001},"更适合 API 型工作负载",{"type":27,"tag":587,"props":1003,"children":1005},{"id":1004},"_73-edge",[1006],{"type":32,"value":1007},"7.3 Edge",{"type":27,"tag":52,"props":1009,"children":1010},{},[1011,1016],{"type":27,"tag":56,"props":1012,"children":1013},{},[1014],{"type":32,"value":1015},"延迟更低",{"type":27,"tag":56,"props":1017,"children":1018},{},[1019],{"type":32,"value":1020},"运行时限制更严格（例如 Node API 不可用）",{"type":27,"tag":28,"props":1022,"children":1023},{},[1024],{"type":32,"value":1025},"实践建议：",{"type":27,"tag":52,"props":1027,"children":1028},{},[1029,1034],{"type":27,"tag":56,"props":1030,"children":1031},{},[1032],{"type":32,"value":1033},"如果你依赖复杂 Node 能力（例如图像处理、原生模块），优先 Node/Serverless",{"type":27,"tag":56,"props":1035,"children":1036},{},[1037],{"type":32,"value":1038},"如果你追求极致延迟且逻辑简单，考虑 Edge",{"type":27,"tag":458,"props":1040,"children":1041},{},[],{"type":27,"tag":40,"props":1043,"children":1045},{"id":1044},"_8-性能调优nitro-侧你能做什么",[1046],{"type":32,"value":1047},"8. 性能调优：Nitro 侧你能做什么？",{"type":27,"tag":587,"props":1049,"children":1051},{"id":1050},"_81-减少阻塞-io",[1052],{"type":32,"value":1053},"8.1 减少阻塞 I/O",{"type":27,"tag":52,"props":1055,"children":1056},{},[1057,1062],{"type":27,"tag":56,"props":1058,"children":1059},{},[1060],{"type":32,"value":1061},"避免请求内做同步文件读写",{"type":27,"tag":56,"props":1063,"children":1064},{},[1065],{"type":32,"value":1066},"对“配置/规则”等可缓存数据做启动预热",{"type":27,"tag":587,"props":1068,"children":1070},{"id":1069},"_82-控制上游依赖",[1071],{"type":32,"value":1072},"8.2 控制上游依赖",{"type":27,"tag":52,"props":1074,"children":1075},{},[1076,1081],{"type":27,"tag":56,"props":1077,"children":1078},{},[1079],{"type":32,"value":1080},"给外部请求设超时（例如 2~3s）",{"type":27,"tag":56,"props":1082,"children":1083},{},[1084],{"type":32,"value":1085},"加重试要谨慎（避免雪崩）",{"type":27,"tag":587,"props":1087,"children":1089},{"id":1088},"_83-响应体积与压缩",[1090],{"type":32,"value":1091},"8.3 响应体积与压缩",{"type":27,"tag":52,"props":1093,"children":1094},{},[1095,1100],{"type":27,"tag":56,"props":1096,"children":1097},{},[1098],{"type":32,"value":1099},"JSON 输出控制字段",{"type":27,"tag":56,"props":1101,"children":1102},{},[1103],{"type":32,"value":1104},"开启 gzip/br",{"type":27,"tag":458,"props":1106,"children":1107},{},[],{"type":27,"tag":40,"props":1109,"children":1111},{"id":1110},"_9-可观测性没有观测就没有稳定",[1112],{"type":32,"value":1113},"9. 可观测性：没有观测就没有“稳定”",{"type":27,"tag":28,"props":1115,"children":1116},{},[1117],{"type":32,"value":1118},"建议 Nitro 侧最小可观测集合：",{"type":27,"tag":52,"props":1120,"children":1121},{},[1122,1127,1132,1137],{"type":27,"tag":56,"props":1123,"children":1124},{},[1125],{"type":32,"value":1126},"requestId/traceId",{"type":27,"tag":56,"props":1128,"children":1129},{},[1130],{"type":32,"value":1131},"关键路由耗时（p50/p95）",{"type":27,"tag":56,"props":1133,"children":1134},{},[1135],{"type":32,"value":1136},"错误率（按路由/按状态码）",{"type":27,"tag":56,"props":1138,"children":1139},{},[1140],{"type":32,"value":1141},"上游依赖耗时（DB/HTTP）",{"type":27,"tag":28,"props":1143,"children":1144},{},[1145],{"type":32,"value":1146},"落地方式：",{"type":27,"tag":52,"props":1148,"children":1149},{},[1150,1155],{"type":27,"tag":56,"props":1151,"children":1152},{},[1153],{"type":32,"value":1154},"在中间件注入 requestId",{"type":27,"tag":56,"props":1156,"children":1157},{},[1158],{"type":32,"value":1159},"在统一错误处理处记录结构化日志",{"type":27,"tag":458,"props":1161,"children":1162},{},[],{"type":27,"tag":40,"props":1164,"children":1166},{"id":1165},"_10-一个推荐的-nitro-工程结构",[1167],{"type":32,"value":1168},"10. 一个推荐的 Nitro 工程结构",{"type":27,"tag":28,"props":1170,"children":1171},{},[1172],{"type":32,"value":1173},"在 Nuxt 项目里，你可以这样组织服务端代码：",{"type":27,"tag":52,"props":1175,"children":1176},{},[1177,1188,1199,1210,1221],{"type":27,"tag":56,"props":1178,"children":1179},{},[1180,1186],{"type":27,"tag":167,"props":1181,"children":1183},{"className":1182},[],[1184],{"type":32,"value":1185},"server/middleware/",{"type":32,"value":1187},"：鉴权、日志、headers、rate limit",{"type":27,"tag":56,"props":1189,"children":1190},{},[1191,1197],{"type":27,"tag":167,"props":1192,"children":1194},{"className":1193},[],[1195],{"type":32,"value":1196},"server/api/",{"type":32,"value":1198},"：业务 API（薄控制器）",{"type":27,"tag":56,"props":1200,"children":1201},{},[1202,1208],{"type":27,"tag":167,"props":1203,"children":1205},{"className":1204},[],[1206],{"type":32,"value":1207},"server/services/",{"type":32,"value":1209},"：领域服务（可复用）",{"type":27,"tag":56,"props":1211,"children":1212},{},[1213,1219],{"type":27,"tag":167,"props":1214,"children":1216},{"className":1215},[],[1217],{"type":32,"value":1218},"server/repositories/",{"type":32,"value":1220},"：数据访问层",{"type":27,"tag":56,"props":1222,"children":1223},{},[1224,1230],{"type":27,"tag":167,"props":1225,"children":1227},{"className":1226},[],[1228],{"type":32,"value":1229},"server/utils/",{"type":32,"value":1231},"：纯工具",{"type":27,"tag":28,"props":1233,"children":1234},{},[1235],{"type":32,"value":1236},"目标是：",{"type":27,"tag":52,"props":1238,"children":1239},{},[1240,1245,1250],{"type":27,"tag":56,"props":1241,"children":1242},{},[1243],{"type":32,"value":1244},"handler 只做协议适配",{"type":27,"tag":56,"props":1246,"children":1247},{},[1248],{"type":32,"value":1249},"业务逻辑可复用、可测试",{"type":27,"tag":56,"props":1251,"children":1252},{},[1253],{"type":32,"value":1254},"横切能力集中化",{"type":27,"tag":458,"props":1256,"children":1257},{},[],{"type":27,"tag":40,"props":1259,"children":1260},{"id":288},[1261],{"type":32,"value":288},{"type":27,"tag":28,"props":1263,"children":1264},{},[1265,1267,1272],{"type":32,"value":1266},"Nitro 的本质是：把 Nuxt 的服务端能力变成一个",{"type":27,"tag":377,"props":1268,"children":1269},{},[1270],{"type":32,"value":1271},"可编译、可移植、可观测",{"type":32,"value":1273},"的运行时系统。",{"type":27,"tag":28,"props":1275,"children":1276},{},[1277],{"type":32,"value":1278},"你一旦理解了它的生命周期与边界，就可以更有信心地在 Nuxt 里做：",{"type":27,"tag":52,"props":1280,"children":1281},{},[1282,1287,1292,1297],{"type":27,"tag":56,"props":1283,"children":1284},{},[1285],{"type":32,"value":1286},"性能友好的 API",{"type":27,"tag":56,"props":1288,"children":1289},{},[1290],{"type":32,"value":1291},"可控的缓存",{"type":27,"tag":56,"props":1293,"children":1294},{},[1295],{"type":32,"value":1296},"稳定的鉴权与错误处理",{"type":27,"tag":56,"props":1298,"children":1299},{},[1300],{"type":32,"value":1301},"面向多环境部署的工程架构",{"title":7,"searchDepth":333,"depth":333,"links":1303},[1304,1305,1306,1307,1315,1316,1317,1321,1326,1331,1332,1333],{"id":368,"depth":336,"text":352},{"id":463,"depth":336,"text":466},{"id":524,"depth":336,"text":527},{"id":566,"depth":336,"text":1308,"children":1309},"3. 路由系统：server/api 与 server/routes 的区别",[1310,1312,1314],{"id":589,"depth":333,"text":1311},"3.1 server/api/*",{"id":618,"depth":333,"text":1313},"3.2 server/routes/*",{"id":642,"depth":333,"text":645},{"id":674,"depth":336,"text":677},{"id":737,"depth":336,"text":740},{"id":812,"depth":336,"text":815,"children":1318},[1319,1320],{"id":841,"depth":333,"text":844},{"id":866,"depth":333,"text":869},{"id":914,"depth":336,"text":917,"children":1322},[1323,1324,1325],{"id":966,"depth":333,"text":969},{"id":985,"depth":333,"text":988},{"id":1004,"depth":333,"text":1007},{"id":1044,"depth":336,"text":1047,"children":1327},[1328,1329,1330],{"id":1050,"depth":333,"text":1053},{"id":1069,"depth":333,"text":1072},{"id":1088,"depth":333,"text":1091},{"id":1110,"depth":336,"text":1113},{"id":1165,"depth":336,"text":1168},{"id":288,"depth":336,"text":288},"content:topics:nuxt:nitro-engine-deep-dive.md","topics/nuxt/nitro-engine-deep-dive.md","topics/nuxt/nitro-engine-deep-dive",{"_path":1338,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":1339,"description":1340,"date":354,"topic":5,"author":11,"tags":1341,"image":1345,"featured":362,"readingTime":1346,"body":1347,"_type":343,"_id":2118,"_source":345,"_file":2119,"_stem":2120,"_extension":348},"/topics/nuxt/nuxt-rendering-modes-guide","Nuxt 渲染模式选择指南","从 SEO、性能、成本与一致性出发，系统对比 Nuxt 的 CSR/SSR/SSG/ISR（与预渲染）等模式，给出可执行的选型矩阵与落地架构建议。",[13,357,1342,1343,1344],"SSG","ISR","SEO","/images/topics/nuxt/rendering-modes.jpg",22,{"type":24,"children":1348,"toc":2101},[1349,1354,1359,1364,1392,1404,1407,1413,1418,1441,1446,1449,1455,1461,1466,1484,1489,1508,1514,1518,1531,1535,1548,1554,1558,1571,1575,1588,1594,1599,1612,1616,1629,1633,1646,1652,1656,1669,1673,1686,1689,1695,1700,1867,1870,1876,1881,1899,1904,1917,1920,1926,1931,1936,1959,1964,1982,1985,1991,2009,2012,2018,2071,2074,2078,2083],{"type":27,"tag":40,"props":1350,"children":1352},{"id":1351},"nuxt-渲染模式选择指南",[1353],{"type":32,"value":1339},{"type":27,"tag":28,"props":1355,"children":1356},{},[1357],{"type":32,"value":1358},"“到底要不要 SSR？”是 Nuxt 项目里最常见、也最容易吵起来的问题。",{"type":27,"tag":28,"props":1360,"children":1361},{},[1362],{"type":32,"value":1363},"原因是：渲染模式不是一个单点选择，它同时牵动：",{"type":27,"tag":52,"props":1365,"children":1366},{},[1367,1372,1377,1382,1387],{"type":27,"tag":56,"props":1368,"children":1369},{},[1370],{"type":32,"value":1371},"SEO（可索引内容是否直出）",{"type":27,"tag":56,"props":1373,"children":1374},{},[1375],{"type":32,"value":1376},"性能（TTFB/LCP/INP）",{"type":27,"tag":56,"props":1378,"children":1379},{},[1380],{"type":32,"value":1381},"成本（回源、算力、带宽）",{"type":27,"tag":56,"props":1383,"children":1384},{},[1385],{"type":32,"value":1386},"一致性（内容更新策略、缓存失效）",{"type":27,"tag":56,"props":1388,"children":1389},{},[1390],{"type":32,"value":1391},"工程复杂度（部署、观测、回滚）",{"type":27,"tag":28,"props":1393,"children":1394},{},[1395,1397,1402],{"type":32,"value":1396},"这篇文章给你一套",{"type":27,"tag":377,"props":1398,"children":1399},{},[1400],{"type":32,"value":1401},"可执行的选型方法",{"type":32,"value":1403},"：先定义目标，再选模式，最后给落地结构与检查清单。",{"type":27,"tag":458,"props":1405,"children":1406},{},[],{"type":27,"tag":40,"props":1408,"children":1410},{"id":1409},"_1-四个维度决定你的模式",[1411],{"type":32,"value":1412},"1. 四个维度，决定你的模式",{"type":27,"tag":28,"props":1414,"children":1415},{},[1416],{"type":32,"value":1417},"在做任何选择前，先回答四个问题：",{"type":27,"tag":473,"props":1419,"children":1420},{},[1421,1426,1431,1436],{"type":27,"tag":56,"props":1422,"children":1423},{},[1424],{"type":32,"value":1425},"页面是否需要 SEO？（搜索引擎是否必须看到正文）",{"type":27,"tag":56,"props":1427,"children":1428},{},[1429],{"type":32,"value":1430},"数据是否强一致？（用户态/支付/权限）",{"type":27,"tag":56,"props":1432,"children":1433},{},[1434],{"type":32,"value":1435},"更新频率如何？（发布频繁 vs 偶尔）",{"type":27,"tag":56,"props":1437,"children":1438},{},[1439],{"type":32,"value":1440},"流量模型是什么？（突发、平稳、长尾）",{"type":27,"tag":28,"props":1442,"children":1443},{},[1444],{"type":32,"value":1445},"这些问题比“SSR 快还是慢”更重要。",{"type":27,"tag":458,"props":1447,"children":1448},{},[],{"type":27,"tag":40,"props":1450,"children":1452},{"id":1451},"_2-主要模式概览csr-ssr-ssg-isr-预渲染",[1453],{"type":32,"value":1454},"2. 主要模式概览：CSR / SSR / SSG / ISR / 预渲染",{"type":27,"tag":587,"props":1456,"children":1458},{"id":1457},"_21-csr纯客户端渲染",[1459],{"type":32,"value":1460},"2.1 CSR（纯客户端渲染）",{"type":27,"tag":28,"props":1462,"children":1463},{},[1464],{"type":32,"value":1465},"特点：",{"type":27,"tag":52,"props":1467,"children":1468},{},[1469,1474,1479],{"type":27,"tag":56,"props":1470,"children":1471},{},[1472],{"type":32,"value":1473},"HTML 只有壳",{"type":27,"tag":56,"props":1475,"children":1476},{},[1477],{"type":32,"value":1478},"SEO 风险大（除非你不索引）",{"type":27,"tag":56,"props":1480,"children":1481},{},[1482],{"type":32,"value":1483},"首屏性能取决于 JS 与接口",{"type":27,"tag":28,"props":1485,"children":1486},{},[1487],{"type":32,"value":1488},"适用：",{"type":27,"tag":52,"props":1490,"children":1491},{},[1492,1497],{"type":27,"tag":56,"props":1493,"children":1494},{},[1495],{"type":32,"value":1496},"用户中心、后台、强交互工具",{"type":27,"tag":56,"props":1498,"children":1499},{},[1500,1502],{"type":32,"value":1501},"不需要索引或明确 ",{"type":27,"tag":167,"props":1503,"children":1505},{"className":1504},[],[1506],{"type":32,"value":1507},"noindex",{"type":27,"tag":587,"props":1509,"children":1511},{"id":1510},"_22-ssr服务端渲染",[1512],{"type":32,"value":1513},"2.2 SSR（服务端渲染）",{"type":27,"tag":28,"props":1515,"children":1516},{},[1517],{"type":32,"value":1465},{"type":27,"tag":52,"props":1519,"children":1520},{},[1521,1526],{"type":27,"tag":56,"props":1522,"children":1523},{},[1524],{"type":32,"value":1525},"首屏 HTML 直出，SEO 友好",{"type":27,"tag":56,"props":1527,"children":1528},{},[1529],{"type":32,"value":1530},"每次请求可能都需要回源（需要缓存）",{"type":27,"tag":28,"props":1532,"children":1533},{},[1534],{"type":32,"value":1488},{"type":27,"tag":52,"props":1536,"children":1537},{},[1538,1543],{"type":27,"tag":56,"props":1539,"children":1540},{},[1541],{"type":32,"value":1542},"内容需要 SEO，但数据强动态",{"type":27,"tag":56,"props":1544,"children":1545},{},[1546],{"type":32,"value":1547},"你有完善的缓存策略",{"type":27,"tag":587,"props":1549,"children":1551},{"id":1550},"_23-ssg静态生成",[1552],{"type":32,"value":1553},"2.3 SSG（静态生成）",{"type":27,"tag":28,"props":1555,"children":1556},{},[1557],{"type":32,"value":1465},{"type":27,"tag":52,"props":1559,"children":1560},{},[1561,1566],{"type":27,"tag":56,"props":1562,"children":1563},{},[1564],{"type":32,"value":1565},"性能与稳定性最好",{"type":27,"tag":56,"props":1567,"children":1568},{},[1569],{"type":32,"value":1570},"更新成本在“构建时”",{"type":27,"tag":28,"props":1572,"children":1573},{},[1574],{"type":32,"value":1488},{"type":27,"tag":52,"props":1576,"children":1577},{},[1578,1583],{"type":27,"tag":56,"props":1579,"children":1580},{},[1581],{"type":32,"value":1582},"内容站、文档站、营销页",{"type":27,"tag":56,"props":1584,"children":1585},{},[1586],{"type":32,"value":1587},"更新频率不高或可接受构建延迟",{"type":27,"tag":587,"props":1589,"children":1591},{"id":1590},"_24-isr增量静态再生按需生成",[1592],{"type":32,"value":1593},"2.4 ISR（增量静态再生/按需生成）",{"type":27,"tag":28,"props":1595,"children":1596},{},[1597],{"type":32,"value":1598},"在 Nuxt 体系里，ISR 的表达可能来自：",{"type":27,"tag":52,"props":1600,"children":1601},{},[1602,1607],{"type":27,"tag":56,"props":1603,"children":1604},{},[1605],{"type":32,"value":1606},"生成策略 + 缓存策略",{"type":27,"tag":56,"props":1608,"children":1609},{},[1610],{"type":32,"value":1611},"或配合边缘缓存与按需失效",{"type":27,"tag":28,"props":1613,"children":1614},{},[1615],{"type":32,"value":1465},{"type":27,"tag":52,"props":1617,"children":1618},{},[1619,1624],{"type":27,"tag":56,"props":1620,"children":1621},{},[1622],{"type":32,"value":1623},"静态化收益 + 可控更新",{"type":27,"tag":56,"props":1625,"children":1626},{},[1627],{"type":32,"value":1628},"需要你设计“失效与再生成”",{"type":27,"tag":28,"props":1630,"children":1631},{},[1632],{"type":32,"value":1488},{"type":27,"tag":52,"props":1634,"children":1635},{},[1636,1641],{"type":27,"tag":56,"props":1637,"children":1638},{},[1639],{"type":32,"value":1640},"内容更新频繁，但仍要 SEO",{"type":27,"tag":56,"props":1642,"children":1643},{},[1644],{"type":32,"value":1645},"你希望在高峰也保持稳定",{"type":27,"tag":587,"props":1647,"children":1649},{"id":1648},"_25-预渲染prerender",[1650],{"type":32,"value":1651},"2.5 预渲染（prerender）",{"type":27,"tag":28,"props":1653,"children":1654},{},[1655],{"type":32,"value":1465},{"type":27,"tag":52,"props":1657,"children":1658},{},[1659,1664],{"type":27,"tag":56,"props":1660,"children":1661},{},[1662],{"type":32,"value":1663},"对部分路由预先生成 HTML",{"type":27,"tag":56,"props":1665,"children":1666},{},[1667],{"type":32,"value":1668},"适合混合站点",{"type":27,"tag":28,"props":1670,"children":1671},{},[1672],{"type":32,"value":1488},{"type":27,"tag":52,"props":1674,"children":1675},{},[1676,1681],{"type":27,"tag":56,"props":1677,"children":1678},{},[1679],{"type":32,"value":1680},"首页/核心落地页需要 SEO",{"type":27,"tag":56,"props":1682,"children":1683},{},[1684],{"type":32,"value":1685},"工具页/用户页不需要 SEO",{"type":27,"tag":458,"props":1687,"children":1688},{},[],{"type":27,"tag":40,"props":1690,"children":1692},{"id":1691},"_3-选型矩阵可直接用",[1693],{"type":32,"value":1694},"3. 选型矩阵（可直接用）",{"type":27,"tag":28,"props":1696,"children":1697},{},[1698],{"type":32,"value":1699},"你可以按路由维度做选型，而不是全站一刀切。",{"type":27,"tag":1701,"props":1702,"children":1703},"table",{},[1704,1732],{"type":27,"tag":1705,"props":1706,"children":1707},"thead",{},[1708],{"type":27,"tag":1709,"props":1710,"children":1711},"tr",{},[1712,1718,1722,1727],{"type":27,"tag":1713,"props":1714,"children":1715},"th",{},[1716],{"type":32,"value":1717},"页面类型",{"type":27,"tag":1713,"props":1719,"children":1720},{},[1721],{"type":32,"value":1344},{"type":27,"tag":1713,"props":1723,"children":1724},{},[1725],{"type":32,"value":1726},"更新频率",{"type":27,"tag":1713,"props":1728,"children":1729},{},[1730],{"type":32,"value":1731},"推荐",{"type":27,"tag":1733,"props":1734,"children":1735},"tbody",{},[1736,1760,1781,1802,1823,1845],{"type":27,"tag":1709,"props":1737,"children":1738},{},[1739,1745,1750,1755],{"type":27,"tag":1740,"props":1741,"children":1742},"td",{},[1743],{"type":32,"value":1744},"文章详情",{"type":27,"tag":1740,"props":1746,"children":1747},{},[1748],{"type":32,"value":1749},"高",{"type":27,"tag":1740,"props":1751,"children":1752},{},[1753],{"type":32,"value":1754},"中",{"type":27,"tag":1740,"props":1756,"children":1757},{},[1758],{"type":32,"value":1759},"SSG/ISR",{"type":27,"tag":1709,"props":1761,"children":1762},{},[1763,1768,1772,1776],{"type":27,"tag":1740,"props":1764,"children":1765},{},[1766],{"type":32,"value":1767},"文章列表",{"type":27,"tag":1740,"props":1769,"children":1770},{},[1771],{"type":32,"value":1749},{"type":27,"tag":1740,"props":1773,"children":1774},{},[1775],{"type":32,"value":1754},{"type":27,"tag":1740,"props":1777,"children":1778},{},[1779],{"type":32,"value":1780},"SSG/ISR（注意聚合页）",{"type":27,"tag":1709,"props":1782,"children":1783},{},[1784,1789,1793,1797],{"type":27,"tag":1740,"props":1785,"children":1786},{},[1787],{"type":32,"value":1788},"产品详情",{"type":27,"tag":1740,"props":1790,"children":1791},{},[1792],{"type":32,"value":1749},{"type":27,"tag":1740,"props":1794,"children":1795},{},[1796],{"type":32,"value":1749},{"type":27,"tag":1740,"props":1798,"children":1799},{},[1800],{"type":32,"value":1801},"ISR/SSR（配缓存）",{"type":27,"tag":1709,"props":1803,"children":1804},{},[1805,1810,1814,1818],{"type":27,"tag":1740,"props":1806,"children":1807},{},[1808],{"type":32,"value":1809},"搜索结果",{"type":27,"tag":1740,"props":1811,"children":1812},{},[1813],{"type":32,"value":1754},{"type":27,"tag":1740,"props":1815,"children":1816},{},[1817],{"type":32,"value":1749},{"type":27,"tag":1740,"props":1819,"children":1820},{},[1821],{"type":32,"value":1822},"SSR/CSR（配 noindex）",{"type":27,"tag":1709,"props":1824,"children":1825},{},[1826,1831,1836,1840],{"type":27,"tag":1740,"props":1827,"children":1828},{},[1829],{"type":32,"value":1830},"用户中心",{"type":27,"tag":1740,"props":1832,"children":1833},{},[1834],{"type":32,"value":1835},"低",{"type":27,"tag":1740,"props":1837,"children":1838},{},[1839],{"type":32,"value":1749},{"type":27,"tag":1740,"props":1841,"children":1842},{},[1843],{"type":32,"value":1844},"CSR",{"type":27,"tag":1709,"props":1846,"children":1847},{},[1848,1853,1858,1862],{"type":27,"tag":1740,"props":1849,"children":1850},{},[1851],{"type":32,"value":1852},"工具页",{"type":27,"tag":1740,"props":1854,"children":1855},{},[1856],{"type":32,"value":1857},"低/中",{"type":27,"tag":1740,"props":1859,"children":1860},{},[1861],{"type":32,"value":1754},{"type":27,"tag":1740,"props":1863,"children":1864},{},[1865],{"type":32,"value":1866},"CSR + 预渲染核心路由",{"type":27,"tag":458,"props":1868,"children":1869},{},[],{"type":27,"tag":40,"props":1871,"children":1873},{"id":1872},"_4-混合渲染真正的生产最优解",[1874],{"type":32,"value":1875},"4. 混合渲染：真正的生产最优解",{"type":27,"tag":28,"props":1877,"children":1878},{},[1879],{"type":32,"value":1880},"生产上最常见的模式是混合：",{"type":27,"tag":52,"props":1882,"children":1883},{},[1884,1889,1894],{"type":27,"tag":56,"props":1885,"children":1886},{},[1887],{"type":32,"value":1888},"公共内容：静态化（SSG/ISR）+ CDN",{"type":27,"tag":56,"props":1890,"children":1891},{},[1892],{"type":32,"value":1893},"用户态内容：CSR 或 SSR（private/no-store）",{"type":27,"tag":56,"props":1895,"children":1896},{},[1897],{"type":32,"value":1898},"关键落地页：预渲染",{"type":27,"tag":28,"props":1900,"children":1901},{},[1902],{"type":32,"value":1903},"好处：",{"type":27,"tag":52,"props":1905,"children":1906},{},[1907,1912],{"type":27,"tag":56,"props":1908,"children":1909},{},[1910],{"type":32,"value":1911},"SEO 与性能兼得",{"type":27,"tag":56,"props":1913,"children":1914},{},[1915],{"type":32,"value":1916},"成本可控",{"type":27,"tag":458,"props":1918,"children":1919},{},[],{"type":27,"tag":40,"props":1921,"children":1923},{"id":1922},"_5-缓存与失效模式落地的关键",[1924],{"type":32,"value":1925},"5. 缓存与失效：模式落地的关键",{"type":27,"tag":28,"props":1927,"children":1928},{},[1929],{"type":32,"value":1930},"无论你选 SSR 还是 ISR，本质都离不开缓存。",{"type":27,"tag":28,"props":1932,"children":1933},{},[1934],{"type":32,"value":1935},"建议把缓存分层：",{"type":27,"tag":52,"props":1937,"children":1938},{},[1939,1944,1949,1954],{"type":27,"tag":56,"props":1940,"children":1941},{},[1942],{"type":32,"value":1943},"浏览器",{"type":27,"tag":56,"props":1945,"children":1946},{},[1947],{"type":32,"value":1948},"CDN",{"type":27,"tag":56,"props":1950,"children":1951},{},[1952],{"type":32,"value":1953},"应用侧（server runtime）",{"type":27,"tag":56,"props":1955,"children":1956},{},[1957],{"type":32,"value":1958},"数据侧（Redis/DB）",{"type":27,"tag":28,"props":1960,"children":1961},{},[1962],{"type":32,"value":1963},"并给每条路由明确：",{"type":27,"tag":52,"props":1965,"children":1966},{},[1967,1972,1977],{"type":27,"tag":56,"props":1968,"children":1969},{},[1970],{"type":32,"value":1971},"是否 public/private",{"type":27,"tag":56,"props":1973,"children":1974},{},[1975],{"type":32,"value":1976},"TTL 多久",{"type":27,"tag":56,"props":1978,"children":1979},{},[1980],{"type":32,"value":1981},"写操作后如何失效",{"type":27,"tag":458,"props":1983,"children":1984},{},[],{"type":27,"tag":40,"props":1986,"children":1988},{"id":1987},"_6-常见误区",[1989],{"type":32,"value":1990},"6. 常见误区",{"type":27,"tag":52,"props":1992,"children":1993},{},[1994,1999,2004],{"type":27,"tag":56,"props":1995,"children":1996},{},[1997],{"type":32,"value":1998},"“SSR 一定更快”：不一定，TTFB 可能更慢；LCP 受资源与主线程影响更大",{"type":27,"tag":56,"props":2000,"children":2001},{},[2002],{"type":32,"value":2003},"“SSG 一定更好”：构建成本与发布延迟可能无法接受",{"type":27,"tag":56,"props":2005,"children":2006},{},[2007],{"type":32,"value":2008},"“全站一个模式最省事”：短期省事，长期很难优化与扩展",{"type":27,"tag":458,"props":2010,"children":2011},{},[],{"type":27,"tag":40,"props":2013,"children":2015},{"id":2014},"_7-上线检查清单",[2016],{"type":32,"value":2017},"7. 上线检查清单",{"type":27,"tag":52,"props":2019,"children":2022},{"className":2020},[2021],"contains-task-list",[2023,2035,2044,2053,2062],{"type":27,"tag":56,"props":2024,"children":2027},{"className":2025},[2026],"task-list-item",[2028,2033],{"type":27,"tag":2029,"props":2030,"children":2032},"input",{"disabled":362,"type":2031},"checkbox",[],{"type":32,"value":2034}," 按路由明确 SEO 需求（哪些可索引）",{"type":27,"tag":56,"props":2036,"children":2038},{"className":2037},[2026],[2039,2042],{"type":27,"tag":2029,"props":2040,"children":2041},{"disabled":362,"type":2031},[],{"type":32,"value":2043}," 用户态页面是否 private/no-store",{"type":27,"tag":56,"props":2045,"children":2047},{"className":2046},[2026],[2048,2051],{"type":27,"tag":2029,"props":2049,"children":2050},{"disabled":362,"type":2031},[],{"type":32,"value":2052}," 公共内容是否走 CDN 并有合理 TTL",{"type":27,"tag":56,"props":2054,"children":2056},{"className":2055},[2026],[2057,2060],{"type":27,"tag":2029,"props":2058,"children":2059},{"disabled":362,"type":2031},[],{"type":32,"value":2061}," 更新路径是否有失效机制（发布事件）",{"type":27,"tag":56,"props":2063,"children":2065},{"className":2064},[2026],[2066,2069],{"type":27,"tag":2029,"props":2067,"children":2068},{"disabled":362,"type":2031},[],{"type":32,"value":2070}," 是否有 RUM/日志来验证效果",{"type":27,"tag":458,"props":2072,"children":2073},{},[],{"type":27,"tag":40,"props":2075,"children":2076},{"id":288},[2077],{"type":32,"value":288},{"type":27,"tag":28,"props":2079,"children":2080},{},[2081],{"type":32,"value":2082},"Nuxt 渲染模式选型的正确做法是：",{"type":27,"tag":52,"props":2084,"children":2085},{},[2086,2091,2096],{"type":27,"tag":56,"props":2087,"children":2088},{},[2089],{"type":32,"value":2090},"以“页面类型”而不是“站点整体”做选择",{"type":27,"tag":56,"props":2092,"children":2093},{},[2094],{"type":32,"value":2095},"把缓存与失效当成一等公民",{"type":27,"tag":56,"props":2097,"children":2098},{},[2099],{"type":32,"value":2100},"用观测验证，而不是凭感觉",{"title":7,"searchDepth":333,"depth":333,"links":2102},[2103,2104,2105,2112,2113,2114,2115,2116,2117],{"id":1351,"depth":336,"text":1339},{"id":1409,"depth":336,"text":1412},{"id":1451,"depth":336,"text":1454,"children":2106},[2107,2108,2109,2110,2111],{"id":1457,"depth":333,"text":1460},{"id":1510,"depth":333,"text":1513},{"id":1550,"depth":333,"text":1553},{"id":1590,"depth":333,"text":1593},{"id":1648,"depth":333,"text":1651},{"id":1691,"depth":336,"text":1694},{"id":1872,"depth":336,"text":1875},{"id":1922,"depth":336,"text":1925},{"id":1987,"depth":336,"text":1990},{"id":2014,"depth":336,"text":2017},{"id":288,"depth":336,"text":288},"content:topics:nuxt:nuxt-rendering-modes-guide.md","topics/nuxt/nuxt-rendering-modes-guide.md","topics/nuxt/nuxt-rendering-modes-guide",{"_path":2122,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":2123,"description":2124,"date":2125,"topic":5,"author":11,"tags":2126,"image":2131,"featured":362,"readingTime":2132,"body":2133,"_type":343,"_id":2658,"_source":345,"_file":2659,"_stem":2660,"_extension":348},"/topics/nuxt/nuxt4-major-updates-overview","Nuxt 4 重大更新全面解读：架构升级与开发体验革新","深入解析 Nuxt 4 的重大更新，包括新目录结构、Nitro 2.0 引擎、兼容性层变化、性能优化等核心改进，帮助开发者全面了解新版本特性并做好升级准备。","2026-01-18",[2127,2128,357,2129,2130],"Nuxt 4","Vue","全栈框架","版本升级","/images/topics/nuxt/nuxt4-features-overview.jpg",16,{"type":24,"children":2134,"toc":2619},[2135,2141,2147,2152,2157,2163,2169,2174,2182,2190,2198,2204,2209,2220,2226,2235,2241,2247,2252,2261,2267,2276,2282,2291,2297,2303,2312,2318,2327,2333,2342,2348,2354,2363,2369,2378,2384,2395,2404,2410,2416,2425,2431,2440,2446,2455,2461,2467,2476,2482,2491,2497,2503,2513,2519,2528,2534,2539,2544,2549,2567,2570,2575],{"type":27,"tag":40,"props":2136,"children":2138},{"id":2137},"nuxt-4-重大更新全面解读",[2139],{"type":32,"value":2140},"Nuxt 4 重大更新全面解读",{"type":27,"tag":40,"props":2142,"children":2144},{"id":2143},"引言nuxt-的又一次进化",[2145],{"type":32,"value":2146},"引言：Nuxt 的又一次进化",{"type":27,"tag":28,"props":2148,"children":2149},{},[2150],{"type":32,"value":2151},"Nuxt 4 的发布标志着这个 Vue 生态中最受欢迎的全栈框架又迈入了新阶段。从 Nuxt 2 到 Nuxt 3 是一次彻底重写，而 Nuxt 3 到 Nuxt 4 则是在成熟架构上的精进打磨——更清晰的目录结构、更强大的引擎、更好的开发体验。",{"type":27,"tag":28,"props":2153,"children":2154},{},[2155],{"type":32,"value":2156},"这篇文章将全面解读 Nuxt 4 的核心变化，帮助你理解这些改动背后的设计理念，以及它们将如何影响你的日常开发。",{"type":27,"tag":40,"props":2158,"children":2160},{"id":2159},"第一部分新目录结构",[2161],{"type":32,"value":2162},"第一部分：新目录结构",{"type":27,"tag":587,"props":2164,"children":2166},{"id":2165},"_11-从扁平到分层",[2167],{"type":32,"value":2168},"1.1 从扁平到分层",{"type":27,"tag":28,"props":2170,"children":2171},{},[2172],{"type":32,"value":2173},"Nuxt 4 引入了新的目录结构，将应用代码与配置分离：",{"type":27,"tag":159,"props":2175,"children":2177},{"code":2176},"# Nuxt 3 目录结构\nproject/\n├── .nuxt/\n├── app.vue\n├── components/\n├── composables/\n├── layouts/\n├── middleware/\n├── pages/\n├── plugins/\n├── public/\n├── server/\n├── nuxt.config.ts\n└── package.json\n\n# Nuxt 4 新目录结构\nproject/\n├── .nuxt/\n├── app/                  # 应用代码集中在 app/ 目录\n│   ├── app.vue\n│   ├── components/\n│   ├── composables/\n│   ├── layouts/\n│   ├── middleware/\n│   ├── pages/\n│   └── plugins/\n├── public/\n├── server/\n├── nuxt.config.ts\n└── package.json\n",[2178],{"type":27,"tag":167,"props":2179,"children":2180},{"__ignoreMap":7},[2181],{"type":32,"value":2176},{"type":27,"tag":28,"props":2183,"children":2184},{},[2185],{"type":27,"tag":377,"props":2186,"children":2187},{},[2188],{"type":32,"value":2189},"为什么这样设计？",{"type":27,"tag":159,"props":2191,"children":2193},{"code":2192},"┌────────────────────────────────────────────────────────────┐\n│              新目录结构的设计理念                            │\n├────────────────────────────────────────────────────────────┤\n│                                                            │\n│  1. 关注点分离                                             │\n│     ├── app/ - 客户端/同构代码                             │\n│     ├── server/ - 服务端代码                               │\n│     └── 根目录 - 配置和公共资源                             │\n│                                                            │\n│  2. 更清晰的项目边界                                       │\n│     ├── Monorepo 友好                                      │\n│     ├── 多应用项目更清晰                                   │\n│     └── 与其他框架惯例对齐                                 │\n│                                                            │\n│  3. 未来扩展性                                             │\n│     ├── 为多前端支持做准备                                 │\n│     └── 便于工具链识别和处理                               │\n│                                                            │\n└────────────────────────────────────────────────────────────┘\n",[2194],{"type":27,"tag":167,"props":2195,"children":2196},{"__ignoreMap":7},[2197],{"type":32,"value":2192},{"type":27,"tag":587,"props":2199,"children":2201},{"id":2200},"_12-向后兼容",[2202],{"type":32,"value":2203},"1.2 向后兼容",{"type":27,"tag":28,"props":2205,"children":2206},{},[2207],{"type":32,"value":2208},"Nuxt 4 提供了兼容性选项，允许继续使用旧目录结构：",{"type":27,"tag":159,"props":2210,"children":2215},{"code":2211,"language":2212,"meta":7,"className":2213},"// nuxt.config.ts\nexport default defineNuxtConfig({\n  future: {\n    compatibilityVersion: 4  // 启用 Nuxt 4 特性\n  },\n  \n  // 如果需要继续使用旧目录结构\n  srcDir: './',  // 而不是 'app/'\n  \n  // 或者自定义目录\n  dir: {\n    app: 'src',\n    pages: 'src/pages',\n    layouts: 'src/layouts'\n  }\n});\n","typescript",[2214],"language-typescript",[2216],{"type":27,"tag":167,"props":2217,"children":2218},{"__ignoreMap":7},[2219],{"type":32,"value":2211},{"type":27,"tag":587,"props":2221,"children":2223},{"id":2222},"_13-appconfigts-变化",[2224],{"type":32,"value":2225},"1.3 app.config.ts 变化",{"type":27,"tag":159,"props":2227,"children":2230},{"code":2228,"language":2212,"meta":7,"className":2229},"// Nuxt 3: app.config.ts 在项目根目录\n// Nuxt 4: app.config.ts 移入 app/ 目录\n\n// app/app.config.ts\nexport default defineAppConfig({\n  ui: {\n    primary: 'green',\n    gray: 'slate'\n  },\n  \n  // 类型安全的应用配置\n  meta: {\n    name: 'My App',\n    description: 'A Nuxt 4 Application'\n  }\n});\n\n// 使用方式不变\nconst appConfig = useAppConfig();\nconsole.log(appConfig.ui.primary);  // 'green'\n",[2214],[2231],{"type":27,"tag":167,"props":2232,"children":2233},{"__ignoreMap":7},[2234],{"type":32,"value":2228},{"type":27,"tag":40,"props":2236,"children":2238},{"id":2237},"第二部分nitro-20-引擎升级",[2239],{"type":32,"value":2240},"第二部分：Nitro 2.0 引擎升级",{"type":27,"tag":587,"props":2242,"children":2244},{"id":2243},"_21-性能提升",[2245],{"type":32,"value":2246},"2.1 性能提升",{"type":27,"tag":28,"props":2248,"children":2249},{},[2250],{"type":32,"value":2251},"Nitro 2.0 带来了显著的性能改进：",{"type":27,"tag":159,"props":2253,"children":2256},{"code":2254,"language":2212,"meta":7,"className":2255},"// 冷启动时间优化\n// Nitro 1.x: ~150ms\n// Nitro 2.0: ~80ms (约 47% 提升)\n\n// 内存占用优化\n// 同样的应用，内存占用减少约 20%\n\n// 原因：\n// - 更高效的模块加载\n// - 优化的树摇（tree-shaking）\n// - 减少运行时开销\n",[2214],[2257],{"type":27,"tag":167,"props":2258,"children":2259},{"__ignoreMap":7},[2260],{"type":32,"value":2254},{"type":27,"tag":587,"props":2262,"children":2264},{"id":2263},"_22-新的路由系统",[2265],{"type":32,"value":2266},"2.2 新的路由系统",{"type":27,"tag":159,"props":2268,"children":2271},{"code":2269,"language":2212,"meta":7,"className":2270},"// server/routes/api/[...slug].ts\n\n// Nitro 2.0 新的路由定义方式\nexport default defineEventHandler({\n  // 路由级别配置\n  config: {\n    // 缓存配置\n    cache: {\n      maxAge: 60,\n      staleMaxAge: 3600,\n      swr: true\n    },\n    \n    // CORS 配置\n    cors: {\n      origin: ['https://example.com'],\n      methods: ['GET', 'POST']\n    }\n  },\n  \n  // 处理函数\n  handler: async (event) => {\n    const slug = event.context.params?.slug;\n    return { data: await fetchData(slug) };\n  }\n});\n\n// 支持中间件链\nexport default defineEventHandler({\n  onRequest: [authMiddleware, rateLimitMiddleware],\n  onBeforeResponse: [logMiddleware],\n  \n  handler: (event) => {\n    return { message: 'Hello' };\n  }\n});\n",[2214],[2272],{"type":27,"tag":167,"props":2273,"children":2274},{"__ignoreMap":7},[2275],{"type":32,"value":2269},{"type":27,"tag":587,"props":2277,"children":2279},{"id":2278},"_23-增强的数据获取",[2280],{"type":32,"value":2281},"2.3 增强的数据获取",{"type":27,"tag":159,"props":2283,"children":2286},{"code":2284,"language":2212,"meta":7,"className":2285},"// Nitro 2.0 改进的 $fetch\n\n// 自动请求去重\nconst [user, posts] = await Promise.all([\n  $fetch('/api/user/1'),\n  $fetch('/api/user/1')  // 相同请求自动去重\n]);\n\n// 请求拦截器\nexport default defineNuxtPlugin(() => {\n  const { $fetch } = useNuxtApp();\n  \n  // 全局请求配置\n  globalThis.$fetch = $fetch.create({\n    onRequest({ request, options }) {\n      options.headers = {\n        ...options.headers,\n        Authorization: `Bearer ${getToken()}`\n      };\n    },\n    \n    onResponseError({ response }) {\n      if (response.status === 401) {\n        navigateTo('/login');\n      }\n    }\n  });\n});\n",[2214],[2287],{"type":27,"tag":167,"props":2288,"children":2289},{"__ignoreMap":7},[2290],{"type":32,"value":2284},{"type":27,"tag":40,"props":2292,"children":2294},{"id":2293},"第三部分兼容性层变化",[2295],{"type":32,"value":2296},"第三部分：兼容性层变化",{"type":27,"tag":587,"props":2298,"children":2300},{"id":2299},"_31-移除的废弃-api",[2301],{"type":32,"value":2302},"3.1 移除的废弃 API",{"type":27,"tag":159,"props":2304,"children":2307},{"code":2305,"language":2212,"meta":7,"className":2306},"// Nuxt 4 移除了 Nuxt 3 中标记为废弃的 API\n\n// ❌ 已移除\nimport { defineNuxtRouteMiddleware } from '#app'\n\n// ✅ 使用新的 API\nimport { defineNuxtRouteMiddleware } from 'nuxt/app'\n\n// ❌ 已移除\nconst nuxtApp = useNuxtApp()\nnuxtApp.$router  // 不再有 $ 前缀\n\n// ✅ 使用 composables\nconst router = useRouter()\n\n// ❌ 已移除\nuseAsyncData('key', () => fetch(), { lazy: true })\n\n// ✅ 使用 useLazyAsyncData\nuseLazyAsyncData('key', () => fetch())\n",[2214],[2308],{"type":27,"tag":167,"props":2309,"children":2310},{"__ignoreMap":7},[2311],{"type":32,"value":2305},{"type":27,"tag":587,"props":2313,"children":2315},{"id":2314},"_32-类型系统改进",[2316],{"type":32,"value":2317},"3.2 类型系统改进",{"type":27,"tag":159,"props":2319,"children":2322},{"code":2320,"language":2212,"meta":7,"className":2321},"// Nuxt 4 增强的类型推导\n\n// 页面元数据类型\n// pages/dashboard.vue\n\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n  // 类型自动推导，IDE 自动补全\n  layout: 'admin',  // 只能填已定义的布局\n  middleware: ['auth'],  // 只能填已定义的中间件\n  \n  // 自定义元数据\n  title: '仪表盘',\n  requiresAuth: true\n});\n\u003C/script>\n\n// 路由参数类型\n// pages/users/[id].vue\n\u003Cscript setup lang=\"ts\">\nconst route = useRoute('users-id');\n//             ^? RouteLocationNormalized\u003C'users-id'>\n\nroute.params.id  // 类型: string\n\u003C/script>\n\n// 运行时配置类型\n// nuxt.config.ts\nexport default defineNuxtConfig({\n  runtimeConfig: {\n    // 私有配置（仅服务端）\n    apiSecret: '',\n    \n    // 公开配置\n    public: {\n      apiBase: ''\n    }\n  }\n});\n\n// 使用时自动推导类型\nconst config = useRuntimeConfig();\nconfig.apiSecret;  // 服务端可用\nconfig.public.apiBase;  // 客户端可用\n",[2214],[2323],{"type":27,"tag":167,"props":2324,"children":2325},{"__ignoreMap":7},[2326],{"type":32,"value":2320},{"type":27,"tag":587,"props":2328,"children":2330},{"id":2329},"_33-useasyncdata-改进",[2331],{"type":32,"value":2332},"3.3 useAsyncData 改进",{"type":27,"tag":159,"props":2334,"children":2337},{"code":2335,"language":2212,"meta":7,"className":2336},"// Nuxt 4 中 useAsyncData 的改进\n\n// 改进 1：更好的错误处理\nconst { data, error, status } = await useAsyncData('users', () => $fetch('/api/users'));\n\n// status 新增更多状态\n// 'idle' | 'pending' | 'success' | 'error'\n\n// 改进 2：简化的刷新机制\nconst { refresh, clear } = await useAsyncData('users', () => $fetch('/api/users'));\n\n// 带参数刷新\nawait refresh({ dedupe: true });\n\n// 清除缓存\nclear();\n\n// 改进 3：深度响应式默认关闭\nconst { data } = await useAsyncData('config', () => $fetch('/api/config'), {\n  deep: false  // 默认 false，提升性能\n});\n\n// 需要深度响应式时显式开启\nconst { data } = await useAsyncData('form', () => $fetch('/api/form'), {\n  deep: true\n});\n",[2214],[2338],{"type":27,"tag":167,"props":2339,"children":2340},{"__ignoreMap":7},[2341],{"type":32,"value":2335},{"type":27,"tag":40,"props":2343,"children":2345},{"id":2344},"第四部分开发体验改进",[2346],{"type":32,"value":2347},"第四部分：开发体验改进",{"type":27,"tag":587,"props":2349,"children":2351},{"id":2350},"_41-nuxt-devtools-增强",[2352],{"type":32,"value":2353},"4.1 Nuxt DevTools 增强",{"type":27,"tag":159,"props":2355,"children":2358},{"code":2356,"language":2212,"meta":7,"className":2357},"// Nuxt 4 内置增强版 DevTools\n\n// 新功能：\n// 1. 组件性能分析\n// - 渲染时间追踪\n// - 不必要渲染检测\n// - 内存使用监控\n\n// 2. 数据流可视化\n// - useAsyncData 调用时序图\n// - 数据缓存状态\n// - 请求去重可视化\n\n// 3. 路由调试\n// - 路由匹配过程\n// - 中间件执行顺序\n// - 导航守卫状态\n\n// 启用高级功能\nexport default defineNuxtConfig({\n  devtools: {\n    enabled: true,\n    \n    // 新选项\n    timeline: {\n      enabled: true  // 启用时间线\n    }\n  }\n});\n",[2214],[2359],{"type":27,"tag":167,"props":2360,"children":2361},{"__ignoreMap":7},[2362],{"type":32,"value":2356},{"type":27,"tag":587,"props":2364,"children":2366},{"id":2365},"_42-热更新优化",[2367],{"type":32,"value":2368},"4.2 热更新优化",{"type":27,"tag":159,"props":2370,"children":2373},{"code":2371,"language":2212,"meta":7,"className":2372},"// Nuxt 4 大幅改进了热更新体验\n\n// 1. 更快的 HMR\n// - 组件变更：\u003C 100ms\n// - 页面变更：\u003C 200ms\n// - 配置变更：\u003C 1s\n\n// 2. 保持状态的更新\n// composables 更新不再丢失组件状态\nconst count = ref(0);  // 更新文件后，值保持\n\n// 3. 错误恢复\n// 修复语法错误后自动恢复，无需重启\n",[2214],[2374],{"type":27,"tag":167,"props":2375,"children":2376},{"__ignoreMap":7},[2377],{"type":32,"value":2371},{"type":27,"tag":587,"props":2379,"children":2381},{"id":2380},"_43-错误处理增强",[2382],{"type":32,"value":2383},"4.3 错误处理增强",{"type":27,"tag":159,"props":2385,"children":2390},{"code":2386,"language":2387,"meta":7,"className":2388},"\u003C!-- app/error.vue - 增强的错误页面 -->\n\u003Ctemplate>\n  \u003Cdiv class=\"error-page\">\n    \u003Ch1>{{ error.statusCode }}\u003C/h1>\n    \u003Cp>{{ error.message }}\u003C/p>\n    \n    \u003C!-- Nuxt 4 新增：错误堆栈（开发环境） -->\n    \u003Cpre v-if=\"isDev && error.stack\">{{ error.stack }}\u003C/pre>\n    \n    \u003C!-- 新增：错误上下文 -->\n    \u003Cdetails v-if=\"error.data\">\n      \u003Csummary>详细信息\u003C/summary>\n      \u003Cpre>{{ error.data }}\u003C/pre>\n    \u003C/details>\n    \n    \u003Cbutton @click=\"handleError\">重试\u003C/button>\n  \u003C/div>\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nconst props = defineProps\u003C{\n  error: {\n    statusCode: number\n    message: string\n    stack?: string\n    data?: Record\u003Cstring, unknown>\n  }\n}>();\n\nconst isDev = process.dev;\n\nfunction handleError() {\n  clearError({ redirect: '/' });\n}\n\u003C/script>\n","vue",[2389],"language-vue",[2391],{"type":27,"tag":167,"props":2392,"children":2393},{"__ignoreMap":7},[2394],{"type":32,"value":2386},{"type":27,"tag":159,"props":2396,"children":2399},{"code":2397,"language":2212,"meta":7,"className":2398},"// server/api/users.ts - 增强的服务端错误\n\nexport default defineEventHandler((event) => {\n  const id = getRouterParam(event, 'id');\n  \n  if (!id) {\n    throw createError({\n      statusCode: 400,\n      message: '缺少用户 ID',\n      \n      // Nuxt 4 新增：结构化错误数据\n      data: {\n        field: 'id',\n        constraint: 'required'\n      }\n    });\n  }\n  \n  // 业务错误\n  throw createError({\n    statusCode: 404,\n    message: '用户不存在',\n    data: {\n      userId: id,\n      suggestion: '请检查用户 ID 是否正确'\n    }\n  });\n});\n",[2214],[2400],{"type":27,"tag":167,"props":2401,"children":2402},{"__ignoreMap":7},[2403],{"type":32,"value":2397},{"type":27,"tag":40,"props":2405,"children":2407},{"id":2406},"第五部分性能优化特性",[2408],{"type":32,"value":2409},"第五部分：性能优化特性",{"type":27,"tag":587,"props":2411,"children":2413},{"id":2412},"_51-更智能的代码分割",[2414],{"type":32,"value":2415},"5.1 更智能的代码分割",{"type":27,"tag":159,"props":2417,"children":2420},{"code":2418,"language":2212,"meta":7,"className":2419},"// Nuxt 4 的自动代码分割更加智能\n\n// 自动路由分割\n// pages/dashboard/\n//   index.vue      -> chunks/dashboard.js\n//   settings.vue   -> chunks/dashboard-settings.js\n//   analytics.vue  -> chunks/dashboard-analytics.js\n\n// 组件级分割\n// components/\n//   HeavyChart.vue -> chunks/heavy-chart.js (自动延迟加载)\n\n// 手动优化\nexport default defineNuxtConfig({\n  vite: {\n    build: {\n      rollupOptions: {\n        output: {\n          // 自定义分块策略\n          manualChunks: {\n            'vendor-vue': ['vue', 'vue-router', 'pinia'],\n            'vendor-ui': ['element-plus']\n          }\n        }\n      }\n    }\n  }\n});\n",[2214],[2421],{"type":27,"tag":167,"props":2422,"children":2423},{"__ignoreMap":7},[2424],{"type":32,"value":2418},{"type":27,"tag":587,"props":2426,"children":2428},{"id":2427},"_52-图片优化增强",[2429],{"type":32,"value":2430},"5.2 图片优化增强",{"type":27,"tag":159,"props":2432,"children":2435},{"code":2433,"language":2387,"meta":7,"className":2434},"\u003C!-- Nuxt 4 的 nuxt-img 增强 -->\n\u003Ctemplate>\n  \u003CNuxtImg\n    src=\"/images/hero.jpg\"\n    \n    \u003C!-- 新增：自动格式选择 -->\n    format=\"webp,avif\"\n    \n    \u003C!-- 新增：艺术指导响应式 -->\n    :sources=\"[\n      { media: '(max-width: 640px)', src: '/images/hero-mobile.jpg' },\n      { media: '(max-width: 1024px)', src: '/images/hero-tablet.jpg' }\n    ]\"\n    \n    \u003C!-- 新增：模糊占位符 -->\n    placeholder=\"/images/hero-blur.jpg\"\n    \n    \u003C!-- 新增：性能提示 -->\n    :priority=\"true\"\n    fetchpriority=\"high\"\n  />\n\u003C/template>\n\n\u003Cscript setup>\n// 编程式使用\nconst img = useImage();\n\n// 生成优化后的 URL\nconst optimizedUrl = img('/images/photo.jpg', {\n  width: 800,\n  height: 600,\n  format: 'webp',\n  quality: 80\n});\n\u003C/script>\n",[2389],[2436],{"type":27,"tag":167,"props":2437,"children":2438},{"__ignoreMap":7},[2439],{"type":32,"value":2433},{"type":27,"tag":587,"props":2441,"children":2443},{"id":2442},"_53-服务端渲染优化",[2444],{"type":32,"value":2445},"5.3 服务端渲染优化",{"type":27,"tag":159,"props":2447,"children":2450},{"code":2448,"language":2212,"meta":7,"className":2449},"// Nuxt 4 SSR 性能优化\n\n// 1. 流式 SSR\n// nuxt.config.ts\nexport default defineNuxtConfig({\n  nitro: {\n    // 启用流式 SSR\n    experimental: {\n      wasm: true\n    }\n  },\n  \n  // 组件流式渲染\n  experimental: {\n    componentIslands: true,  // 组件岛\n    payloadExtraction: true  // Payload 提取\n  }\n});\n\n// 2. 选择性 Hydration\n// pages/article/[id].vue\n\u003Ctemplate>\n  \u003Carticle>\n    \u003C!-- 静态内容，不需要 hydration -->\n    \u003CNuxtIsland name=\"ArticleContent\" :props=\"{ content }\" />\n    \n    \u003C!-- 需要交互的部分 -->\n    \u003CCommentSection :articleId=\"id\" />\n  \u003C/article>\n\u003C/template>\n\n// 3. 预加载优化\n\u003Cscript setup>\n// 智能预加载\nconst { data } = await useAsyncData('article', () => $fetch('/api/article/' + id), {\n  // 预加载相关数据\n  preload: [\n    () => $fetch('/api/comments/' + id),\n    () => $fetch('/api/related/' + id)\n  ]\n});\n\u003C/script>\n",[2214],[2451],{"type":27,"tag":167,"props":2452,"children":2453},{"__ignoreMap":7},[2454],{"type":32,"value":2448},{"type":27,"tag":40,"props":2456,"children":2458},{"id":2457},"第六部分模块生态更新",[2459],{"type":32,"value":2460},"第六部分：模块生态更新",{"type":27,"tag":587,"props":2462,"children":2464},{"id":2463},"_61-官方模块适配",[2465],{"type":32,"value":2466},"6.1 官方模块适配",{"type":27,"tag":159,"props":2468,"children":2471},{"code":2469,"language":2212,"meta":7,"className":2470},"// 主要官方模块的 Nuxt 4 兼容版本\n\n// @nuxtjs/i18n v9\nexport default defineNuxtConfig({\n  modules: ['@nuxtjs/i18n'],\n  \n  i18n: {\n    // 新增：编译时优化\n    bundle: {\n      optimizeTranslations: true\n    },\n    \n    // 新增：类型生成\n    types: 'composition'\n  }\n});\n\n// @nuxt/content v3\nexport default defineNuxtConfig({\n  modules: ['@nuxt/content'],\n  \n  content: {\n    // 新增：更强的查询 API\n    experimental: {\n      clientDB: true,\n      stripQueryParameters: true\n    }\n  }\n});\n\n// @pinia/nuxt v0.6\nexport default defineNuxtConfig({\n  modules: ['@pinia/nuxt'],\n  \n  pinia: {\n    // 新增：自动导入优化\n    storesDirs: ['./stores/**']\n  }\n});\n",[2214],[2472],{"type":27,"tag":167,"props":2473,"children":2474},{"__ignoreMap":7},[2475],{"type":32,"value":2469},{"type":27,"tag":587,"props":2477,"children":2479},{"id":2478},"_62-创建-nuxt-4-兼容模块",[2480],{"type":32,"value":2481},"6.2 创建 Nuxt 4 兼容模块",{"type":27,"tag":159,"props":2483,"children":2486},{"code":2484,"language":2212,"meta":7,"className":2485},"// 模块开发的新约定\n\n// my-module/src/module.ts\nimport { defineNuxtModule, createResolver } from '@nuxt/kit'\n\nexport default defineNuxtModule({\n  meta: {\n    name: 'my-module',\n    configKey: 'myModule',\n    \n    // Nuxt 4 要求\n    compatibility: {\n      nuxt: '^4.0.0'\n    }\n  },\n  \n  defaults: {\n    enabled: true\n  },\n  \n  setup(options, nuxt) {\n    const resolver = createResolver(import.meta.url);\n    \n    // 使用新的 hook API\n    nuxt.hook('app:resolve', (app) => {\n      // app 配置\n    });\n    \n    // 添加运行时插件\n    addPlugin(resolver.resolve('./runtime/plugin'));\n    \n    // 添加组件\n    addComponentsDir({\n      path: resolver.resolve('./runtime/components'),\n      prefix: 'MyModule'\n    });\n  }\n});\n",[2214],[2487],{"type":27,"tag":167,"props":2488,"children":2489},{"__ignoreMap":7},[2490],{"type":32,"value":2484},{"type":27,"tag":40,"props":2492,"children":2494},{"id":2493},"第七部分迁移准备",[2495],{"type":32,"value":2496},"第七部分：迁移准备",{"type":27,"tag":587,"props":2498,"children":2500},{"id":2499},"_71-兼容性检查清单",[2501],{"type":32,"value":2502},"7.1 兼容性检查清单",{"type":27,"tag":159,"props":2504,"children":2508},{"code":2505,"language":343,"meta":7,"className":2506},"## Nuxt 4 迁移检查清单\n\n### 依赖版本\n- [ ] Node.js >= 20\n- [ ] Vue >= 3.4\n- [ ] TypeScript >= 5.3（推荐）\n\n### 代码检查\n- [ ] 移除已废弃的 API 调用\n- [ ] 更新 composables 导入路径\n- [ ] 检查 useAsyncData 用法\n- [ ] 审查中间件语法\n\n### 目录结构\n- [ ] 决定是否采用新目录结构\n- [ ] 移动文件到 app/ 目录（如果采用）\n- [ ] 更新 nuxt.config.ts 配置\n\n### 模块更新\n- [ ] 更新官方模块到兼容版本\n- [ ] 检查第三方模块兼容性\n- [ ] 更新自定义模块\n\n### 测试\n- [ ] 运行全部测试套件\n- [ ] 验证 SSR/SSG 输出\n- [ ] 检查 hydration 错误\n- [ ] 性能基准测试\n",[2507],"language-markdown",[2509],{"type":27,"tag":167,"props":2510,"children":2511},{"__ignoreMap":7},[2512],{"type":32,"value":2505},{"type":27,"tag":587,"props":2514,"children":2516},{"id":2515},"_72-渐进式升级路径",[2517],{"type":32,"value":2518},"7.2 渐进式升级路径",{"type":27,"tag":159,"props":2520,"children":2523},{"code":2521,"language":2212,"meta":7,"className":2522},"// 使用 compatibilityVersion 实现渐进升级\n\n// 阶段 1：启用 Nuxt 4 特性（保持旧目录结构）\nexport default defineNuxtConfig({\n  future: {\n    compatibilityVersion: 4\n  },\n  srcDir: './'  // 保持旧目录结构\n});\n\n// 阶段 2：迁移到新目录结构\n// 1. 创建 app/ 目录\n// 2. 移动文件\n// 3. 更新导入路径\n\n// 阶段 3：完全升级\nexport default defineNuxtConfig({\n  // 移除 future 配置，默认使用 Nuxt 4 行为\n});\n",[2214],[2524],{"type":27,"tag":167,"props":2525,"children":2526},{"__ignoreMap":7},[2527],{"type":32,"value":2521},{"type":27,"tag":40,"props":2529,"children":2531},{"id":2530},"结语稳步前进的进化",[2532],{"type":32,"value":2533},"结语：稳步前进的进化",{"type":27,"tag":28,"props":2535,"children":2536},{},[2537],{"type":32,"value":2538},"Nuxt 4 不是一次颠覆性的重写，而是在 Nuxt 3 坚实基础上的持续改进。新的目录结构带来更好的组织性，Nitro 2.0 带来更好的性能，增强的类型系统带来更好的开发体验。",{"type":27,"tag":28,"props":2540,"children":2541},{},[2542],{"type":32,"value":2543},"对于 Nuxt 3 用户来说，升级路径相对平滑。核心概念没有变化，熟悉的 API 依然工作。Nuxt 团队显然吸取了 Nuxt 2 到 Nuxt 3 升级的经验，这次提供了更友好的迁移体验。",{"type":27,"tag":28,"props":2545,"children":2546},{},[2547],{"type":32,"value":2548},"如果你正在考虑是否升级，建议：",{"type":27,"tag":52,"props":2550,"children":2551},{},[2552,2557,2562],{"type":27,"tag":56,"props":2553,"children":2554},{},[2555],{"type":32,"value":2556},"新项目直接使用 Nuxt 4",{"type":27,"tag":56,"props":2558,"children":2559},{},[2560],{"type":32,"value":2561},"现有项目评估迁移成本后决定",{"type":27,"tag":56,"props":2563,"children":2564},{},[2565],{"type":32,"value":2566},"关注官方迁移指南的更新",{"type":27,"tag":458,"props":2568,"children":2569},{},[],{"type":27,"tag":40,"props":2571,"children":2573},{"id":2572},"参考资源",[2574],{"type":32,"value":2572},{"type":27,"tag":52,"props":2576,"children":2577},{},[2578,2589,2599,2609],{"type":27,"tag":56,"props":2579,"children":2580},{},[2581],{"type":27,"tag":308,"props":2582,"children":2586},{"href":2583,"rel":2584},"https://nuxt.com/blog/v4",[2585],"nofollow",[2587],{"type":32,"value":2588},"Nuxt 4 官方公告",{"type":27,"tag":56,"props":2590,"children":2591},{},[2592],{"type":27,"tag":308,"props":2593,"children":2596},{"href":2594,"rel":2595},"https://nuxt.com/docs/migration/upgrade",[2585],[2597],{"type":32,"value":2598},"Nuxt 4 迁移指南",{"type":27,"tag":56,"props":2600,"children":2601},{},[2602],{"type":27,"tag":308,"props":2603,"children":2606},{"href":2604,"rel":2605},"https://nitro.unjs.io/changelog",[2585],[2607],{"type":32,"value":2608},"Nitro 2.0 更新日志",{"type":27,"tag":56,"props":2610,"children":2611},{},[2612],{"type":27,"tag":308,"props":2613,"children":2616},{"href":2614,"rel":2615},"https://github.com/nuxt/nuxt/issues",[2585],[2617],{"type":32,"value":2618},"Nuxt 路线图",{"title":7,"searchDepth":333,"depth":333,"links":2620},[2621,2622,2623,2628,2633,2638,2643,2648,2652,2656,2657],{"id":2137,"depth":336,"text":2140},{"id":2143,"depth":336,"text":2146},{"id":2159,"depth":336,"text":2162,"children":2624},[2625,2626,2627],{"id":2165,"depth":333,"text":2168},{"id":2200,"depth":333,"text":2203},{"id":2222,"depth":333,"text":2225},{"id":2237,"depth":336,"text":2240,"children":2629},[2630,2631,2632],{"id":2243,"depth":333,"text":2246},{"id":2263,"depth":333,"text":2266},{"id":2278,"depth":333,"text":2281},{"id":2293,"depth":336,"text":2296,"children":2634},[2635,2636,2637],{"id":2299,"depth":333,"text":2302},{"id":2314,"depth":333,"text":2317},{"id":2329,"depth":333,"text":2332},{"id":2344,"depth":336,"text":2347,"children":2639},[2640,2641,2642],{"id":2350,"depth":333,"text":2353},{"id":2365,"depth":333,"text":2368},{"id":2380,"depth":333,"text":2383},{"id":2406,"depth":336,"text":2409,"children":2644},[2645,2646,2647],{"id":2412,"depth":333,"text":2415},{"id":2427,"depth":333,"text":2430},{"id":2442,"depth":333,"text":2445},{"id":2457,"depth":336,"text":2460,"children":2649},[2650,2651],{"id":2463,"depth":333,"text":2466},{"id":2478,"depth":333,"text":2481},{"id":2493,"depth":336,"text":2496,"children":2653},[2654,2655],{"id":2499,"depth":333,"text":2502},{"id":2515,"depth":333,"text":2518},{"id":2530,"depth":336,"text":2533},{"id":2572,"depth":336,"text":2572},"content:topics:nuxt:nuxt4-major-updates-overview.md","topics/nuxt/nuxt4-major-updates-overview.md","topics/nuxt/nuxt4-major-updates-overview",{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":9,"date":10,"topic":5,"author":11,"tags":2662,"image":18,"imageQuery":19,"pexelsPhotoId":20,"pexelsUrl":21,"featured":6,"readingTime":22,"body":2663,"_type":343,"_id":344,"_source":345,"_file":346,"_stem":347,"_extension":348},[13,14,15,16,17],{"type":24,"children":2664,"toc":2903},[2665,2669,2673,2677,2681,2696,2700,2704,2708,2731,2735,2739,2743,2762,2766,2774,2778,2782,2786,2790,2805,2809,2813,2817,2836,2840,2844,2867,2871,2875,2879],{"type":27,"tag":28,"props":2666,"children":2667},{},[2668],{"type":32,"value":33},{"type":27,"tag":28,"props":2670,"children":2671},{},[2672],{"type":32,"value":38},{"type":27,"tag":40,"props":2674,"children":2675},{"id":42},[2676],{"type":32,"value":45},{"type":27,"tag":28,"props":2678,"children":2679},{},[2680],{"type":32,"value":50},{"type":27,"tag":52,"props":2682,"children":2683},{},[2684,2688,2692],{"type":27,"tag":56,"props":2685,"children":2686},{},[2687],{"type":32,"value":60},{"type":27,"tag":56,"props":2689,"children":2690},{},[2691],{"type":32,"value":65},{"type":27,"tag":56,"props":2693,"children":2694},{},[2695],{"type":32,"value":70},{"type":27,"tag":28,"props":2697,"children":2698},{},[2699],{"type":32,"value":75},{"type":27,"tag":40,"props":2701,"children":2702},{"id":78},[2703],{"type":32,"value":78},{"type":27,"tag":28,"props":2705,"children":2706},{},[2707],{"type":32,"value":85},{"type":27,"tag":52,"props":2709,"children":2710},{},[2711,2715,2719,2723,2727],{"type":27,"tag":56,"props":2712,"children":2713},{},[2714],{"type":32,"value":93},{"type":27,"tag":56,"props":2716,"children":2717},{},[2718],{"type":32,"value":98},{"type":27,"tag":56,"props":2720,"children":2721},{},[2722],{"type":32,"value":103},{"type":27,"tag":56,"props":2724,"children":2725},{},[2726],{"type":32,"value":108},{"type":27,"tag":56,"props":2728,"children":2729},{},[2730],{"type":32,"value":113},{"type":27,"tag":28,"props":2732,"children":2733},{},[2734],{"type":32,"value":118},{"type":27,"tag":40,"props":2736,"children":2737},{"id":121},[2738],{"type":32,"value":124},{"type":27,"tag":28,"props":2740,"children":2741},{},[2742],{"type":32,"value":129},{"type":27,"tag":52,"props":2744,"children":2745},{},[2746,2750,2754,2758],{"type":27,"tag":56,"props":2747,"children":2748},{},[2749],{"type":32,"value":137},{"type":27,"tag":56,"props":2751,"children":2752},{},[2753],{"type":32,"value":142},{"type":27,"tag":56,"props":2755,"children":2756},{},[2757],{"type":32,"value":147},{"type":27,"tag":56,"props":2759,"children":2760},{},[2761],{"type":32,"value":152},{"type":27,"tag":28,"props":2763,"children":2764},{},[2765],{"type":32,"value":157},{"type":27,"tag":159,"props":2767,"children":2769},{"className":2768,"code":163,"language":164,"meta":7},[162],[2770],{"type":27,"tag":167,"props":2771,"children":2772},{"__ignoreMap":7},[2773],{"type":32,"value":163},{"type":27,"tag":28,"props":2775,"children":2776},{},[2777],{"type":32,"value":175},{"type":27,"tag":40,"props":2779,"children":2780},{"id":178},[2781],{"type":32,"value":178},{"type":27,"tag":28,"props":2783,"children":2784},{},[2785],{"type":32,"value":185},{"type":27,"tag":28,"props":2787,"children":2788},{},[2789],{"type":32,"value":190},{"type":27,"tag":52,"props":2791,"children":2792},{},[2793,2797,2801],{"type":27,"tag":56,"props":2794,"children":2795},{},[2796],{"type":32,"value":198},{"type":27,"tag":56,"props":2798,"children":2799},{},[2800],{"type":32,"value":203},{"type":27,"tag":56,"props":2802,"children":2803},{},[2804],{"type":32,"value":208},{"type":27,"tag":28,"props":2806,"children":2807},{},[2808],{"type":32,"value":213},{"type":27,"tag":40,"props":2810,"children":2811},{"id":216},[2812],{"type":32,"value":219},{"type":27,"tag":28,"props":2814,"children":2815},{},[2816],{"type":32,"value":224},{"type":27,"tag":52,"props":2818,"children":2819},{},[2820,2824,2828,2832],{"type":27,"tag":56,"props":2821,"children":2822},{},[2823],{"type":32,"value":232},{"type":27,"tag":56,"props":2825,"children":2826},{},[2827],{"type":32,"value":237},{"type":27,"tag":56,"props":2829,"children":2830},{},[2831],{"type":32,"value":242},{"type":27,"tag":56,"props":2833,"children":2834},{},[2835],{"type":32,"value":247},{"type":27,"tag":28,"props":2837,"children":2838},{},[2839],{"type":32,"value":252},{"type":27,"tag":40,"props":2841,"children":2842},{"id":255},[2843],{"type":32,"value":255},{"type":27,"tag":52,"props":2845,"children":2846},{},[2847,2851,2855,2859,2863],{"type":27,"tag":56,"props":2848,"children":2849},{},[2850],{"type":32,"value":265},{"type":27,"tag":56,"props":2852,"children":2853},{},[2854],{"type":32,"value":270},{"type":27,"tag":56,"props":2856,"children":2857},{},[2858],{"type":32,"value":275},{"type":27,"tag":56,"props":2860,"children":2861},{},[2862],{"type":32,"value":280},{"type":27,"tag":56,"props":2864,"children":2865},{},[2866],{"type":32,"value":285},{"type":27,"tag":40,"props":2868,"children":2869},{"id":288},[2870],{"type":32,"value":288},{"type":27,"tag":28,"props":2872,"children":2873},{},[2874],{"type":32,"value":295},{"type":27,"tag":28,"props":2876,"children":2877},{},[2878],{"type":32,"value":300},{"type":27,"tag":52,"props":2880,"children":2881},{},[2882,2889,2896],{"type":27,"tag":56,"props":2883,"children":2884},{},[2885],{"type":27,"tag":308,"props":2886,"children":2887},{"href":310},[2888],{"type":32,"value":313},{"type":27,"tag":56,"props":2890,"children":2891},{},[2892],{"type":27,"tag":308,"props":2893,"children":2894},{"href":319},[2895],{"type":32,"value":322},{"type":27,"tag":56,"props":2897,"children":2898},{},[2899],{"type":27,"tag":308,"props":2900,"children":2901},{"href":328},[2902],{"type":32,"value":331},{"title":7,"searchDepth":333,"depth":333,"links":2904},[2905,2906,2907,2908,2909,2910,2911],{"id":42,"depth":336,"text":45},{"id":78,"depth":336,"text":78},{"id":121,"depth":336,"text":124},{"id":178,"depth":336,"text":178},{"id":216,"depth":336,"text":219},{"id":255,"depth":336,"text":255},{"id":288,"depth":336,"text":288},1777334675563]