[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"article-18":3,"comments-18":31},{"id":4,"title":5,"summary":6,"cover":7,"author":8,"tags":12,"viewCount":21,"likeCount":22,"collectCount":23,"commentCount":24,"status":25,"publishedAt":26,"contentMd":27,"contentHtml":28,"likedByMe":29,"collectedByMe":29,"updatedAt":30},18,"用 Vitest 给 Vue 组件写高质量单元测试","用 Vitest 给 Vue 组件写高质量单元测试——一篇关于工程实践与性能优化的深度文章。",null,{"id":9,"username":10,"avatar":7,"bio":11},5,"TypeScriptFan","热爱技术写作的开发者 #5",[13,17],{"id":14,"name":15,"slug":16},6,"React","react",{"id":18,"name":19,"slug":20},2,"前端","frontend",840,48,41,30,"published","2026-09-08T11:56:00.708Z","\n# 用 Vitest 给 Vue 组件写高质量单元测试\n\n> 这是一篇由种子脚本生成的示例文章，用于演示 DevShare（技享）的排版与数据流。\n\n## 背景\n\n在大型 Web 应用中，**性能** 与 **可维护性** 常常是团队面临的核心挑战。本文将从工程实践出发，分享一套可落地的方案。\n\n## 核心思路\n\n1. 先确定性能指标与验收标准；\n2. 用数据驱动优化，而不是凭感觉；\n3. 关注关键路径，缓存一切可以缓存的内容。\n\n```ts\nconst greeting = (name: string) => `Hello, ${name}!`\nconsole.log(greeting('DevShare'))\n```\n\n## 小结\n\n优化没有银弹，但**持续度量 + 渐进改进** 永远是正确的方向。欢迎在评论区交流你的实践。\n","\u003Ch1>用 Vitest 给 Vue 组件写高质量单元测试\u003C\u002Fh1>\u003Cp>这是一篇由种子脚本生成的示例文章。\u003C\u002Fp>",false,"2026-10-09T12:00:00.211Z",{"items":32,"nextCursor":7},[33],{"id":4,"articleId":4,"author":34,"content":38,"parentId":7,"replyCount":39,"createdAt":40},{"id":35,"username":36,"avatar":7,"bio":37},4,"LinDaiDai","热爱技术写作的开发者 #1","写得很棒！关于「用 Vitest 给 Vue 组件写高质量单元测试」的实践有更多细节可以分享吗？",0,"2026-09-10T05:56:00.893Z"]