[{"data":1,"prerenderedAt":405},["ShallowReactive",2],{"content-/blog":3,"related-blog":378},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":5,"title":7,"description":8,"keywords":9,"author":10,"date":11,"image":12,"body":13,"_type":372,"_id":373,"_source":374,"_file":375,"_stem":376,"_extension":377},"/blog","",false,"HTMLPAGE 技术博客","欢迎来到HTMLPAGE技术博客！这里我们分享关于智能网页生成、AI技术、前端开发和产品创新的深度内容。探索HTMLPAGE的技术架构、AI创新、开发实践和产品更新，了解智能网页生成背后的技术原理。","技术博客, AI技术, 网页开发, 前端技术, 产品更新","HTMLPAGE","2025-11-26","/content-images/blog/blog.jpg",{"type":14,"children":15,"toc":367},"root",[16,24,107,113,164,170,234,240,284,290,325,329,336,342],{"type":17,"tag":18,"props":19,"children":23},"element","section-title",{"description":20,"icon":21,"title":22},"查看最近发布的技术文章和产品动态","🆕","🆕 最新文章",[],{"type":17,"tag":25,"props":26,"children":28},"article-grid",{":columns":27},"2",[29,39,48,57,66,74,82,90,99],{"type":17,"tag":30,"props":31,"children":38},"article-card",{"category":32,"description":33,"icon":34,"title":35,"to":36,":tags":37},"UX设计","深入理解 UX 研究中数据、发现与洞察的区别，掌握将原始数据转化为可行业务建议的方法论","📊","数据、发现与洞察：UX研究的三层境界","/blog/data-findings-insights-ux","[\"UX研究\", \"数据分析\", \"用户洞察\"]",[],{"type":17,"tag":30,"props":40,"children":47},{"category":41,"description":42,"icon":43,"title":44,"to":45,":tags":46},"CSS开发","探讨 CSS 中瀑布流布局的三种实现方案：Grid 扩展、独立 Masonry 模块和 Item Flow 统一系统","🎨","CSS 瀑布流布局：Grid 应该演进还是让出舞台？","/blog/masonry-css-layout","[\"CSS\", \"前端开发\", \"布局设计\"]",[],{"type":17,"tag":30,"props":49,"children":56},{"category":50,"description":51,"icon":52,"title":53,"to":54,":tags":55},"Vue.js开发","分享大型组织中 Vue.js 跨版本升级的实战经验，包括策略规划、组织协调、渐进式迁移和团队协作","💚","大型团队中的工具链升级：Vue.js 版本迁移实战","/blog/vue-tooling-upgrade-strategy","[\"Vue.js\", \"工具链\", \"项目管理\"]",[],{"type":17,"tag":30,"props":58,"children":65},{"category":59,"description":60,"icon":61,"title":62,"to":63,":tags":64},"AI与技术","深入探讨 AI 在网页设计中的双面影响——一方面提升效率和优化质量，另一方面带来巨大的能源消耗和环保问题","⚖️","AI 与网页设计的可持续性悖论","/blog/ai-sustainability-paradox","[\"AI技术\", \"可持续发展\", \"环保设计\"]",[],{"type":17,"tag":30,"props":67,"children":73},{"category":68,"description":69,"icon":34,"title":70,"to":71,":tags":72},"无障碍与设计","从二元检查到阶梯评分的转变，深入理解 WCAG 3.0 如何改变无障碍评估方式","WCAG 3.0 评分模型详解","/blog/wcag-3-scoring-model","[\"无障碍设计\", \"WCAG 3.0\", \"评估标准\"]",[],{"type":17,"tag":30,"props":75,"children":81},{"category":68,"description":76,"icon":77,"title":78,"to":79,":tags":80},"深入了解如何进行包容性的用户体验研究，确保残障用户的声音被听见，让产品真正为所有人而设计","🔍","无障碍用户研究完全指南","/blog/accessible-ux-research-guide","[\"用户研究\", \"无障碍设计\", \"包容设计\"]",[],{"type":17,"tag":30,"props":83,"children":89},{"category":68,"description":84,"icon":85,"title":86,"to":87,":tags":88},"深入探讨验证码等身份验证方法对残障用户的影响，以及如何设计更包容的验证方案","🔐","验证码与无障碍访问的矛盾","/blog/captcha-accessibility-issue","[\"验证码\", \"无障碍访问\", \"身份验证\"]",[],{"type":17,"tag":30,"props":91,"children":98},{"category":92,"description":93,"icon":94,"title":95,"to":96,":tags":97},"AI技术系列","深入解析 HTMLPAGE 的多智能体协作架构和实时流式处理技术，了解 AI 系统如何高效协同工作，生成高质量的网页内容","🤖","AI架构深度剖析","/blog/ai-architecture-deep-dive","[\"AI技术\", \"系统架构\", \"技术深度\"]",[],{"type":17,"tag":30,"props":100,"children":106},{"category":92,"description":101,"icon":102,"title":103,"to":104,":tags":105},"详解实时流式输出技术，提升用户体验，实现即时反馈和渐进式渲染的技术原理","⚡","AI 生成流式技术实现","/blog/ai-generation-streaming","[\"流式处理\", \"实时技术\", \"用户体验\"]",[],{"type":17,"tag":18,"props":108,"children":112},{"description":109,"icon":110,"title":111},"按主题浏览技术内容","📚","📚 文章分类",[],{"type":17,"tag":25,"props":114,"children":115},{":columns":27},[116,125,132,140,148,156],{"type":17,"tag":30,"props":117,"children":124},{"category":118,"description":119,"icon":120,"title":121,"to":122,":tags":123},"技术分类","探讨人工智能在网页生成中的应用，包括自然语言处理、智能设计、内容生成等前沿技术","🧠","AI技术","/blog/category/ai-technology","[\"AI\", \"机器学习\", \"智能生成\"]",[],{"type":17,"tag":30,"props":126,"children":131},{"category":118,"description":127,"icon":128,"title":68,"to":129,":tags":130},"无障碍设计指南和最佳实践，包括 WCAG 标准、用户研究、包容性设计等内容","♿","/blog/category/accessibility","[\"无障碍设计\", \"包容设计\", \"用户体验\"]",[],{"type":17,"tag":30,"props":133,"children":139},{"category":118,"description":134,"icon":135,"title":136,"to":137,":tags":138},"分享系统架构和技术方案，包括微服务架构、性能优化、可扩展性设计等内容","🏗️","架构设计","/blog/category/architecture","[\"系统架构\", \"技术方案\", \"最佳实践\"]",[],{"type":17,"tag":30,"props":141,"children":147},{"category":118,"description":142,"icon":143,"title":144,"to":145,":tags":146},"前端开发技巧和最佳实践，包括 Vue、React、TypeScript 等技术栈的使用经验","💻","开发实践","/blog/category/development","[\"前端开发\", \"编程技巧\", \"代码质量\"]",[],{"type":17,"tag":30,"props":149,"children":155},{"category":118,"description":150,"icon":151,"title":152,"to":153,":tags":154},"前端性能优化技术，包括代码分割、懒加载、缓存策略、Web Vitals 等内容","📈","性能优化","/blog/category/performance","[\"性能优化\", \"Web Vitals\", \"用户体验\"]",[],{"type":17,"tag":30,"props":157,"children":163},{"category":118,"description":158,"icon":159,"title":160,"to":161,":tags":162},"新功能发布和产品演进，了解 HTMLPAGE 的最新特性和改进，把握产品发展方向","🚀","产品更新","/blog/category/product-updates","[\"新功能\", \"产品迭代\", \"用户体验\"]",[],{"type":17,"tag":18,"props":165,"children":169},{"description":166,"icon":167,"title":168},"最受关注的技术话题","🔥","🔥 热门主题",[],{"type":17,"tag":25,"props":171,"children":173},{":columns":172},"3",[174,182,188,195,202,208,214,220,227],{"type":17,"tag":30,"props":175,"children":181},{"category":176,"description":177,"icon":178,"title":179,"to":180},"热门主题","深入了解 Server-Sent Events 技术，实现实时数据推送和流式响应","🌊","服务端事件流实现","/blog/sse-implementation",[],{"type":17,"tag":30,"props":183,"children":187},{"category":176,"description":184,"icon":102,"title":185,"to":186},"优化流式数据传输性能，提升实时响应体验和系统吞吐量","流式传输优化","/blog/streaming-optimization",[],{"type":17,"tag":30,"props":189,"children":194},{"category":176,"description":190,"icon":191,"title":192,"to":193},"现代前端应用的代码分割策略，提升加载性能和用户体验","📦","代码分割最佳实践","/blog/code-splitting-practices",[],{"type":17,"tag":30,"props":196,"children":201},{"category":176,"description":197,"icon":198,"title":199,"to":200},"现代响应式布局技术，适配各种设备和屏幕尺寸的设计方案","📱","响应式布局设计","/blog/responsive-layout",[],{"type":17,"tag":30,"props":203,"children":207},{"category":176,"description":204,"icon":34,"title":205,"to":206},"Core Web Vitals 核心指标优化，提升页面性能和用户体验评分","Web Vitals 优化","/blog/web-vitals",[],{"type":17,"tag":30,"props":209,"children":213},{"category":176,"description":210,"icon":128,"title":211,"to":212},"Web 无障碍设计的完整指南，让网站对所有用户都可访问","无障碍设计指南","/blog/accessibility-guidelines",[],{"type":17,"tag":30,"props":215,"children":219},{"category":176,"description":216,"icon":43,"title":217,"to":218},"CSS 代码优化技巧，减少样式表大小，提升渲染性能","CSS 性能优化","/blog/css-optimization",[],{"type":17,"tag":30,"props":221,"children":226},{"category":176,"description":222,"icon":223,"title":224,"to":225},"JavaScript 执行效率优化，减少运行时开销，提升应用响应速度","⚙️","JavaScript 性能优化","/blog/javascript-performance",[],{"type":17,"tag":30,"props":228,"children":233},{"category":176,"description":229,"icon":230,"title":231,"to":232},"现代图像优化技术，包括格式选择、压缩算法、懒加载等","🖼️","图像优化策略","/blog/image-optimization",[],{"type":17,"tag":18,"props":235,"children":239},{"description":236,"icon":237,"title":238},"深度技术文章和开发实践","🔧","🔧 技术实践",[],{"type":17,"tag":25,"props":241,"children":242},{":columns":172},[243,250,256,263,269,277],{"type":17,"tag":30,"props":244,"children":249},{"category":245,"description":246,"icon":43,"title":247,"to":248},"前端开发","全面的 Tailwind CSS 使用指南，包括最佳实践和高级技巧","Tailwind CSS 实用指南","/blog/tailwind-css-guide",[],{"type":17,"tag":30,"props":251,"children":255},{"category":245,"description":252,"icon":52,"title":253,"to":254},"Vue 3 开发的最佳实践和常见模式，提升开发效率","Vue 3 最佳实践","/blog/vue3-best-practices",[],{"type":17,"tag":30,"props":257,"children":262},{"category":245,"description":258,"icon":259,"title":260,"to":261},"TypeScript 高级特性和实用技巧，构建类型安全的应用","🔷","TypeScript 进阶指南","/blog/typescript-support",[],{"type":17,"tag":30,"props":264,"children":268},{"category":152,"description":265,"icon":102,"title":266,"to":267},"前端性能优化的实战经验，包括首屏优化、资源压缩等技巧","性能优化实战","/blog/performance-optimization",[],{"type":17,"tag":30,"props":270,"children":276},{"category":271,"description":272,"icon":273,"title":274,"to":275},"设计系统","如何设计和构建可复用的组件库，提升开发效率","🧩","组件库设计","/blog/component-library",[],{"type":17,"tag":30,"props":278,"children":283},{"category":279,"description":280,"icon":135,"title":281,"to":282},"系统架构","微服务架构的设计原则和实施经验，构建可扩展系统","微服务架构实践","/blog/microservices-architecture",[],{"type":17,"tag":18,"props":285,"children":289},{"description":286,"icon":287,"title":288},"行业趋势和技术前瞻","💡","💡 技术洞察",[],{"type":17,"tag":25,"props":291,"children":292},{":columns":27},[293,302,310,318],{"type":17,"tag":30,"props":294,"children":301},{"category":295,"description":296,"icon":297,"title":298,"to":299,":tags":300},"技术洞察","探讨 AI 如何生成高质量内容，从文本到图像的智能创作技术","✍️","AI 内容生成技术","/blog/ai-content-generation","[\"AI技术\", \"内容生成\", \"创意工具\"]",[],{"type":17,"tag":30,"props":303,"children":309},{"category":295,"description":304,"icon":305,"title":306,"to":307,":tags":308},"如何构建可扩展的设计系统，统一产品设计语言","🎯","设计系统构建指南","/blog/design-system-building","[\"设计系统\", \"组件库\", \"设计规范\"]",[],{"type":17,"tag":30,"props":311,"children":317},{"category":295,"description":312,"icon":313,"title":314,"to":315,":tags":316},"自然语言处理技术在智能网页生成中的核心作用和实现原理","🗣️","NLP 在网页生成中的应用","/blog/nlp-in-web-generation","[\"NLP\", \"自然语言处理\", \"AI技术\"]",[],{"type":17,"tag":30,"props":319,"children":324},{"category":295,"description":320,"icon":223,"title":321,"to":322,":tags":323},"深入了解智能代码生成的核心原理，从 AST 到最终代码的转换过程","代码生成原理与实践","/blog/code-generation-principles","[\"代码生成\", \"AST\", \"编译原理\"]",[],{"type":17,"tag":326,"props":327,"children":328},"hr",{},[],{"type":17,"tag":330,"props":331,"children":333},"h2",{"id":332},"关注我们",[334],{"type":335,"value":332},"text",{"type":17,"tag":337,"props":338,"children":339},"p",{},[340],{"type":335,"value":341},"持续关注HTMLPAGE技术博客，获取最新的技术洞察和产品动态！",{"type":17,"tag":25,"props":343,"children":344},{":columns":172},[345,353,360],{"type":17,"tag":30,"props":346,"children":352},{"category":347,"description":348,"icon":349,"title":350,"to":351},"订阅","订阅我们的技术博客，第一时间获取最新文章和产品动态","📬","订阅更新","/blog/subscribe",[],{"type":17,"tag":30,"props":354,"children":359},{"category":347,"description":355,"icon":356,"title":357,"to":358},"通过 RSS 阅读器订阅，随时随地阅读最新内容","📡","RSS 订阅","/blog/rss",[],{"type":17,"tag":30,"props":361,"children":366},{"category":347,"description":362,"icon":363,"title":364,"to":365},"加入技术社区，与我们交流想法，分享你的见解和建议","💬","交流反馈","/help/contact",[],{"title":5,"searchDepth":368,"depth":368,"links":369},3,[370],{"id":332,"depth":371,"text":332},2,"markdown","content:blog:index.md","content","blog/index.md","blog/index","md",[379,389,397],{"_path":380,"_dir":381,"_draft":6,"_partial":6,"_locale":5,"title":382,"description":383,"keywords":384,"author":10,"date":11,"category":385,"image":12,"_type":372,"_id":386,"_source":374,"_file":387,"_stem":388,"_extension":377},"/blog/2025-q1-updates","blog","2025 Q1 产品更新","第一季度重大功能发布：AI 生成优化、新模板上线、编辑器增强等","2025 Q1 产品更新, Blog, HTMLPAGE","待分类","content:blog:2025-q1-updates.md","blog/2025-q1-updates.md","blog/2025-q1-updates",{"_path":390,"_dir":381,"_draft":6,"_partial":6,"_locale":5,"title":391,"description":392,"keywords":393,"author":10,"date":11,"category":385,"image":12,"_type":372,"_id":394,"_source":374,"_file":395,"_stem":396,"_extension":377},"/blog/2025-roadmap","2025 产品路线图","展望 2025 年的产品规划：AI 能力增强、模板扩充、国际化等","2025 产品路线图, Blog, HTMLPAGE","content:blog:2025-roadmap.md","blog/2025-roadmap.md","blog/2025-roadmap",{"_path":398,"_dir":381,"_draft":6,"_partial":6,"_locale":5,"title":399,"description":400,"keywords":401,"author":10,"date":11,"category":385,"image":12,"_type":372,"_id":402,"_source":374,"_file":403,"_stem":404,"_extension":377},"/blog/ab-testing","A/B 测试","通过 A/B 测试验证设计方案","A/B 测试, Blog, HTMLPAGE","content:blog:ab-testing.md","blog/ab-testing.md","blog/ab-testing",1774945259950]