[{"data":1,"prerenderedAt":4003},["ShallowReactive",2],{"app-menu-posts":3,"blog-usefetch-vs-useasyncdata-vs-fetch-nuxt-4.en-en":1129,"blog-slug-sidebar-posts":3530},[4,55,93,126,154,186,219,256,286,315,340,374,406,436,464,491,519,546,572,597,622,657,686,714,740,768,796,821,848,875,906,931,959,988,1015,1042,1065,1085,1106],{"id":5,"title":6,"cover":7,"coverAlt":8,"date":9,"description":10,"draft":11,"extension":12,"locale":13,"meta":14,"navigation":25,"path":26,"schemaOrg":27,"seo":32,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":34,"tags":35,"__hash__":54},"blog\u002Fblog\u002Fusefetch-vs-useasyncdata-vs-fetch-nuxt-4.es.md","useFetch vs useAsyncData vs $fetch en Nuxt 4","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1786757439\u002Fnuxt-4-usefetch-useasyncdata-dollarfetch-ssr_bhosyq.png","Comparación visual entre useFetch, useAsyncData y $fetch en Nuxt 4 para SSR, payload e hidratación.","2026-08-15","Aprende a elegir entre useFetch, useAsyncData y $fetch en Nuxt 4 según el tipo de carga, el flujo SSR, el payload, la reactividad y la propiedad del estado con Pinia.",false,"md","es",{"updatedAt":15,"author":16,"coverCaption":17,"keywords":18},"2026-08-14T21:30:00-05:00","TODOvue","Guía visual para elegir la API de datos adecuada en Nuxt 4.",[19,20,21,22,23,24],"useFetch vs useAsyncData vs $fetch","Nuxt 4 SSR","payload de Nuxt","hidratación en Nuxt","peticiones duplicadas","Pinia en Nuxt",true,"\u002Fblog\u002Fusefetch-vs-useasyncdata-vs-fetch-nuxt-4.es",[28],{"headline":6,"author":29,"datePublished":15,"@type":31},{"name":16,"@type":30},"Person","BlogPosting",{"title":6,"description":10},null,"blog\u002Fusefetch-vs-useasyncdata-vs-fetch-nuxt-4.es",[36,39,42,45,48,51],{"tag":37,"color":38},"Guías","#42B983",{"tag":40,"color":41},"SSR","#0E9AA7",{"tag":43,"color":44},"Composables","#14B8A6",{"tag":46,"color":47},"Reactividad","#1D5BA1",{"tag":49,"color":50},"Gestión de Estado","#FF9800",{"tag":52,"color":53},"Buenas Prácticas","#2196F3","CNtJm5gHXAQmsXaJjQNAyxsd9AYxM00UMJqaCSaFeCw",{"id":56,"title":57,"cover":58,"coverAlt":59,"date":60,"description":61,"draft":11,"extension":12,"locale":13,"meta":62,"navigation":25,"path":72,"schemaOrg":73,"seo":77,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":78,"tags":79,"__hash__":92},"blog\u002Fblog\u002Fvue-3-6-rc-vapor-mode-status-limits-evaluation-2026.es.md","Vue 3.6 RC y Vapor Mode: estado real, límites y cómo evaluarlo en 2026","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1786479202\u002Fvue-3-6-rc-vapor-mode-status-limits-evaluation-2026_zadbpu.png","Comparación técnica entre el compilador estándar de Vue y Vapor Mode durante la etapa RC de Vue 3.6.","2026-08-11","Conoce el estado de Vue 3.6 RC y Vapor Mode, sus límites, riesgos y cómo evaluarlo con pruebas reproducibles antes de adoptarlo.",{"updatedAt":63,"author":16,"coverCaption":64,"keywords":65},"2026-08-11T15:22:20-05:00","Estado, límites y evaluación práctica de Vapor Mode durante la etapa RC de Vue 3.6.",[66,67,68,69,70,71],"Vue 3.6 RC y Vapor Mode","estado de Vapor Mode","límites de Vapor Mode","evaluar Vapor Mode","Vue 3.6.0-rc.3","rendimiento de Vue","\u002Fblog\u002Fvue-3-6-rc-vapor-mode-status-limits-evaluation-2026.es",[74],{"headline":57,"author":75,"datePublished":76,"@type":31},{"name":16,"@type":30},"2026-08-11T10:00:29.882-05:00",{"title":57,"description":61},"blog\u002Fvue-3-6-rc-vapor-mode-status-limits-evaluation-2026.es",[80,83,86,89],{"tag":81,"color":82},"Vapor Mode","#41B2A6",{"tag":84,"color":85},"Avanzado","#F54927",{"tag":87,"color":88},"Rendimiento","#D4A017",{"tag":90,"color":91},"Ecosistema","#68D4F2","7NVPCXoC3K80BryEzbsgejukHOsDW41C52eX5ekFJr8",{"id":94,"title":95,"cover":96,"coverAlt":97,"date":98,"description":99,"draft":11,"extension":12,"locale":13,"meta":100,"navigation":25,"path":111,"schemaOrg":112,"seo":115,"series":116,"seriesDescription":117,"seriesOrder":118,"seriesTitle":119,"slug":33,"stem":120,"tags":121,"__hash__":125},"blog\u002Fblog\u002Freactive-performance-shallowref-readonly-markraw-unnecessary-updates.es.md","Rendimiento reactivo en Vue: shallowRef, readonly, markRaw y actualizaciones innecesarias","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1785888143\u002Freactive-performance-shallowref-readonly-markraw-unnecessary-updates_ngtda7.png","Diagrama de límites de reactividad en Vue con shallowRef, readonly y markRaw.","2026-08-05","Aprende a elegir límites de reactividad en Vue, actualizar estado superficial correctamente y distinguir conversiones profundas de renderizados evitables.",{"updatedAt":101,"author":16,"coverCaption":102,"keywords":103},"2026-08-04T19:00:00-05:00","Diagrama sobre límites de reactividad en Vue.",[104,105,106,107,108,109,110],"rendimiento reactivo en Vue","shallowRef","readonly","markRaw","actualizaciones innecesarias en Vue","triggerRef","computed estable","\u002Fblog\u002Freactive-performance-shallowref-readonly-markraw-unnecessary-updates.es",[113],{"headline":95,"author":114,"datePublished":101,"@type":31},{"name":16,"@type":30},{"title":95,"description":99},"vue-reactivity","Ruta práctica para entender cómo Vue rastrea el estado, elegir la API reactiva correcta y optimizar actualizaciones sin perder claridad.",6,"Reactividad práctica en Vue 3","blog\u002Freactive-performance-shallowref-readonly-markraw-unnecessary-updates.es",[122,123,124],{"tag":46,"color":47},{"tag":87,"color":88},{"tag":52,"color":53},"oBAJ89cVLgN74tg-dtsqL34rlWOQlxtnr53Uhsnho-Q",{"id":127,"title":128,"cover":129,"coverAlt":130,"date":131,"description":132,"draft":11,"extension":12,"locale":13,"meta":133,"navigation":25,"path":142,"schemaOrg":143,"seo":146,"series":116,"seriesDescription":117,"seriesOrder":147,"seriesTitle":119,"slug":33,"stem":148,"tags":149,"__hash__":153},"blog\u002Fblog\u002Freactivity-in-composables-toref-torefs-and-how-not-to-lose-it-when-destructuring.es.md","Reactividad en composables: `toRef`, `toRefs` y cómo no perderla al desestructurar","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1785525834\u002Freactivity-in-composables-toref-torefs-and-how-not-to-lose-it-when-destructuring_tvgcff.png","Diagrama de un composable Vue que conserva la reactividad con toRef y toRefs.","2026-08-01","Aprende por qué la desestructuración puede desconectar el estado reactivo y cuándo usar refs directas, `toRef()` o `toRefs()` en composables de Vue.",{"updatedAt":134,"author":16,"coverCaption":135,"keywords":136},"2026-07-31T19:00:00-05:00","Referencia visual para una guía sobre utilidades de reactividad de Vue.",[137,138,139,140,141],"reactividad en composables Vue","toRef Vue","toRefs Vue","desestructurar reactive Vue","composables Vue","\u002Fblog\u002Freactivity-in-composables-toref-torefs-and-how-not-to-lose-it-when-destructuring.es",[144],{"headline":128,"author":145,"datePublished":134,"@type":31},{"name":16,"@type":30},{"title":128,"description":132},4,"blog\u002Freactivity-in-composables-toref-torefs-and-how-not-to-lose-it-when-destructuring.es",[150,151,152],{"tag":46,"color":47},{"tag":43,"color":44},{"tag":37,"color":38},"eDzhgQ-HLcrcD7ryWRdK_UUJSnNR3CKaWxkSg1Am9G4",{"id":155,"title":156,"cover":157,"coverAlt":158,"date":159,"description":160,"draft":11,"extension":12,"locale":13,"meta":161,"navigation":25,"path":171,"schemaOrg":172,"seo":175,"series":116,"seriesDescription":117,"seriesOrder":176,"seriesTitle":119,"slug":33,"stem":177,"tags":178,"__hash__":185},"blog\u002Fblog\u002Fref-vs-reactive-como-modelar-el-estado-en-vue-3.es.md","ref() vs reactive(): cómo modelar el estado en Vue 3","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1785199207\u002Fref-vs-reactive-como-modelar-el-estado-en-vue-3_j8hzro.png","Comparación entre ref() y reactive() para modelar estado reactivo en Vue 3","2026-07-27","Aprende a elegir entre ref(), reactive(), toRefs() y useState() según el tipo de dato, la desestructuración y el alcance SSR.",{"updatedAt":162,"author":16,"coverCaption":163,"keywords":164},"2026-07-27T18:31:41-05:00","Referencia oficial de Vue sobre los fundamentos de la reactividad",[165,166,167,168,169,170],"ref() vs reactive()","reactividad en Vue 3","estado en Vue 3","toRefs()","useState() en Nuxt","Composition API","\u002Fblog\u002Fref-vs-reactive-como-modelar-el-estado-en-vue-3.es",[173],{"headline":156,"author":174,"datePublished":162,"@type":31},{"name":16,"@type":30},{"title":156,"description":160},2,"blog\u002Fref-vs-reactive-como-modelar-el-estado-en-vue-3.es",[179,180,181,182,183,184],{"tag":46,"color":47},{"tag":49,"color":50},{"tag":37,"color":38},{"tag":43,"color":44},{"tag":40,"color":41},{"tag":52,"color":53},"4ri62At3pbdif7nXeHjvnk4eA0dEP-DbZgMfGU_ZNFM",{"id":187,"title":188,"cover":189,"coverAlt":190,"date":191,"description":192,"draft":11,"extension":12,"locale":13,"meta":193,"navigation":25,"path":201,"schemaOrg":202,"seo":206,"series":207,"seriesDescription":208,"seriesOrder":118,"seriesTitle":209,"slug":33,"stem":210,"tags":211,"__hash__":218},"blog\u002Fblog\u002Fpinia-in-vue-3-when-to-use-global-state-and-when-not-to.es.md","Pinia en Vue 3: cuándo usar estado global y cuándo no","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1784941922\u002Fpinia-in-vue-3-when-to-use-global-state-and-when-not-to_aztyma.png","Diagrama de decisión para elegir entre estado local, props y eventos, composables o Pinia en Vue 3.","2026-07-25","Aprende a decidir si un dato debe vivir en un componente, un subárbol o una store de Pinia según sus consumidores, duración y lógica compartida.",{"updatedAt":194,"author":16,"coverCaption":195,"keywords":196},"2026-07-26T00:00:00-05:00","Referencia visual para decidir el alcance del estado en Vue 3.",[197,198,199,49,200,43],"State","Pinia","Vue 3","Arquitectura","\u002Fblog\u002Fpinia-in-vue-3-when-to-use-global-state-and-when-not-to.es",[203],{"headline":188,"author":204,"datePublished":205,"@type":31},{"name":16,"@type":30},"2026-07-24T23:20:00-05:00",{"title":188,"description":192},"vue-3-architecture","Serie práctica para diseñar aplicaciones Vue 3 mantenibles mediante comunicación clara entre componentes, lógica reutilizable, dependencias acotadas y una gestión intencional del estado.","Arquitectura de aplicaciones en Vue 3","blog\u002Fpinia-in-vue-3-when-to-use-global-state-and-when-not-to.es",[212,213,215,216,217],{"tag":49,"color":50},{"tag":200,"color":214},"#4CAF50",{"tag":52,"color":53},{"tag":43,"color":44},{"tag":40,"color":41},"HOD-MgWjq0ELvp4Sgos3olc_qJbRXYe26_GuDpSXnio",{"id":220,"title":221,"cover":222,"coverAlt":223,"date":224,"description":225,"draft":11,"extension":12,"locale":13,"meta":226,"navigation":25,"path":235,"schemaOrg":236,"seo":240,"series":207,"seriesDescription":208,"seriesOrder":241,"seriesTitle":209,"slug":33,"stem":242,"tags":243,"__hash__":255},"blog\u002Fblog\u002Fvue-3-component-architecture.es.md","Arquitectura de componentes en Vue 3: comunicación, reutilización y dependencias","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1783729357\u002Fvue-3-component-architecture_ecetna.png","Guía de Vue.js sobre arquitectura y componentes reutilizables","2026-07-10","Aprende a elegir entre props, eventos, slots, atributos heredados, composables y provide\u002Finject para diseñar componentes Vue 3 claros y mantenibles.",{"updatedAt":194,"author":16,"coverCaption":227,"keywords":228},"Referencia oficial de Vue.js sobre componentes",[229,230,231,232,233,234],"Componentes","arquitectura de componentes en Vue 3","props y eventos","slots en Vue 3","composables","provide\u002Finject","\u002Fblog\u002Fvue-3-component-architecture.es",[237],{"headline":221,"author":238,"datePublished":239,"@type":31},{"name":16,"@type":30},"2026-07-10T17:19:30-05:00",{"title":221,"description":225},1,"blog\u002Fvue-3-component-architecture.es",[244,246,247,248,249,252],{"tag":229,"color":245},"#41B883",{"tag":200,"color":214},{"tag":52,"color":53},{"tag":43,"color":44},{"tag":250,"color":251},"Eventos","#2D98DA",{"tag":253,"color":254},"Slots","#8E44AD","BaFZob8eRi9VR8OCyHwWlNIYLAdT7a-5PZC1sFT00E8",{"id":257,"title":258,"cover":259,"coverAlt":260,"date":261,"description":262,"draft":11,"extension":12,"locale":13,"meta":263,"navigation":25,"path":272,"schemaOrg":273,"seo":277,"series":116,"seriesDescription":117,"seriesOrder":278,"seriesTitle":119,"slug":33,"stem":279,"tags":280,"__hash__":285},"blog\u002Fblog\u002Fvue-computed-watch-watcheffect-guide.es.md","Vue computed vs watch vs watchEffect: cuándo usar cada uno","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1783385054\u002Fvue-computed-watch-watcheffect-guide_vepplp.png","Conceptos de reactividad en Vue representados como flujos de datos conectados","2026-07-07","Aprende la diferencia práctica entre computed, watch y watchEffect en Vue 3, con ejemplos, errores comunes y una guía de decisión para componentes reales.",{"updatedAt":264,"coverCaption":265,"author":16,"keywords":266},"2026-07-27T00:00:00-05:00","Computed, watchers y efectos en Vue 3 por TODOvue",[267,199,268,269,270,271,170],"Vue.js","computed","watch","watchEffect","reactividad","\u002Fblog\u002Fvue-computed-watch-watcheffect-guide.es",[274],{"headline":258,"author":275,"datePublished":276,"@type":31},{"name":16,"@type":30},"2026-07-06T20:00:00-05:00",{"title":258,"description":262},3,"blog\u002Fvue-computed-watch-watcheffect-guide.es",[281,282,283,284],{"tag":46,"color":47},{"tag":52,"color":53},{"tag":87,"color":88},{"tag":37,"color":38},"a8l5u3F8H-uZBX5TmLAKFBuRfvIoE5kOjfOeaSHyk-A",{"id":287,"title":288,"cover":289,"coverAlt":288,"date":290,"description":291,"draft":11,"extension":12,"locale":13,"meta":292,"navigation":25,"path":300,"schemaOrg":301,"seo":305,"series":207,"seriesDescription":208,"seriesOrder":176,"seriesTitle":209,"slug":33,"stem":306,"tags":307,"__hash__":314},"blog\u002Fblog\u002Fvue-3-props-emits-component-communication.es.md","Props y Emits en Vue 3: comunicación entre componentes","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1782863303\u002Fvue-3-props-emits-component-communication_chbuab.png","2026-07-01","Aprende cómo usar props y emits en Vue 3 para pasar datos hacia componentes hijos y comunicar eventos hacia componentes padres de forma clara.",{"updatedAt":194,"coverCaption":293,"author":16,"keywords":294},"Comunicación entre componentes en Vue 3 por TODOvue",[267,199,295,296,297,298,299],"props","emits","componentes","defineProps","defineEmits","\u002Fblog\u002Fvue-3-props-emits-component-communication.es",[302],{"headline":288,"author":303,"datePublished":304,"@type":31},{"name":16,"@type":30},"2026-06-30T20:00:00-05:00",{"title":288,"description":291},"blog\u002Fvue-3-props-emits-component-communication.es",[308,309,310,311],{"tag":229,"color":245},{"tag":250,"color":251},{"tag":37,"color":38},{"tag":312,"color":313},"Básico","#B173BF","dLcA6qwTAutjayKo9BSZ8VD27UMroxba5SkIczwtVII",{"id":316,"title":317,"cover":318,"coverAlt":319,"date":320,"description":321,"draft":11,"extension":12,"locale":13,"meta":322,"navigation":25,"path":327,"schemaOrg":328,"seo":332,"series":207,"seriesDescription":208,"seriesOrder":278,"seriesTitle":209,"slug":33,"stem":333,"tags":334,"__hash__":339},"blog\u002Fblog\u002Fvue-3-composables-extract-reusable-logic.es.md","Composables en Vue 3: cómo extraer lógica reutilizable sin complicarte","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1782172219\u002Fvue-3-composables-extract-reusable-logic.es.md_myyutl.png","Pantalla con código en un entorno de desarrollo","2026-06-23","Aprende qué son los composables en Vue 3, cuándo conviene usarlos y cómo extraer lógica reutilizable con un ejemplo claro usando useToggle.",{"updatedAt":194,"coverCaption":323,"author":16,"keywords":324},"Código reutilizable en Vue 3 por TODOvue",[267,199,43,170,325,326],"useToggle","lógica reutilizable","\u002Fblog\u002Fvue-3-composables-extract-reusable-logic.es",[329],{"headline":317,"author":330,"datePublished":331,"@type":31},{"name":16,"@type":30},"2026-06-22T20:00:00-05:00",{"title":317,"description":321},"blog\u002Fvue-3-composables-extract-reusable-logic.es",[335,336,337,338],{"tag":43,"color":44},{"tag":229,"color":245},{"tag":52,"color":53},{"tag":312,"color":313},"fUGaAtyXtTvA6HVDF8xZfMxwmMsfGc4zmxB1UCsyhQs",{"id":341,"title":342,"cover":343,"coverAlt":344,"date":345,"description":346,"draft":11,"extension":12,"locale":13,"meta":347,"navigation":25,"path":355,"schemaOrg":356,"seo":359,"series":360,"seriesDescription":361,"seriesOrder":362,"seriesTitle":363,"slug":33,"stem":364,"tags":365,"__hash__":373},"blog\u002Fblog\u002Fvue-lifecycle-ssr-serverprefetch.es.md","Ciclos de vida en Vue: renderizado del lado del servidor (serverPrefetch)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1774051488\u002Fvue-lifecycle-ssr-serverprefetch_averlr.png","Ilustración de un servidor entregando HTML con datos ya resueltos, mientras un cliente hidrata sin necesidad de fetch adicional.","2026-03-21","Cómo usar serverPrefetch y onServerPrefetch para cargar datos antes del render SSR, evitar HTML incompleto y coordinar el primer render del servidor con la hidratación del cliente.",{"updatedAt":348,"readingTime":349,"coverCaption":350,"author":16,"keywords":351},"2026-03-20T20:00:00-05:00",8,"Con `serverPrefetch`, el servidor puede entregar HTML ya completo, mejorando la experiencia y el SEO desde el primer render.",[267,352,353,40,354],"serverPrefetch","onServerPrefetch","hidratación","\u002Fblog\u002Fvue-lifecycle-ssr-serverprefetch.es",[357],{"headline":342,"author":358,"datePublished":348,"@type":31},{"name":16,"@type":30},{"title":342,"description":346},"vue-lifecycle-hooks","Serie práctica para dominar cada hook del ciclo de vida de Vue, desde los básicos hasta los avanzados.",9,"Ciclos de vida en Vue","blog\u002Fvue-lifecycle-ssr-serverprefetch.es",[366,369,370,371,372],{"tag":367,"color":368},"Ciclo de Vida","#FF6B6B",{"tag":40,"color":41},{"tag":200,"color":214},{"tag":229,"color":245},{"tag":84,"color":85},"gpVQi88PJ9GPzNJNjmGEweIYhWKcd-KIwq-VxiZMkTQ",{"id":375,"title":376,"cover":377,"coverAlt":378,"date":379,"description":380,"draft":11,"extension":12,"locale":13,"meta":381,"navigation":25,"path":389,"schemaOrg":390,"seo":393,"series":360,"seriesDescription":361,"seriesOrder":349,"seriesTitle":363,"slug":33,"stem":394,"tags":395,"__hash__":405},"blog\u002Fblog\u002Fvue-lifecycle-render-debug-rendertracked-rendertriggered.es.md","Ciclos de vida en Vue: depuración del render (renderTracked, renderTriggered)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773802976\u002Fvue-lifecycle-render-debug-rendertracked-rendertriggered_ekkgg1.png","Ilustración de depuración del render en Vue con renderTracked y renderTriggered","2026-03-18","Cómo usar renderTracked, renderTriggered, onRenderTracked y onRenderTriggered para entender qué dependencias entran en un render y qué cambios están forzando nuevas actualizaciones.",{"updatedAt":382,"coverCaption":383,"author":16,"keywords":384},"2026-03-17T22:00:00-05:00","renderTracked y renderTriggered ayudan a ver qué dependencia entra al render y cuál lo vuelve a disparar.",[267,385,386,387,388],"renderTracked","renderTriggered","onRenderTracked","onRenderTriggered","\u002Fblog\u002Fvue-lifecycle-render-debug-rendertracked-rendertriggered.es",[391],{"headline":376,"author":392,"datePublished":382,"@type":31},{"name":16,"@type":30},{"title":376,"description":380},"blog\u002Fvue-lifecycle-render-debug-rendertracked-rendertriggered.es",[396,397,400,403,404],{"tag":367,"color":368},{"tag":398,"color":399},"Depuración","#C44569",{"tag":401,"color":402},"Renderizado","#E17055",{"tag":46,"color":47},{"tag":84,"color":85},"5mr-vMalD_jw1VlwSiz5cmZRVM9obP8ZlRFNu2rgR88",{"id":407,"title":408,"cover":409,"coverAlt":410,"date":411,"description":412,"draft":11,"extension":12,"locale":13,"meta":413,"navigation":25,"path":421,"schemaOrg":422,"seo":425,"series":360,"seriesDescription":361,"seriesOrder":426,"seriesTitle":363,"slug":33,"stem":427,"tags":428,"__hash__":435},"blog\u002Fblog\u002Fvue-lifecycle-error-handling-errorcaptured.es.md","Ciclos de vida en Vue: manejo de errores con errorCaptured","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773714502\u002Fvue-lifecycle-error-handling-errorcaptured_mn62y7.png","Ilustración de un componente de Vue con un escudo de protección, simbolizando el manejo de errores con errorCaptured.","2026-03-17","Cómo usar errorCaptured y onErrorCaptured para aislar fallos en componentes hijos, mostrar estados de respaldo y registrar errores sin romper toda la interfaz.",{"updatedAt":414,"coverCaption":415,"author":16,"keywords":416},"2026-03-16T22:00:00-05:00","Con errorCaptured, puedes proteger partes específicas de tu UI sin comprometer toda la experiencia.",[267,417,418,419,420],"errorCaptured","onErrorCaptured","manejo de errores","error boundaries","\u002Fblog\u002Fvue-lifecycle-error-handling-errorcaptured.es",[423],{"headline":408,"author":424,"datePublished":414,"@type":31},{"name":16,"@type":30},{"title":408,"description":412},7,"blog\u002Fvue-lifecycle-error-handling-errorcaptured.es",[429,430,433,434],{"tag":367,"color":368},{"tag":431,"color":432},"Manejo de Errores","#E55039",{"tag":229,"color":245},{"tag":84,"color":85},"epm2rTVpqLV5pyIW1xBngTSC9yZ0Hdu43YNcWNkm4xw",{"id":437,"title":438,"cover":439,"coverAlt":440,"date":441,"description":442,"draft":11,"extension":12,"locale":13,"meta":443,"navigation":25,"path":451,"schemaOrg":452,"seo":455,"series":360,"seriesDescription":361,"seriesOrder":118,"seriesTitle":363,"slug":33,"stem":456,"tags":457,"__hash__":463},"blog\u002Fblog\u002Fvue-lifecycle-keepalive-activated-deactivated.es.md","Ciclos de vida en Vue: componentes cacheados con \u003CKeepAlive> (activated, deactivated)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773371011\u002Fvue-lifecycle-keepalive-activated-deactivated_abjmwe.png","Ilustración de componentes cacheados con KeepAlive en Vue usando activated y deactivated","2026-03-13","Cómo funcionan activated y deactivated en componentes cacheados con \u003CKeepAlive>, cuándo usarlos y cómo evitar datos obsoletos, timers activos y lógica mal ubicada.",{"updatedAt":444,"coverCaption":445,"author":16,"keywords":446},"2026-03-12T23:00:00-05:00","KeepAlive permite desactivar y reactivar componentes sin destruir su estado local",[267,447,448,449,450],"KeepAlive","activated","deactivated","cache de componentes","\u002Fblog\u002Fvue-lifecycle-keepalive-activated-deactivated.es",[453],{"headline":438,"author":454,"datePublished":444,"@type":31},{"name":16,"@type":30},{"title":438,"description":442},"blog\u002Fvue-lifecycle-keepalive-activated-deactivated.es",[458,459,461,462],{"tag":367,"color":368},{"tag":447,"color":460},"#27AE60",{"tag":229,"color":245},{"tag":84,"color":85},"LTJL6v4mw6lt5Nb8vhKocgwmO5u1q1TkDLjAgpE1abw",{"id":465,"title":466,"cover":467,"coverAlt":468,"date":469,"description":470,"draft":11,"extension":12,"locale":13,"meta":471,"navigation":25,"path":479,"schemaOrg":480,"seo":483,"series":360,"seriesDescription":361,"seriesOrder":484,"seriesTitle":363,"slug":33,"stem":485,"tags":486,"__hash__":490},"blog\u002Fblog\u002Fvue-lifecycle-unmounting-phase-beforeunmount-unmounted.es.md","Ciclos de vida en Vue: fase de desmontaje (beforeUnmount, unmounted)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773284773\u002Fvue-lifecycle-unmounting-phase-beforeunmount-unmounted_f9gqy0.png","Ilustración de la fase de desmontaje del ciclo de vida de Vue con beforeUnmount y unmounted","2026-03-12","Qué ocurre cuando un componente sale de pantalla y cómo usar beforeUnmount y unmounted para limpiar listeners, timers y efectos sin dejar fugas ni comportamientos extraños.",{"updatedAt":472,"coverCaption":473,"author":16,"keywords":474},"2026-03-11T22:00:00-05:00","La fase de desmontaje ocurre cuando Vue retira un componente del árbol activo",[267,475,476,477,478],"beforeUnmount","unmounted","onBeforeUnmount","cleanup","\u002Fblog\u002Fvue-lifecycle-unmounting-phase-beforeunmount-unmounted.es",[481],{"headline":466,"author":482,"datePublished":472,"@type":31},{"name":16,"@type":30},{"title":466,"description":470},5,"blog\u002Fvue-lifecycle-unmounting-phase-beforeunmount-unmounted.es",[487,488,489],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":312,"color":313},"smji8WZsDewTRrh-7nuJ-1afgxZeubOV6QESqNZQknk",{"id":492,"title":493,"cover":494,"coverAlt":495,"date":496,"description":497,"draft":11,"extension":12,"locale":13,"meta":498,"navigation":25,"path":506,"schemaOrg":507,"seo":510,"series":360,"seriesDescription":361,"seriesOrder":147,"seriesTitle":363,"slug":33,"stem":511,"tags":512,"__hash__":518},"blog\u002Fblog\u002Fvue-lifecycle-update-phase-beforeupdate-updated.es.md","Ciclos de vida en Vue: fase de actualización (beforeUpdate, updated)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773284616\u002Fvue-lifecycle-update-phase-beforeupdate-updated_qql7os.png","Ilustración de la fase de actualización del ciclo de vida de Vue con beforeUpdate y updated","2026-03-11","Qué ocurre cuando Vue vuelve a renderizar un componente y cómo usar beforeUpdate y updated sin convertirlos en sustitutos de watch o computed.",{"updatedAt":499,"coverCaption":500,"author":16,"keywords":501},"2026-03-10T22:00:00-05:00","La fase de actualización ocurre cuando un cambio reactivo obliga a Vue a volver a renderizar el componente.",[267,502,503,504,505],"beforeUpdate","updated","onUpdated","renderizado","\u002Fblog\u002Fvue-lifecycle-update-phase-beforeupdate-updated.es",[508],{"headline":493,"author":509,"datePublished":499,"@type":31},{"name":16,"@type":30},{"title":493,"description":497},"blog\u002Fvue-lifecycle-update-phase-beforeupdate-updated.es",[513,514,515,516,517],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":401,"color":402},{"tag":46,"color":47},{"tag":312,"color":313},"98z2JKjTHZwuUniJlvBcSw0oAKPwayH9G9A608P_wSQ",{"id":520,"title":521,"cover":522,"coverAlt":523,"date":524,"description":525,"draft":11,"extension":12,"locale":13,"meta":526,"navigation":25,"path":534,"schemaOrg":535,"seo":538,"series":360,"seriesDescription":361,"seriesOrder":278,"seriesTitle":363,"slug":33,"stem":539,"tags":540,"__hash__":545},"blog\u002Fblog\u002Fvue-lifecycle-mounting-phase-beforemount-mounted.es.md","Ciclos de vida en Vue: fase de montaje (beforeMount, mounted)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773284431\u002Fvue-lifecycle-mounting-phase-beforemount-mounted_wkrzal.png","Ilustración del ciclo de vida de un componente Vue enfocada en la fase de montaje del DOM","2026-03-10","Qué ocurre justo antes y justo después de que Vue inserte un componente en el DOM, y cómo usar beforeMount y mounted sin meter lógica donde no corresponde.",{"updatedAt":527,"coverCaption":528,"author":16,"keywords":529},"2026-03-09T22:00:00-05:00","La fase de montaje es el momento en el que Vue crea e inserta el DOM del componente en la página.",[267,530,531,532,533],"beforeMount","mounted","onMounted","DOM","\u002Fblog\u002Fvue-lifecycle-mounting-phase-beforemount-mounted.es",[536],{"headline":521,"author":537,"datePublished":527,"@type":31},{"name":16,"@type":30},{"title":521,"description":525},"blog\u002Fvue-lifecycle-mounting-phase-beforemount-mounted.es",[541,542,543,544],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":401,"color":402},{"tag":312,"color":313},"GQ-lIt1QfPL-Vw50b8qQ3uquMQjxzjBexBGH1U_jPMM",{"id":547,"title":548,"cover":549,"coverAlt":550,"date":551,"description":552,"draft":11,"extension":12,"locale":13,"meta":553,"navigation":25,"path":560,"schemaOrg":561,"seo":564,"series":360,"seriesDescription":361,"seriesOrder":176,"seriesTitle":363,"slug":33,"stem":565,"tags":566,"__hash__":571},"blog\u002Fblog\u002Fvue-lifecycle-creation-phase-beforecreate-created-setup.es.md","Ciclos de vida en Vue: fase de creación (beforeCreate, created, setup)","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1773284254\u002Fvue-lifecycle-creation-phase-beforecreate-created-setup_fkkyiw.png","Ilustración de un ciclo de vida de un componente Vue, destacando la fase de creación con beforeCreate, created y setup","2026-03-07","Qué pasa realmente en la fase de creación de un componente Vue y cómo decidir entre beforeCreate, created y setup.",{"updatedAt":554,"coverCaption":555,"author":16,"keywords":556},"2026-03-06T20:00:00-05:00","En esta imagen se muestra el ciclo de vida de un componente Vue, con énfasis en la fase de creación donde se ejecutan los hooks beforeCreate, created y setup.",[267,557,558,559,170],"beforeCreate","created","setup","\u002Fblog\u002Fvue-lifecycle-creation-phase-beforecreate-created-setup.es",[562],{"headline":548,"author":563,"datePublished":554,"@type":31},{"name":16,"@type":30},{"title":548,"description":552},"blog\u002Fvue-lifecycle-creation-phase-beforecreate-created-setup.es",[567,568,569,570],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":46,"color":47},{"tag":312,"color":313},"gD0R9mljoBWBraFYutY3GdOI6IFtdYK-ul1RE0pCfVo",{"id":573,"title":574,"cover":575,"coverAlt":574,"date":576,"description":577,"draft":11,"extension":12,"locale":13,"meta":578,"navigation":25,"path":585,"schemaOrg":586,"seo":589,"series":360,"seriesDescription":361,"seriesOrder":241,"seriesTitle":363,"slug":33,"stem":590,"tags":591,"__hash__":596},"blog\u002Fblog\u002Fvue-lifecycle-hooks-overview.es.md","Ciclos de vida en Vue: Una visión general","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1772676391\u002Fvue-lifecycle-hooks-overview_ovnxzy.png","2026-03-05","Un mapa claro de todos los ciclos de vida de Vue 3 para entender cuándo usar cada hook.",{"updatedAt":579,"readingTime":349,"coverCaption":580,"author":16,"keywords":581},"2026-03-04T21:30:00-05:00","Panorama de los hooks del ciclo de vida en Vue 3.",[267,582,170,583,584],"Ciclos de vida","Options API","Hooks","\u002Fblog\u002Fvue-lifecycle-hooks-overview.es",[587],{"headline":574,"author":588,"datePublished":579,"@type":31},{"name":16,"@type":30},{"title":574,"description":577},"blog\u002Fvue-lifecycle-hooks-overview.es",[592,593,594,595],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":46,"color":47},{"tag":312,"color":313},"SBKJnT6tEFXx0FslfjbqCoy_-zKjHKGzNv961L2uqmc",{"id":598,"title":599,"cover":600,"coverAlt":599,"date":601,"description":602,"draft":11,"extension":12,"locale":13,"meta":603,"navigation":25,"path":609,"schemaOrg":610,"seo":614,"series":116,"seriesDescription":117,"seriesOrder":484,"seriesTitle":119,"slug":33,"stem":615,"tags":616,"__hash__":621},"blog\u002Fblog\u002Fvue-3-reactivity-internals.es.md","Cómo funciona internamente el sistema de reactividad en Vue 3","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1772497884\u002Fvue-3-reactivity-internals_hhru1s.png","2026-03-03","Disección técnica del motor reactivo de Vue 3: dependency tracking, estructura WeakMap->Map->Set, activeEffect, scheduler, batching y errores reales de arquitectura.",{"updatedAt":264,"coverCaption":604,"author":16,"keywords":605},"Portada temporal: reemplazar por arte final de TODOvue",[199,271,606,607,608,268],"dependency tracking","scheduler","batching","\u002Fblog\u002Fvue-3-reactivity-internals.es",[611],{"headline":599,"author":612,"datePublished":613,"@type":31},{"name":16,"@type":30},"2026-03-02T20:00:00-05:00",{"title":599,"description":602},"blog\u002Fvue-3-reactivity-internals.es",[617,618,619,620],{"tag":46,"color":47},{"tag":200,"color":214},{"tag":87,"color":88},{"tag":84,"color":85},"hSP4l_wcWdf1tErUej5yTDbc2Tt0ZF4eiL1QPmqxGm4",{"id":623,"title":624,"cover":625,"coverAlt":626,"date":627,"description":628,"draft":11,"extension":12,"locale":13,"meta":629,"navigation":25,"path":635,"schemaOrg":636,"seo":640,"series":641,"seriesDescription":642,"seriesOrder":643,"seriesTitle":644,"slug":33,"stem":645,"tags":646,"__hash__":656},"blog\u002Fblog\u002Fdirectives-vue-custom-directives-guide.es.md","Directivas en Vue: Directivas personalizadas","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1772207944\u002Fdirectives-vue-custom-directives-guide_nwp7od.png","Ejemplo de directiva personalizada en Vue 3","2026-02-27","Aprende a crear directivas personalizadas en Vue 3 con casos reales, ciclo de vida, limpieza correcta y ejemplos equivalentes en Composition API y Options API.",{"updatedAt":630,"coverCaption":626,"author":16,"keywords":631},"2026-02-27T12:30:00-05:00",[267,632,633,634,170,583],"directivas personalizadas","custom directives","ciclo de vida","\u002Fblog\u002Fdirectives-vue-custom-directives-guide.es",[637],{"headline":638,"author":639,"datePublished":630,"@type":31},"Directivas personalizadas en Vue 3",{"name":16,"@type":30},{"title":624,"description":628},"vue-directives","Ruta paso a paso para dominar las directivas principales de Vue.",11,"Directivas en Vue","blog\u002Fdirectives-vue-custom-directives-guide.es",[647,650,653,654,655],{"tag":648,"color":649},"Directivas","#6C5CE7",{"tag":651,"color":652},"Directivas Personalizadas","#7D5FFF",{"tag":200,"color":214},{"tag":46,"color":47},{"tag":84,"color":85},"wVpr_e--WXOvyGkAScAp5eWTfVDbzY9Te6sVUdj96GA",{"id":658,"title":659,"cover":660,"coverAlt":661,"date":662,"description":663,"draft":11,"extension":12,"locale":13,"meta":664,"navigation":25,"path":670,"schemaOrg":671,"seo":675,"series":641,"seriesDescription":642,"seriesOrder":676,"seriesTitle":644,"slug":33,"stem":677,"tags":678,"__hash__":685},"blog\u002Fblog\u002Fdirectives-vue-v-cloak-guide.es.md","Directivas en Vue: v-cloak","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771976009\u002Fdirectives-vue-v-cloak-guide_vhkz2i.png","Portada temporal para el artículo sobre v-cloak en Vue","2026-02-25","Aprende a usar v-cloak en Vue 3 para evitar el parpadeo de plantillas sin compilar, con Composition API y Options API, casos reales, errores comunes y buenas prácticas.",{"updatedAt":665,"coverCaption":604,"author":16,"keywords":666},"2026-02-25T12:30:00-05:00",[267,667,668,669,170,583],"v-cloak","FOUC","hydration","\u002Fblog\u002Fdirectives-vue-v-cloak-guide.es",[672],{"headline":673,"author":674,"datePublished":665,"@type":31},"Directiva v-cloak en Vue: evita parpadeos antes del montaje",{"name":16,"@type":30},{"title":659,"description":663},10,"blog\u002Fdirectives-vue-v-cloak-guide.es",[679,680,683,684],{"tag":648,"color":649},{"tag":681,"color":682},"Templates","#00B894",{"tag":401,"color":402},{"tag":312,"color":313},"JfS7unY1XQ1HsdW8oWBHbTqDpzHjl2-9BrnPQZr3SRE",{"id":687,"title":688,"cover":689,"coverAlt":690,"date":691,"description":692,"draft":11,"extension":12,"locale":13,"meta":693,"navigation":25,"path":700,"schemaOrg":701,"seo":705,"series":641,"seriesDescription":642,"seriesOrder":362,"seriesTitle":644,"slug":33,"stem":706,"tags":707,"__hash__":713},"blog\u002Fblog\u002Fdirectives-vue-v-once-v-memo-v-pre-guide.es.md","Directivas en Vue: v-once \u002F v-memo \u002F v-pre","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771897190\u002Fdirectives-vue-v-once-v-memo-v-pre-guide_ljsdlv.png","Imagen temporal para portada del artículo sobre v-once, v-memo y v-pre en Vue","2026-02-24","Aprende cuándo usar v-once, v-memo y v-pre en Vue 3 para optimizar renderizado, evitar trabajo innecesario y mantener componentes claros.",{"updatedAt":694,"coverCaption":604,"author":16,"keywords":695},"2026-02-23T21:00:00-05:00",[267,696,697,698,699],"v-once","v-memo","v-pre","optimización render","\u002Fblog\u002Fdirectives-vue-v-once-v-memo-v-pre-guide.es",[702],{"headline":703,"author":704,"datePublished":694,"@type":31},"Directivas en Vue: v-once, v-memo y v-pre para renderizado eficiente",{"name":16,"@type":30},{"title":688,"description":692},"blog\u002Fdirectives-vue-v-once-v-memo-v-pre-guide.es",[708,709,710,711,712],{"tag":648,"color":649},{"tag":87,"color":88},{"tag":401,"color":402},{"tag":46,"color":47},{"tag":84,"color":85},"ltUtJZ-ViSqRogEpVIS3x2XdEz345biUTyEg7SJpXLo",{"id":715,"title":716,"cover":717,"coverAlt":718,"date":719,"description":720,"draft":11,"extension":12,"locale":33,"meta":721,"navigation":25,"path":728,"schemaOrg":729,"seo":732,"series":641,"seriesDescription":642,"seriesOrder":349,"seriesTitle":644,"slug":33,"stem":733,"tags":734,"__hash__":739},"blog\u002Fblog\u002Fdirectives-vue-v-text-v-html-guide.es.md","Directivas en Vue: v-text y v-html","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771635700\u002Fdirectives-vue-v-text-v-html-guide_n0cemz.png","Ejemplo de uso de v-text y v-html en Vue.js","2026-02-21","Aprende cuándo usar v-text y v-html en Vue, diferencias clave, riesgos de seguridad, errores comunes y patrones recomendados con ejemplos en Composition API y Options API.",{"updatedAt":722,"coverCaption":723,"keywords":724},"2026-02-20T20:00:00-05:00","Aprende a usar v-text y v-html de forma segura y efectiva en tus proyectos Vue",[267,725,726,727,505,170,583],"v-text","v-html","XSS","\u002Fblog\u002Fdirectives-vue-v-text-v-html-guide.es",[730],{"headline":716,"author":731,"datePublished":722,"@type":31},{"name":16,"@type":30},{"title":716,"description":720},"blog\u002Fdirectives-vue-v-text-v-html-guide.es",[735,736,737,738],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":401,"color":402},{"tag":312,"color":313},"nRl4DrJhzsMVrCXStftR_-Go1SJK8NAAhi0uuGqgmkI",{"id":741,"title":742,"cover":743,"coverAlt":744,"date":745,"description":746,"draft":11,"extension":12,"locale":13,"meta":747,"navigation":25,"path":755,"schemaOrg":756,"seo":760,"series":641,"seriesDescription":642,"seriesOrder":426,"seriesTitle":644,"slug":33,"stem":761,"tags":762,"__hash__":767},"blog\u002Fblog\u002Fdirectives-vue-v-slot-guide.es.md","Directivas en Vue: v-slot","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771508914\u002Fdirectives-vue-v-slot-guide_wr2iyy.png","Portada del artículo Directivas en Vue: v-slot","2026-02-19","Aprende a dominar v-slot en Vue 3: slots por defecto, nombrados y con props (scoped slots), con ejemplos claros en Composition API y Options API.",{"updatedAt":748,"coverCaption":749,"author":16,"keywords":750},"2026-02-19T08:00:00-05:00","Usa v-slot para construir componentes más flexibles y reutilizables.",[267,751,752,753,754,170,583],"v-slot","slots","scoped slots","componentes reutilizables","\u002Fblog\u002Fdirectives-vue-v-slot-guide.es",[757],{"headline":758,"author":759,"datePublished":748,"@type":31},"Directivas en Vue: v-slot con ejemplos claros y prácticos",{"name":16,"@type":30},{"title":742,"description":746},"blog\u002Fdirectives-vue-v-slot-guide.es",[763,764,765,766],{"tag":648,"color":649},{"tag":253,"color":254},{"tag":229,"color":245},{"tag":84,"color":85},"DxshI1c7MLWMpiJg_QZh4QLABHouxeRnejywUpaJAOU",{"id":769,"title":770,"cover":771,"coverAlt":772,"date":773,"description":774,"draft":11,"extension":12,"locale":13,"meta":775,"navigation":25,"path":781,"schemaOrg":782,"seo":786,"series":641,"seriesDescription":642,"seriesOrder":118,"seriesTitle":644,"slug":33,"stem":787,"tags":788,"__hash__":795},"blog\u002Fblog\u002Fdirectives-vue-v-model-guide.es.md","Directivas en Vue: v-model","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771265788\u002Fdirectives-vue-v-model-guide_ticgya.png","Imagen temporal para portada del artículo sobre v-model en Vue","2026-02-16","Aprende a usar v-model en Vue 3 para formularios y componentes personalizados, con Composition API y Options API, casos reales, errores comunes y buenas practicas.",{"updatedAt":776,"coverCaption":604,"author":16,"keywords":777},"2026-02-16T13:30:00-05:00",[267,778,779,780,170,583],"v-model","formularios","two-way binding","\u002Fblog\u002Fdirectives-vue-v-model-guide.es",[783],{"headline":784,"author":785,"datePublished":776,"@type":31},"Directiva v-model en Vue: guía completa para formularios y componentes",{"name":16,"@type":30},{"title":770,"description":774},"blog\u002Fdirectives-vue-v-model-guide.es",[789,790,793,794],{"tag":648,"color":649},{"tag":791,"color":792},"Formularios","#E67E22",{"tag":46,"color":47},{"tag":312,"color":313},"O_hXXsF2G3Nazt5a_Ggj8OT6_GTMtHDuGhVbwudOzcU",{"id":797,"title":798,"cover":799,"coverAlt":800,"date":801,"description":802,"draft":11,"extension":12,"locale":13,"meta":803,"navigation":25,"path":809,"schemaOrg":810,"seo":814,"series":641,"seriesDescription":642,"seriesOrder":484,"seriesTitle":644,"slug":33,"stem":815,"tags":816,"__hash__":820},"blog\u002Fblog\u002Fdirectives-vue-v-on-guide.es.md","Directivas en Vue: v-on","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771022043\u002Fdirectives-vue-v-on-guide_hwtqel.png","Imagen temporal para portada del articulo sobre v-on en Vue","2026-02-13","Aprende a usar v-on en Vue con eventos del DOM, modificadores, atajos de teclado y buenas practicas para mantener componentes claros y mantenibles.",{"updatedAt":804,"coverCaption":604,"author":16,"keywords":805},"2026-02-13T10:30:00-05:00",[267,806,807,808,170,583],"v-on","eventos","event modifiers","\u002Fblog\u002Fdirectives-vue-v-on-guide.es",[811],{"headline":812,"author":813,"datePublished":804,"@type":31},"Directiva v-on en Vue: guia practica para manejar eventos",{"name":16,"@type":30},{"title":798,"description":802},"blog\u002Fdirectives-vue-v-on-guide.es",[817,818,819],{"tag":648,"color":649},{"tag":250,"color":251},{"tag":312,"color":313},"WAEXmV8fTD0ITkOvmyn62Tdvu5vw7wpMPNxDrqfLAt4",{"id":822,"title":823,"cover":824,"coverAlt":825,"date":826,"description":827,"draft":11,"extension":12,"locale":13,"meta":828,"navigation":25,"path":835,"schemaOrg":836,"seo":840,"series":641,"seriesDescription":642,"seriesOrder":147,"seriesTitle":644,"slug":33,"stem":841,"tags":842,"__hash__":847},"blog\u002Fblog\u002Fdirectives-vue-v-bind-guide.es.md","Directivas en Vue: v-bind","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1770849828\u002Fdirectives-vue-v-bind-guide_gqrgyj.png","Imagen temporal para portada del artículo sobre v-bind en Vue","2026-02-11","Aprende a usar v-bind en Vue desde lo más básico hasta patrones avanzados: atributos dinámicos, class\u002Fstyle reactivos, props en componentes y errores comunes.",{"updatedAt":829,"coverCaption":604,"author":16,"keywords":830},"2026-02-11T18:00:00-05:00",[267,831,832,833,834,170,583],"v-bind","atributos dinámicos","class binding","style binding","\u002Fblog\u002Fdirectives-vue-v-bind-guide.es",[837],{"headline":838,"author":839,"datePublished":829,"@type":31},"Directiva v-bind en Vue: guía de básico a avanzado",{"name":16,"@type":30},{"title":823,"description":827},"blog\u002Fdirectives-vue-v-bind-guide.es",[843,844,845,846],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":46,"color":47},{"tag":312,"color":313},"ggicPee9rp0vgescxGeL26jTmua2py715WKhjmXHpp0",{"id":849,"title":850,"cover":851,"coverAlt":852,"date":853,"description":854,"draft":11,"extension":12,"locale":13,"meta":855,"navigation":25,"path":861,"schemaOrg":862,"seo":866,"series":641,"seriesDescription":642,"seriesOrder":278,"seriesTitle":644,"slug":33,"stem":867,"tags":868,"__hash__":874},"blog\u002Fblog\u002Fdirectives-vue-v-for-guide.es.md","Directivas en Vue: v-for","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1770690176\u002Fdirectives-vue-v-for-guide_itbdds.png","Imagen temporal para portada del artículo sobre v-for en Vue","2026-02-10","Aprende a dominar v-for en Vue con ejemplos prácticos desde lo más básico hasta patrones avanzados, uso correcto de key, errores comunes y buenas prácticas en Composition API y Options API.",{"updatedAt":856,"coverCaption":604,"author":16,"keywords":857},"2026-02-09T21:30:00-05:00",[267,858,859,860,170,583,505],"v-for","listas","key","\u002Fblog\u002Fdirectives-vue-v-for-guide.es",[863],{"headline":864,"author":865,"datePublished":856,"@type":31},"Directiva v-for en Vue: guía completa de básico a avanzado",{"name":16,"@type":30},{"title":850,"description":854},"blog\u002Fdirectives-vue-v-for-guide.es",[869,870,872,873],{"tag":648,"color":649},{"tag":871,"color":47},"Listas",{"tag":681,"color":682},{"tag":312,"color":313},"h_Z-6C71ir_sIzxviVE8eEY3vMd8ZVXbADx8GTll9U8",{"id":876,"title":877,"cover":878,"coverAlt":879,"date":880,"description":881,"draft":11,"extension":12,"locale":13,"meta":882,"navigation":25,"path":891,"schemaOrg":892,"seo":896,"series":641,"seriesDescription":642,"seriesOrder":176,"seriesTitle":644,"slug":33,"stem":897,"tags":898,"__hash__":905},"blog\u002Fblog\u002Fdirectives-vue-v-if-v-else-v-show-guide.es.md","Directivas en Vue: v-if, v-else y v-show","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1771265982\u002Fdirectives-vue-v-if-v-else-v-show-guide_qmtjik.png","Ilustración conceptual del renderizado condicional en Vue.js","2026-02-05","Aprende a usar v-if, v-else y v-show en Vue con ejemplos claros, buenas prácticas y notas clave para elegir correctamente entre renderizado condicional y visibilidad.",{"updatedAt":883,"coverCaption":884,"author":16,"keywords":885},"2026-02-05T12:30:00-05:00","Renderizado condicional en Vue.js ilustrado por TODOvue",[267,886,887,888,889,890,170,583],"v-if","v-else","v-show","conditional rendering","directives","\u002Fblog\u002Fdirectives-vue-v-if-v-else-v-show-guide.es",[893],{"headline":894,"author":895,"datePublished":883,"@type":31},"v-if, v-else y v-show en Vue: cuándo usar cada uno",{"name":16,"@type":30},{"title":877,"description":881},"blog\u002Fdirectives-vue-v-if-v-else-v-show-guide.es",[899,900,903,904],{"tag":648,"color":649},{"tag":901,"color":902},"Renderizado Condicional","#E056FD",{"tag":681,"color":682},{"tag":312,"color":313},"b5lwqC2_R5GDZNjdpBMFknx2dcvVk_FQOPGFJOy4LmQ",{"id":907,"title":908,"cover":909,"coverAlt":908,"date":910,"description":911,"draft":11,"extension":12,"locale":13,"meta":912,"navigation":25,"path":916,"schemaOrg":917,"seo":921,"series":641,"seriesDescription":642,"seriesOrder":241,"seriesTitle":644,"slug":33,"stem":922,"tags":923,"__hash__":930},"blog\u002Fblog\u002Fvue-directives-overview.es.md","Directivas en Vue: Una Visión General","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1770161262\u002Fvue-directives-overview_qyrngz.png","2026-02-04","Explora las directivas esenciales de Vue.js, su sintaxis y casos de uso comunes.",{"updatedAt":748,"readingTime":118,"coverCaption":913,"author":16,"keywords":914},"Imagen destacada que representa las directivas en Vue.js.",[267,648,915,52],"Desarrollo Frontend","\u002Fblog\u002Fvue-directives-overview.es",[918],{"headline":908,"author":919,"datePublished":920,"@type":31},{"name":16,"@type":30},"2026-02-03T20:00:00-05:00",{"title":908,"description":911},"blog\u002Fvue-directives-overview.es",[924,925,926,927,928,929],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":901,"color":902},{"tag":871,"color":47},{"tag":46,"color":47},{"tag":312,"color":313},"JwLOQaBKN45DaJoFg7X918rNjFPTm8MZd7iOm0BuH68",{"id":932,"title":933,"cover":934,"coverAlt":933,"date":935,"description":936,"draft":11,"extension":12,"locale":13,"meta":937,"navigation":25,"path":943,"schemaOrg":944,"seo":948,"series":207,"seriesDescription":208,"seriesOrder":484,"seriesTitle":209,"slug":33,"stem":949,"tags":950,"__hash__":958},"blog\u002Fblog\u002Fmastering-renderless-components-vue-3.es.md","Patrones Avanzados en Vue 3: El Poder de los Renderless Components","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1769789805\u002Fmastering-renderless-components-vue-3_f5mqbs.png","2026-01-30","Explora cómo los Renderless Components en Vue 3 pueden mejorar la reutilización de código y la separación de lógica y presentación en tus aplicaciones.",{"updatedAt":194,"coverCaption":938,"author":16,"keywords":939},"Imagen destacada que representa el concepto de Renderless Components en Vue 3.",[199,940,941,942,915],"Renderless Components","Reutilización de Código","Patrones de Diseño","\u002Fblog\u002Fmastering-renderless-components-vue-3.es",[945],{"headline":933,"author":946,"datePublished":947,"@type":31},{"name":16,"@type":30},"2026-01-30T17:00:00-05:00",{"title":933,"description":936},"blog\u002Fmastering-renderless-components-vue-3.es",[951,952,954,955,956,957],{"tag":200,"color":214},{"tag":942,"color":953},"#9C27B0",{"tag":229,"color":245},{"tag":46,"color":47},{"tag":84,"color":85},{"tag":52,"color":53},"-earh1fov0s8QNrnVX2RteTSesXEwXENosxo9pj6k9w",{"id":960,"title":961,"cover":962,"coverAlt":961,"date":963,"description":964,"draft":11,"extension":12,"locale":13,"meta":965,"navigation":25,"path":971,"schemaOrg":972,"seo":976,"series":207,"seriesDescription":208,"seriesOrder":147,"seriesTitle":209,"slug":33,"stem":977,"tags":978,"__hash__":987},"blog\u002Fblog\u002Fvue-provide-inject-avoid-prop-drilling.es.md","Provide e Inject en Vue 3: Guía definitiva para eliminar el Prop Drilling","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1769126104\u002Fvue-provide-inject-avoid-prop-drilling_pkd9s1.png","2026-01-23","Aprende a usar provide e inject en Vue.js para eliminar el Prop Drilling, gestionar la reactividad de forma segura con readonly y mejorar la arquitectura de tus componentes.",{"updatedAt":194,"coverCaption":966,"author":16,"keywords":967},"Provide e Inject en Vue 3 por TODOvue",[267,968,969,970,170,271],"Provide","Inject","Prop Drilling","\u002Fblog\u002Fvue-provide-inject-avoid-prop-drilling.es",[973],{"headline":961,"author":974,"datePublished":975,"@type":31},{"name":16,"@type":30},"2026-01-22T23:30:00-05:00",{"title":961,"description":964},"blog\u002Fvue-provide-inject-avoid-prop-drilling.es",[979,982,983,984,985,986],{"tag":980,"color":981},"Inyección de Dependencias","#2E86DE",{"tag":49,"color":50},{"tag":200,"color":214},{"tag":942,"color":953},{"tag":229,"color":245},{"tag":52,"color":53},"CBAqb072PTyDEOYcOpi9rvDl3rIQYoWB3nPWEjCk12M",{"id":989,"title":990,"cover":991,"coverAlt":992,"date":993,"description":994,"draft":11,"extension":12,"locale":13,"meta":995,"navigation":25,"path":1001,"schemaOrg":1002,"seo":1006,"series":116,"seriesDescription":117,"seriesOrder":241,"seriesTitle":119,"slug":33,"stem":1007,"tags":1008,"__hash__":1014},"blog\u002Fblog\u002Fvue-reactivity-explained.es.md","¿Qué es la reactividad? La magia detrás de Vue.js explicada con claridad","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1767664201\u002Fmagical_vue_coding_laboratory_p1incq.jpg","Ilustración de un laboratorio de codificación mágica de Vue.js","2026-01-06","Explora el sistema de reactividad de Vue.js, desde analogías simples hasta su implementación técnica con Proxies, y aprende a optimizar tus aplicaciones.",{"updatedAt":264,"coverCaption":996,"author":16,"keywords":997},"Ilustración de un laboratorio de codificación mágica de Vue.js por TODOvue",[267,46,998,170,999,1000],"Proxies","ref","reactive","\u002Fblog\u002Fvue-reactivity-explained.es",[1003],{"headline":990,"author":1004,"datePublished":1005,"@type":31},{"name":16,"@type":30},"2026-01-05T22:00:00-05:00",{"title":990,"description":994},"blog\u002Fvue-reactivity-explained.es",[1009,1010,1011],{"tag":46,"color":47},{"tag":312,"color":313},{"tag":1012,"color":1013},"Historia","#F27E68","UT2z0_WltHsFRpzRs-XkCaBzok7q9HIAWFb_2lDXzwk",{"id":1016,"title":1017,"cover":1018,"coverAlt":1019,"date":1020,"description":1021,"draft":11,"extension":12,"locale":13,"meta":1022,"navigation":25,"path":1026,"schemaOrg":1027,"seo":1031,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1032,"tags":1033,"__hash__":1041},"blog\u002Fblog\u002Fvue-beta-vapor-mode-revealed.es.md","Vue 3.6 Beta: La Revolución de Vapor Mode y el Nuevo Motor de Reactividad","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1766870280\u002Fvue-beta-vapor-mode-revealed_snvcqg.png","Logo de Vue.js sobre un fondo de código fuente","2025-12-27","Explora las novedades de Vue 3.6 Beta, incluyendo Vapor Mode y la integración de alien-signals para una reactividad más eficiente.",{"updatedAt":1023,"coverCaption":1024,"author":16,"keywords":1025},"2026-02-11T00:00:00-05:00","Descubre las innovaciones de Vue 3.6 Beta: Vapor Mode y un motor de reactividad renovado","vue 3.6, vapor mode, alien-signals, reactividad, javascript, framework, frontend, beta","\u002Fblog\u002Fvue-beta-vapor-mode-revealed.es",[1028],{"headline":1017,"author":1029,"datePublished":1030,"@type":31},{"name":16,"@type":30},"2025-12-27T00:00:00-05",{"title":1017,"description":1021},"blog\u002Fvue-beta-vapor-mode-revealed.es",[1034,1037,1038,1039,1040],{"tag":1035,"color":1036},"Beta","#42B883",{"tag":81,"color":82},{"tag":46,"color":47},{"tag":90,"color":91},{"tag":84,"color":85},"OoT1wXBWbx7Nm_VxKBcOVEX_68taHaHv5lb5JWYp_3Q",{"id":1043,"title":1044,"cover":1045,"coverAlt":1046,"date":1047,"description":1048,"draft":11,"extension":12,"locale":13,"meta":1049,"navigation":25,"path":1051,"schemaOrg":1052,"seo":1056,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1057,"tags":1058,"__hash__":1064},"blog\u002Fblog\u002Fsetting-up-vue-with-vite.es.md","¿Cómo crear tu primer proyecto con Vue usando Vite?","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1766607505\u002Fsetting_up_vue_with_vite_crikmp.png","Logo de Vue.js con el logo de Vite de fondo","2025-12-24","Una guía paso a paso para configurar un entorno de desarrollo moderno con Vue.js y Vite.",{"updatedAt":1023,"coverCaption":1050},"Configura tu entorno de desarrollo con Vue y Vite en minutos","\u002Fblog\u002Fsetting-up-vue-with-vite.es",[1053],{"headline":1044,"author":1054,"datePublished":1055,"@type":31},{"name":16,"@type":30},"2025-12-24T00:00:00-05",{"title":1044,"description":1048},"blog\u002Fsetting-up-vue-with-vite.es",[1059,1062,1063],{"tag":1060,"color":1061},"Vite","#646CFF",{"tag":90,"color":91},{"tag":312,"color":313},"ID3RcMYIQmxPmT53eZ4R0DE5wAx-pz-SvPR2vkFFjRc",{"id":1066,"title":1067,"cover":1068,"coverAlt":1069,"date":1070,"description":1071,"draft":11,"extension":12,"locale":13,"meta":1072,"navigation":25,"path":1074,"schemaOrg":1075,"seo":1079,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1080,"tags":1081,"__hash__":1084},"blog\u002Fblog\u002Fhistory-evolution-philosophy-vue-progressive-framework.es.md","Historia y Evolución de Vue.js: El Framework Progresivo","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1766105778\u002Fhistoria_de_vue_wbwv72.png","Logo de Vue.js con fondo de código fuente","2025-12-19","Desde sus inicios como un proyecto paralelo en Google hasta convertirse en uno de los pilares del desarrollo web moderno, exploramos la evolución y filosofía de Vue.js.",{"updatedAt":1023,"coverCaption":1073},"Explorando la evolución de Vue.js desde sus inicios hasta la actualidad","\u002Fblog\u002Fhistory-evolution-philosophy-vue-progressive-framework.es",[1076],{"headline":1067,"author":1077,"datePublished":1078,"@type":31},{"name":16,"@type":30},"2025-12-19T00:00:00-05",{"title":1067,"description":1071},"blog\u002Fhistory-evolution-philosophy-vue-progressive-framework.es",[1082,1083],{"tag":1012,"color":1013},{"tag":90,"color":91},"rJyCA4jjvQiJ_sw3YqFOoiddKcMhFEHJpq4Aw3J5Uzg",{"id":1086,"title":1087,"cover":1088,"coverAlt":1019,"date":1089,"description":1090,"draft":11,"extension":12,"locale":13,"meta":1091,"navigation":25,"path":1094,"schemaOrg":1095,"seo":1099,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1100,"tags":1101,"__hash__":1105},"blog\u002Fblog\u002Fwhat-is-vue-js-and-why-you-should-use-it.es.md","¿Qué es Vue.js y por qué deberías usarlo?","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1766098457\u002FQue_es_Vue_y_por_que_deberias_usarlo_tmowoz.png","2025-12-18","Descubre Vue.js, un framework progresivo de JavaScript, y aprende por qué es una excelente opción para desarrollar aplicaciones web modernas y reactivas.",{"updatedAt":1023,"coverCaption":1092,"author":16,"keywords":1093},"Explorando Vue.js: El framework progresivo para la web moderna","vue.js, javascript, framework, frontend, spa, reactividad, composition api, vue 3","\u002Fblog\u002Fwhat-is-vue-js-and-why-you-should-use-it.es",[1096],{"headline":1087,"author":1097,"datePublished":1098,"@type":31},{"name":16,"@type":30},"2025-12-18T00:00:00-05",{"title":1087,"description":1090},"blog\u002Fwhat-is-vue-js-and-why-you-should-use-it.es",[1102,1103,1104],{"tag":90,"color":91},{"tag":312,"color":313},{"tag":1012,"color":1013},"3oUGsbaCuwOgI_KyRJd-09Ixe2vRBkwOj4YxwJT8Nks",{"id":1107,"title":1108,"cover":1109,"coverAlt":1110,"date":1111,"description":1112,"draft":11,"extension":12,"locale":13,"meta":1113,"navigation":25,"path":1115,"schemaOrg":1116,"seo":1120,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1121,"tags":1122,"__hash__":1128},"blog\u002Fblog\u002Fwelcome-to-todovue.es.md","TODOvue: Un espacio dedicado al ecosistema de Vue.js","https:\u002F\u002Fres.cloudinary.com\u002Fdenj4fg7f\u002Fimage\u002Fupload\u002Fv1766098456\u002FTODOvue_idegxt.png","Logo de TODOvue con código fuente de fondo","2025-12-17","Bienvenidos a TODOvue. Un blog técnico diseñado por y para desarrolladores, donde exploramos a fondo Vue 3, Nuxt y la arquitectura de componentes moderna.",{"updatedAt":1023,"coverCaption":1114},"Explorando el universo de Vue.js de principio a fin","\u002Fblog\u002Fwelcome-to-todovue.es",[1117],{"headline":1108,"author":1118,"datePublished":1119,"@type":31},{"name":16,"@type":30},"2025-12-17T00:00:00-05:00",{"title":1108,"description":1112},"blog\u002Fwelcome-to-todovue.es",[1123,1124,1127],{"tag":16,"color":1036},{"tag":1125,"color":1126},"Offtopic","#605AD1",{"tag":90,"color":91},"QCC1KEhGX4J18VW5hhPy_dY_G47DK7o6kElWExWVHwg",{"id":1130,"title":1131,"body":1132,"cover":7,"coverAlt":3494,"date":9,"description":3495,"draft":11,"extension":12,"lab":3496,"locale":3505,"meta":3506,"navigation":25,"path":3513,"schemaOrg":3514,"seo":3517,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":3518,"tags":3519,"__hash__":3529},"blog\u002Fblog\u002Fusefetch-vs-useasyncdata-vs-fetch-nuxt-4.en.md","useFetch vs useAsyncData vs $fetch in Nuxt 4",{"type":1133,"value":1134,"toc":3484},"minimark",[1135,1139,1143,1159,1164,1241,1258,1262,1271,1276,1289,1307,1313,1318,1323,1332,1543,1551,1573,1577,1582,1585,1965,1986,1993,1997,2005,2398,2404,2434,2441,2446,2450,2455,2808,2818,2824,2839,2843,2854,2864,2878,3089,3095,3099,3102,3108,3114,3126,3138,3141,3431,3457,3461,3473,3480],[1136,1137,1131],"h1",{"id":1138},"usefetch-vs-useasyncdata-vs-fetch-in-nuxt-4",[1140,1141,1142],"p",{},"Choosing a data API in Nuxt 4 is not only a question of how to make an HTTP request. The same page can run on the server, reach the browser, hydrate, and load again during client navigation. If you do not distinguish those moments, a correct call can run again during hydration or become disconnected from the state your application actually needs.",[1140,1144,1145,1146,1150,1151,1154,1155,1158],{},"The practical rule is this: start with ",[1147,1148,1149],"code",{},"useFetch"," for URL-based reads that belong to a view; choose ",[1147,1152,1153],{},"useAsyncData"," when asynchronous work needs composition or additional control; reserve ",[1147,1156,1157],{},"$fetch"," for event-driven commands or use it inside a data handler. Then decide explicitly what identifies the data, whether navigation should wait, and who owns the state.",[1160,1161,1163],"h2",{"id":1162},"the-quick-decision-what-each-api-is-responsible-for","The Quick Decision: What Each API Is Responsible For",[1165,1166,1167,1189],"table",{},[1168,1169,1170],"thead",{},[1171,1172,1173,1177,1180,1183,1186],"tr",{},[1174,1175,1176],"th",{},"API",[1174,1178,1179],{},"Main responsibility",[1174,1181,1182],{},"SSR and payload",[1174,1184,1185],{},"Reactivity",[1174,1187,1188],{},"Typical use case",[1190,1191,1192,1209,1225],"tbody",{},[1171,1193,1194,1197,1200,1203,1206],{},[1195,1196,1149],"td",{},[1195,1198,1199],{},"Fetch a URL with compact configuration",[1195,1201,1202],{},"SSR-friendly and transfers the result through the payload",[1195,1204,1205],{},"Reactive URLs and some options can trigger new loads",[1195,1207,1208],{},"Initial page read or dynamic route",[1171,1210,1211,1213,1216,1219,1222],{},[1195,1212,1153],{},[1195,1214,1215],{},"Coordinate a custom asynchronous handler",[1195,1217,1218],{},"SSR-friendly and preserves the result for hydration",[1195,1220,1221],{},"The key and dependencies can control updates",[1195,1223,1224],{},"Multiple requests, SDKs, alternative clients, or transformations",[1171,1226,1227,1229,1232,1235,1238],{},[1195,1228,1157],{},[1195,1230,1231],{},"Execute an HTTP request",[1195,1233,1234],{},"Does not transfer the SSR result to the client by itself",[1195,1236,1237],{},"Does not automatically create data, error, and status refs",[1195,1239,1240],{},"Submit, click, mutation, or handler implementation",[1140,1242,1243,1245,1246,1248,1249,1251,1252,1254,1255,1257],{},[1147,1244,1149],{}," combines ",[1147,1247,1153],{}," and ",[1147,1250,1157],{},". That is why it is usually the first choice when the question is “which URL does this view need?”. ",[1147,1253,1153],{}," better expresses the question “what asynchronous work should this data unit resolve?”. ",[1147,1256,1157],{}," performs the request, but it does not decide how to preserve its result between the server and hydration.",[1160,1259,1261],{"id":1260},"what-happens-during-ssr-payload-transfer-and-hydration","What Happens During SSR, Payload Transfer, and Hydration",[1140,1263,1264,1265,1267,1268,1270],{},"For an initial read with ",[1147,1266,1149],{}," or ",[1147,1269,1153],{},", the conceptual flow is:",[1140,1272,1273],{},[1147,1274,1275],{},"server → nuxtApp.payload.data → hydrated client",[1140,1277,1278,1279,1282,1283,1285,1286,1288],{},"Nuxt can wait for the result during SSR before serializing the page, even if you do not write ",[1147,1280,1281],{},"await"," before the composable. ",[1147,1284,1281],{}," does control when the current ",[1147,1287,559],{}," continues and, during client navigation, whether navigation waits for the data to arrive.",[1140,1290,1291,1292,1295,1296,1298,1299,1302,1303,1306],{},"The result is stored in ",[1147,1293,1294],{},"nuxtApp.payload.data",". During hydration, Nuxt can reuse that value instead of repeating the initial request. The ",[1147,1297,1153],{}," payload uses ",[1147,1300,1301],{},"devalue",", while server-route responses have the limitations of ",[1147,1304,1305],{},"JSON.stringify","; these are different serialization mechanisms.",[1140,1308,1309,1310,1312],{},"With direct ",[1147,1311,1157],{},", the flow can be different:",[1140,1314,1315],{},[1147,1316,1317],{},"SSR: $fetch → HTML",[1140,1319,1320],{},[1147,1321,1322],{},"hydration: $fetch again → client",[1140,1324,1325,1326,1328,1329,1331],{},"An internal route can be resolved directly during SSR without an additional HTTP round trip. That improves this particular step, but it does not turn ",[1147,1327,1157],{}," into a payload mechanism. If you use ",[1147,1330,1157],{}," at the top level of a universal component for initial data, the load can run again during hydration.",[1333,1334,1341],"pre",{"className":1335,"code":1336,"filename":1337,"highlights":1338,"language":1339,"meta":1340,"style":1340},"language-vue shiki shiki-themes github-light github-dark","\u003Cscript setup lang='ts'>\ninterface Product {\n  id: string\n  name: string\n}\n\nconst products = await $fetch\u003CProduct[]>('\u002Fapi\u002Fproducts')\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cul>\n    \u003Cli v-for='product in products' :key='product.id'>\n      {{ product.name }}\n    \u003C\u002Fli>\n  \u003C\u002Ful>\n\u003C\u002Ftemplate>\n","ProductPage.vue",[426],"vue","",[1147,1342,1343,1372,1384,1397,1406,1411,1416,1449,1458,1462,1471,1481,1508,1514,1524,1534],{"__ignoreMap":1340},[1344,1345,1347,1351,1355,1359,1362,1365,1369],"span",{"class":1346,"line":241},"line",[1344,1348,1350],{"class":1349},"sVt8B","\u003C",[1344,1352,1354],{"class":1353},"s9eBZ","script",[1344,1356,1358],{"class":1357},"sScJk"," setup",[1344,1360,1361],{"class":1357}," lang",[1344,1363,1364],{"class":1349},"=",[1344,1366,1368],{"class":1367},"sZZnC","'ts'",[1344,1370,1371],{"class":1349},">\n",[1344,1373,1374,1378,1381],{"class":1346,"line":176},[1344,1375,1377],{"class":1376},"szBVR","interface",[1344,1379,1380],{"class":1357}," Product",[1344,1382,1383],{"class":1349}," {\n",[1344,1385,1386,1390,1393],{"class":1346,"line":278},[1344,1387,1389],{"class":1388},"s4XuR","  id",[1344,1391,1392],{"class":1376},":",[1344,1394,1396],{"class":1395},"sj4cs"," string\n",[1344,1398,1399,1402,1404],{"class":1346,"line":147},[1344,1400,1401],{"class":1388},"  name",[1344,1403,1392],{"class":1376},[1344,1405,1396],{"class":1395},[1344,1407,1408],{"class":1346,"line":484},[1344,1409,1410],{"class":1349},"}\n",[1344,1412,1413],{"class":1346,"line":118},[1344,1414,1415],{"emptyLinePlaceholder":25},"\n",[1344,1417,1420,1423,1426,1429,1432,1435,1437,1440,1443,1446],{"class":1418,"line":426},[1346,1419],"highlight",[1344,1421,1422],{"class":1376},"const",[1344,1424,1425],{"class":1395}," products",[1344,1427,1428],{"class":1376}," =",[1344,1430,1431],{"class":1376}," await",[1344,1433,1434],{"class":1357}," $fetch",[1344,1436,1350],{"class":1349},[1344,1438,1439],{"class":1357},"Product",[1344,1441,1442],{"class":1349},"[]>(",[1344,1444,1445],{"class":1367},"'\u002Fapi\u002Fproducts'",[1344,1447,1448],{"class":1349},")\n",[1344,1450,1451,1454,1456],{"class":1346,"line":349},[1344,1452,1453],{"class":1349},"\u003C\u002F",[1344,1455,1354],{"class":1353},[1344,1457,1371],{"class":1349},[1344,1459,1460],{"class":1346,"line":362},[1344,1461,1415],{"emptyLinePlaceholder":25},[1344,1463,1464,1466,1469],{"class":1346,"line":676},[1344,1465,1350],{"class":1349},[1344,1467,1468],{"class":1353},"template",[1344,1470,1371],{"class":1349},[1344,1472,1473,1476,1479],{"class":1346,"line":643},[1344,1474,1475],{"class":1349},"  \u003C",[1344,1477,1478],{"class":1353},"ul",[1344,1480,1371],{"class":1349},[1344,1482,1484,1487,1490,1493,1495,1498,1501,1503,1506],{"class":1346,"line":1483},12,[1344,1485,1486],{"class":1349},"    \u003C",[1344,1488,1489],{"class":1353},"li",[1344,1491,1492],{"class":1357}," v-for",[1344,1494,1364],{"class":1349},[1344,1496,1497],{"class":1367},"'product in products'",[1344,1499,1500],{"class":1357}," :key",[1344,1502,1364],{"class":1349},[1344,1504,1505],{"class":1367},"'product.id'",[1344,1507,1371],{"class":1349},[1344,1509,1511],{"class":1346,"line":1510},13,[1344,1512,1513],{"class":1349},"      {{ product.name }}\n",[1344,1515,1517,1520,1522],{"class":1346,"line":1516},14,[1344,1518,1519],{"class":1349},"    \u003C\u002F",[1344,1521,1489],{"class":1353},[1344,1523,1371],{"class":1349},[1344,1525,1527,1530,1532],{"class":1346,"line":1526},15,[1344,1528,1529],{"class":1349},"  \u003C\u002F",[1344,1531,1478],{"class":1353},[1344,1533,1371],{"class":1349},[1344,1535,1537,1539,1541],{"class":1346,"line":1536},16,[1344,1538,1453],{"class":1349},[1344,1540,1468],{"class":1353},[1344,1542,1371],{"class":1349},[1140,1544,1545,1546,1267,1548,1550],{},"This example is valid as an HTTP call, but it does not automatically preserve the SSR result in Nuxt’s payload. For an initial read, ",[1147,1547,1149],{},[1147,1549,1153],{}," communicates the intent more accurately.",[1140,1552,1553,1554,1557,1558,1561,1562,1248,1565,1568,1569,1572],{},"The payload is also not automatically a permanent cache across navigations. ",[1147,1555,1556],{},"useNuxtData"," provides reactive access to a cached value when an explicit key exists. ",[1147,1559,1560],{},"getCachedData"," participates in the decision to obtain cached data. By contrast, ",[1147,1563,1564],{},"transform",[1147,1566,1567],{},"pick"," shape or reduce the exposed result and the data added to the payload; they do not prevent the complete response from being fetched initially from the API. Later invalidation or reloading is a separate decision, such as ",[1147,1570,1571],{},"refresh()"," or an explicit key-based policy.",[1160,1574,1576],{"id":1575},"usefetch-the-natural-choice-for-url-based-reads","useFetch: The Natural Choice for URL-Based Reads",[1140,1578,1579,1581],{},[1147,1580,1149],{}," is appropriate when the data unit can primarily be described by a URL and its options. Besides combining the two underlying primitives, it generates a key and can provide type inference when the URL corresponds to a route handled by the application server.",[1140,1583,1584],{},"For dynamic routes, the real identity of the data must appear in the URL or in an explicit key. Route parameters, locale, and filters should not be hidden behind a static key.",[1333,1586,1592],{"className":1335,"code":1587,"filename":1588,"highlights":1589,"language":1339,"meta":1340,"style":1340},"\u003Cscript setup lang='ts'>\nimport { computed, ref } from 'vue'\n\ninterface CatalogItem {\n  id: string\n  name: string\n}\n\nconst route = useRoute()\nconst locale = ref('en')\nconst requestUrl = computed(() => {\n  const category = encodeURIComponent(String(route.params.category))\n  return `\u002Fapi\u002Fcatalog\u002F${category}`\n})\n\nconst { data: items, status, error } = await useFetch\u003CCatalogItem[]>(requestUrl, {\n  query: computed(() => ({ locale: locale.value }))\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cp v-if='status === \"pending\"'>Loading catalog...\u003C\u002Fp>\n  \u003Cp v-else-if='error'>Could not load the catalog.\u003C\u002Fp>\n  \u003Cul v-else>\n    \u003Cli v-for='item in items ?? []' :key='item.id'>\n      {{ item.name }}\n    \u003C\u002Fli>\n  \u003C\u002Ful>\n\u003C\u002Ftemplate>\n","CatalogPage.vue",[643,1483,1510,1516,1536,1590,1591],17,18,[1147,1593,1594,1610,1624,1628,1637,1645,1653,1657,1661,1676,1696,1717,1739,1754,1760,1764,1810,1825,1830,1839,1844,1853,1875,1897,1909,1932,1938,1947,1956],{"__ignoreMap":1340},[1344,1595,1596,1598,1600,1602,1604,1606,1608],{"class":1346,"line":241},[1344,1597,1350],{"class":1349},[1344,1599,1354],{"class":1353},[1344,1601,1358],{"class":1357},[1344,1603,1361],{"class":1357},[1344,1605,1364],{"class":1349},[1344,1607,1368],{"class":1367},[1344,1609,1371],{"class":1349},[1344,1611,1612,1615,1618,1621],{"class":1346,"line":176},[1344,1613,1614],{"class":1376},"import",[1344,1616,1617],{"class":1349}," { computed, ref } ",[1344,1619,1620],{"class":1376},"from",[1344,1622,1623],{"class":1367}," 'vue'\n",[1344,1625,1626],{"class":1346,"line":278},[1344,1627,1415],{"emptyLinePlaceholder":25},[1344,1629,1630,1632,1635],{"class":1346,"line":147},[1344,1631,1377],{"class":1376},[1344,1633,1634],{"class":1357}," CatalogItem",[1344,1636,1383],{"class":1349},[1344,1638,1639,1641,1643],{"class":1346,"line":484},[1344,1640,1389],{"class":1388},[1344,1642,1392],{"class":1376},[1344,1644,1396],{"class":1395},[1344,1646,1647,1649,1651],{"class":1346,"line":118},[1344,1648,1401],{"class":1388},[1344,1650,1392],{"class":1376},[1344,1652,1396],{"class":1395},[1344,1654,1655],{"class":1346,"line":426},[1344,1656,1410],{"class":1349},[1344,1658,1659],{"class":1346,"line":349},[1344,1660,1415],{"emptyLinePlaceholder":25},[1344,1662,1663,1665,1668,1670,1673],{"class":1346,"line":362},[1344,1664,1422],{"class":1376},[1344,1666,1667],{"class":1395}," route",[1344,1669,1428],{"class":1376},[1344,1671,1672],{"class":1357}," useRoute",[1344,1674,1675],{"class":1349},"()\n",[1344,1677,1678,1680,1683,1685,1688,1691,1694],{"class":1346,"line":676},[1344,1679,1422],{"class":1376},[1344,1681,1682],{"class":1395}," locale",[1344,1684,1428],{"class":1376},[1344,1686,1687],{"class":1357}," ref",[1344,1689,1690],{"class":1349},"(",[1344,1692,1693],{"class":1367},"'en'",[1344,1695,1448],{"class":1349},[1344,1697,1699,1701,1704,1706,1709,1712,1715],{"class":1698,"line":643},[1346,1419],[1344,1700,1422],{"class":1376},[1344,1702,1703],{"class":1395}," requestUrl",[1344,1705,1428],{"class":1376},[1344,1707,1708],{"class":1357}," computed",[1344,1710,1711],{"class":1349},"(() ",[1344,1713,1714],{"class":1376},"=>",[1344,1716,1383],{"class":1349},[1344,1718,1720,1723,1726,1728,1731,1733,1736],{"class":1719,"line":1483},[1346,1419],[1344,1721,1722],{"class":1376},"  const",[1344,1724,1725],{"class":1395}," category",[1344,1727,1428],{"class":1376},[1344,1729,1730],{"class":1357}," encodeURIComponent",[1344,1732,1690],{"class":1349},[1344,1734,1735],{"class":1357},"String",[1344,1737,1738],{"class":1349},"(route.params.category))\n",[1344,1740,1742,1745,1748,1751],{"class":1741,"line":1510},[1346,1419],[1344,1743,1744],{"class":1376},"  return",[1344,1746,1747],{"class":1367}," `\u002Fapi\u002Fcatalog\u002F${",[1344,1749,1750],{"class":1349},"category",[1344,1752,1753],{"class":1367},"}`\n",[1344,1755,1757],{"class":1756,"line":1516},[1346,1419],[1344,1758,1759],{"class":1349},"})\n",[1344,1761,1762],{"class":1346,"line":1526},[1344,1763,1415],{"emptyLinePlaceholder":25},[1344,1765,1767,1769,1772,1775,1778,1781,1784,1787,1789,1792,1795,1797,1799,1802,1804,1807],{"class":1766,"line":1536},[1346,1419],[1344,1768,1422],{"class":1376},[1344,1770,1771],{"class":1349}," { ",[1344,1773,1774],{"class":1388},"data",[1344,1776,1777],{"class":1349},": ",[1344,1779,1780],{"class":1395},"items",[1344,1782,1783],{"class":1349},", ",[1344,1785,1786],{"class":1395},"status",[1344,1788,1783],{"class":1349},[1344,1790,1791],{"class":1395},"error",[1344,1793,1794],{"class":1349}," } ",[1344,1796,1364],{"class":1376},[1344,1798,1431],{"class":1376},[1344,1800,1801],{"class":1357}," useFetch",[1344,1803,1350],{"class":1349},[1344,1805,1806],{"class":1357},"CatalogItem",[1344,1808,1809],{"class":1349},"[]>(requestUrl, {\n",[1344,1811,1813,1816,1818,1820,1822],{"class":1812,"line":1590},[1346,1419],[1344,1814,1815],{"class":1349},"  query: ",[1344,1817,268],{"class":1357},[1344,1819,1711],{"class":1349},[1344,1821,1714],{"class":1376},[1344,1823,1824],{"class":1349}," ({ locale: locale.value }))\n",[1344,1826,1828],{"class":1827,"line":1591},[1346,1419],[1344,1829,1759],{"class":1349},[1344,1831,1833,1835,1837],{"class":1346,"line":1832},19,[1344,1834,1453],{"class":1349},[1344,1836,1354],{"class":1353},[1344,1838,1371],{"class":1349},[1344,1840,1842],{"class":1346,"line":1841},20,[1344,1843,1415],{"emptyLinePlaceholder":25},[1344,1845,1847,1849,1851],{"class":1346,"line":1846},21,[1344,1848,1350],{"class":1349},[1344,1850,1468],{"class":1353},[1344,1852,1371],{"class":1349},[1344,1854,1856,1858,1860,1863,1865,1868,1871,1873],{"class":1346,"line":1855},22,[1344,1857,1475],{"class":1349},[1344,1859,1140],{"class":1353},[1344,1861,1862],{"class":1357}," v-if",[1344,1864,1364],{"class":1349},[1344,1866,1867],{"class":1367},"'status === \"pending\"'",[1344,1869,1870],{"class":1349},">Loading catalog...\u003C\u002F",[1344,1872,1140],{"class":1353},[1344,1874,1371],{"class":1349},[1344,1876,1878,1880,1882,1885,1887,1890,1893,1895],{"class":1346,"line":1877},23,[1344,1879,1475],{"class":1349},[1344,1881,1140],{"class":1353},[1344,1883,1884],{"class":1357}," v-else-if",[1344,1886,1364],{"class":1349},[1344,1888,1889],{"class":1367},"'error'",[1344,1891,1892],{"class":1349},">Could not load the catalog.\u003C\u002F",[1344,1894,1140],{"class":1353},[1344,1896,1371],{"class":1349},[1344,1898,1900,1902,1904,1907],{"class":1346,"line":1899},24,[1344,1901,1475],{"class":1349},[1344,1903,1478],{"class":1353},[1344,1905,1906],{"class":1357}," v-else",[1344,1908,1371],{"class":1349},[1344,1910,1912,1914,1916,1918,1920,1923,1925,1927,1930],{"class":1346,"line":1911},25,[1344,1913,1486],{"class":1349},[1344,1915,1489],{"class":1353},[1344,1917,1492],{"class":1357},[1344,1919,1364],{"class":1349},[1344,1921,1922],{"class":1367},"'item in items ?? []'",[1344,1924,1500],{"class":1357},[1344,1926,1364],{"class":1349},[1344,1928,1929],{"class":1367},"'item.id'",[1344,1931,1371],{"class":1349},[1344,1933,1935],{"class":1346,"line":1934},26,[1344,1936,1937],{"class":1349},"      {{ item.name }}\n",[1344,1939,1941,1943,1945],{"class":1346,"line":1940},27,[1344,1942,1519],{"class":1349},[1344,1944,1489],{"class":1353},[1344,1946,1371],{"class":1349},[1344,1948,1950,1952,1954],{"class":1346,"line":1949},28,[1344,1951,1529],{"class":1349},[1344,1953,1478],{"class":1353},[1344,1955,1371],{"class":1349},[1344,1957,1959,1961,1963],{"class":1346,"line":1958},29,[1344,1960,1453],{"class":1349},[1344,1962,1468],{"class":1353},[1344,1964,1371],{"class":1349},[1140,1966,1967,1968,1971,1972,1974,1975,1977,1978,1981,1982,1985],{},"The URL and the ",[1147,1969,1970],{},"query"," option are reactive. When the category or locale changes, ",[1147,1973,1149],{}," can request the data again. Do not add a ",[1147,1976,269],{}," and a manual ",[1147,1979,1980],{},"refresh"," to repeat the same mechanism. Use ",[1147,1983,1984],{},"watch: false"," only when you explicitly want to disable automatic observation.",[1140,1987,1988,1989,1992],{},"During SSR, a relative URL can use the request context through ",[1147,1990,1991],{},"useRequestFetch",". This can forward cookies and allowed headers, but it does not mean that every received header should be forwarded. Sensitive or inappropriate headers must remain outside that flow.",[1160,1994,1996],{"id":1995},"useasyncdata-when-the-task-is-more-than-a-url","useAsyncData: When the Task Is More Than a URL",[1140,1998,1999,2001,2002,2004],{},[1147,2000,1153],{}," provides a handler for expressing custom asynchronous work. It is the right choice when you need to combine multiple requests, consume an SDK, use a client other than ",[1147,2003,1157],{},", or transform the result before exposing it to the view.",[1333,2006,2010],{"className":1335,"code":2007,"filename":2008,"highlights":2009,"language":1339,"meta":1340,"style":1340},"\u003Cscript setup lang='ts'>\ninterface Profile {\n  id: string\n  name: string\n}\n\ninterface Notification {\n  id: string\n  message: string\n}\n\nconst { data: dashboard, status, error } = await useAsyncData('dashboard', async () => {\n  const [profile, notifications] = await Promise.all([\n    $fetch\u003CProfile>('\u002Fapi\u002Fprofile'),\n    $fetch\u003CNotification[]>('\u002Fapi\u002Fnotifications')\n  ])\n\n  return { profile, notifications }\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cp v-if='status === \"pending\"'>Loading dashboard...\u003C\u002Fp>\n  \u003Cp v-else-if='error'>Could not load the dashboard.\u003C\u002Fp>\n  \u003Csection v-else-if='dashboard'>\n    \u003Ch2>{{ dashboard.profile.name }}\u003C\u002Fh2>\n    \u003Cul>\n      \u003Cli v-for='notification in dashboard.notifications' :key='notification.id'>\n        {{ notification.message }}\n      \u003C\u002Fli>\n    \u003C\u002Ful>\n  \u003C\u002Fsection>\n\u003C\u002Ftemplate>\n","DashboardPage.vue",[1483,1510,1516,1526,1536,1590,1591,1832],[1147,2011,2012,2028,2037,2045,2053,2057,2061,2070,2078,2087,2091,2095,2143,2178,2198,2215,2221,2226,2234,2239,2247,2251,2259,2278,2297,2312,2325,2333,2356,2361,2371,2380,2389],{"__ignoreMap":1340},[1344,2013,2014,2016,2018,2020,2022,2024,2026],{"class":1346,"line":241},[1344,2015,1350],{"class":1349},[1344,2017,1354],{"class":1353},[1344,2019,1358],{"class":1357},[1344,2021,1361],{"class":1357},[1344,2023,1364],{"class":1349},[1344,2025,1368],{"class":1367},[1344,2027,1371],{"class":1349},[1344,2029,2030,2032,2035],{"class":1346,"line":176},[1344,2031,1377],{"class":1376},[1344,2033,2034],{"class":1357}," Profile",[1344,2036,1383],{"class":1349},[1344,2038,2039,2041,2043],{"class":1346,"line":278},[1344,2040,1389],{"class":1388},[1344,2042,1392],{"class":1376},[1344,2044,1396],{"class":1395},[1344,2046,2047,2049,2051],{"class":1346,"line":147},[1344,2048,1401],{"class":1388},[1344,2050,1392],{"class":1376},[1344,2052,1396],{"class":1395},[1344,2054,2055],{"class":1346,"line":484},[1344,2056,1410],{"class":1349},[1344,2058,2059],{"class":1346,"line":118},[1344,2060,1415],{"emptyLinePlaceholder":25},[1344,2062,2063,2065,2068],{"class":1346,"line":426},[1344,2064,1377],{"class":1376},[1344,2066,2067],{"class":1357}," Notification",[1344,2069,1383],{"class":1349},[1344,2071,2072,2074,2076],{"class":1346,"line":349},[1344,2073,1389],{"class":1388},[1344,2075,1392],{"class":1376},[1344,2077,1396],{"class":1395},[1344,2079,2080,2083,2085],{"class":1346,"line":362},[1344,2081,2082],{"class":1388},"  message",[1344,2084,1392],{"class":1376},[1344,2086,1396],{"class":1395},[1344,2088,2089],{"class":1346,"line":676},[1344,2090,1410],{"class":1349},[1344,2092,2093],{"class":1346,"line":643},[1344,2094,1415],{"emptyLinePlaceholder":25},[1344,2096,2098,2100,2102,2104,2106,2109,2111,2113,2115,2117,2119,2121,2123,2126,2128,2131,2133,2136,2139,2141],{"class":2097,"line":1483},[1346,1419],[1344,2099,1422],{"class":1376},[1344,2101,1771],{"class":1349},[1344,2103,1774],{"class":1388},[1344,2105,1777],{"class":1349},[1344,2107,2108],{"class":1395},"dashboard",[1344,2110,1783],{"class":1349},[1344,2112,1786],{"class":1395},[1344,2114,1783],{"class":1349},[1344,2116,1791],{"class":1395},[1344,2118,1794],{"class":1349},[1344,2120,1364],{"class":1376},[1344,2122,1431],{"class":1376},[1344,2124,2125],{"class":1357}," useAsyncData",[1344,2127,1690],{"class":1349},[1344,2129,2130],{"class":1367},"'dashboard'",[1344,2132,1783],{"class":1349},[1344,2134,2135],{"class":1376},"async",[1344,2137,2138],{"class":1349}," () ",[1344,2140,1714],{"class":1376},[1344,2142,1383],{"class":1349},[1344,2144,2146,2148,2151,2154,2156,2159,2162,2164,2166,2169,2172,2175],{"class":2145,"line":1510},[1346,1419],[1344,2147,1722],{"class":1376},[1344,2149,2150],{"class":1349}," [",[1344,2152,2153],{"class":1395},"profile",[1344,2155,1783],{"class":1349},[1344,2157,2158],{"class":1395},"notifications",[1344,2160,2161],{"class":1349},"] ",[1344,2163,1364],{"class":1376},[1344,2165,1431],{"class":1376},[1344,2167,2168],{"class":1395}," Promise",[1344,2170,2171],{"class":1349},".",[1344,2173,2174],{"class":1357},"all",[1344,2176,2177],{"class":1349},"([\n",[1344,2179,2181,2184,2186,2189,2192,2195],{"class":2180,"line":1516},[1346,1419],[1344,2182,2183],{"class":1357},"    $fetch",[1344,2185,1350],{"class":1349},[1344,2187,2188],{"class":1357},"Profile",[1344,2190,2191],{"class":1349},">(",[1344,2193,2194],{"class":1367},"'\u002Fapi\u002Fprofile'",[1344,2196,2197],{"class":1349},"),\n",[1344,2199,2201,2203,2205,2208,2210,2213],{"class":2200,"line":1526},[1346,1419],[1344,2202,2183],{"class":1357},[1344,2204,1350],{"class":1349},[1344,2206,2207],{"class":1357},"Notification",[1344,2209,1442],{"class":1349},[1344,2211,2212],{"class":1367},"'\u002Fapi\u002Fnotifications'",[1344,2214,1448],{"class":1349},[1344,2216,2218],{"class":2217,"line":1536},[1346,1419],[1344,2219,2220],{"class":1349},"  ])\n",[1344,2222,2224],{"class":2223,"line":1590},[1346,1419],[1344,2225,1415],{"emptyLinePlaceholder":25},[1344,2227,2229,2231],{"class":2228,"line":1591},[1346,1419],[1344,2230,1744],{"class":1376},[1344,2232,2233],{"class":1349}," { profile, notifications }\n",[1344,2235,2237],{"class":2236,"line":1832},[1346,1419],[1344,2238,1759],{"class":1349},[1344,2240,2241,2243,2245],{"class":1346,"line":1841},[1344,2242,1453],{"class":1349},[1344,2244,1354],{"class":1353},[1344,2246,1371],{"class":1349},[1344,2248,2249],{"class":1346,"line":1846},[1344,2250,1415],{"emptyLinePlaceholder":25},[1344,2252,2253,2255,2257],{"class":1346,"line":1855},[1344,2254,1350],{"class":1349},[1344,2256,1468],{"class":1353},[1344,2258,1371],{"class":1349},[1344,2260,2261,2263,2265,2267,2269,2271,2274,2276],{"class":1346,"line":1877},[1344,2262,1475],{"class":1349},[1344,2264,1140],{"class":1353},[1344,2266,1862],{"class":1357},[1344,2268,1364],{"class":1349},[1344,2270,1867],{"class":1367},[1344,2272,2273],{"class":1349},">Loading dashboard...\u003C\u002F",[1344,2275,1140],{"class":1353},[1344,2277,1371],{"class":1349},[1344,2279,2280,2282,2284,2286,2288,2290,2293,2295],{"class":1346,"line":1899},[1344,2281,1475],{"class":1349},[1344,2283,1140],{"class":1353},[1344,2285,1884],{"class":1357},[1344,2287,1364],{"class":1349},[1344,2289,1889],{"class":1367},[1344,2291,2292],{"class":1349},">Could not load the dashboard.\u003C\u002F",[1344,2294,1140],{"class":1353},[1344,2296,1371],{"class":1349},[1344,2298,2299,2301,2304,2306,2308,2310],{"class":1346,"line":1911},[1344,2300,1475],{"class":1349},[1344,2302,2303],{"class":1353},"section",[1344,2305,1884],{"class":1357},[1344,2307,1364],{"class":1349},[1344,2309,2130],{"class":1367},[1344,2311,1371],{"class":1349},[1344,2313,2314,2316,2318,2321,2323],{"class":1346,"line":1934},[1344,2315,1486],{"class":1349},[1344,2317,1160],{"class":1353},[1344,2319,2320],{"class":1349},">{{ dashboard.profile.name }}\u003C\u002F",[1344,2322,1160],{"class":1353},[1344,2324,1371],{"class":1349},[1344,2326,2327,2329,2331],{"class":1346,"line":1940},[1344,2328,1486],{"class":1349},[1344,2330,1478],{"class":1353},[1344,2332,1371],{"class":1349},[1344,2334,2335,2338,2340,2342,2344,2347,2349,2351,2354],{"class":1346,"line":1949},[1344,2336,2337],{"class":1349},"      \u003C",[1344,2339,1489],{"class":1353},[1344,2341,1492],{"class":1357},[1344,2343,1364],{"class":1349},[1344,2345,2346],{"class":1367},"'notification in dashboard.notifications'",[1344,2348,1500],{"class":1357},[1344,2350,1364],{"class":1349},[1344,2352,2353],{"class":1367},"'notification.id'",[1344,2355,1371],{"class":1349},[1344,2357,2358],{"class":1346,"line":1958},[1344,2359,2360],{"class":1349},"        {{ notification.message }}\n",[1344,2362,2364,2367,2369],{"class":1346,"line":2363},30,[1344,2365,2366],{"class":1349},"      \u003C\u002F",[1344,2368,1489],{"class":1353},[1344,2370,1371],{"class":1349},[1344,2372,2374,2376,2378],{"class":1346,"line":2373},31,[1344,2375,1519],{"class":1349},[1344,2377,1478],{"class":1353},[1344,2379,1371],{"class":1349},[1344,2381,2383,2385,2387],{"class":1346,"line":2382},32,[1344,2384,1529],{"class":1349},[1344,2386,2303],{"class":1353},[1344,2388,1371],{"class":1349},[1344,2390,2392,2394,2396],{"class":1346,"line":2391},33,[1344,2393,1453],{"class":1349},[1344,2395,1468],{"class":1353},[1344,2397,1371],{"class":1349},[1140,2399,2400,2401,2403],{},"This example assumes public endpoints. If the data depends on cookies, authentication, or headers from the incoming request, explicitly establish a suitable client or apply the request-aware ",[1147,2402,1991],{}," flow for relative URLs during SSR. Do not attribute automatic propagation to `$fetch when the example does not demonstrate it.",[1140,2405,2406,2407,2409,2410,1783,2412,2414,2415,2417,2418,1783,2421,1783,2424,1783,2426,1783,2428,2414,2430,2433],{},"The ",[1147,2408,2108],{}," key identifies this data unit. If several calls share a key, they share the ",[1147,2411,1774],{},[1147,2413,1791],{},", and ",[1147,2416,1786],{}," refs; therefore structural options—such as ",[1147,2419,2420],{},"handler",[1147,2422,2423],{},"deep",[1147,2425,1564],{},[1147,2427,1567],{},[1147,2429,1560],{},[1147,2431,2432],{},"default","—must remain consistent across those calls.",[1140,2435,2436,2437,2440],{},"The handler should be predictable, return a valid value, and avoid side effects. It is not the place to run Pinia actions, show notifications, or modify other domain state. Those actions belong in a separate flow, such as ",[1147,2438,2439],{},"callOnce"," when you need to await a store action without unnecessarily repeating its load.",[1140,2442,2443,2445],{},[1147,2444,1153],{}," also provides concurrency-related mechanisms, such as an abortable signal and deduplication options. They help coordinate simultaneous loads, but they do not replace an invalidation policy after a mutation.",[1160,2447,2449],{"id":2448},"fetch-commands-interactions-and-handler-construction","$fetch: Commands, Interactions, and Handler Construction",[1140,2451,2452,2454],{},[1147,2453,1157],{}," fits naturally in an action initiated by the user: submit a form, archive a record, or run a command after a button click. At that point, you are changing something and must then decide how to update the read model.",[1333,2456,2460],{"className":1335,"code":2457,"filename":2458,"highlights":2459,"language":1339,"meta":1340,"style":1340},"\u003Cscript setup lang='ts'>\nimport { ref } from 'vue'\n\nconst props = defineProps\u003C{\n  productId: string\n}>()\n\nconst saving = ref(false)\nconst message = ref('')\n\nasync function archiveProduct() {\n  saving.value = true\n  message.value = ''\n\n  try {\n    await $fetch(`\u002Fapi\u002Fproducts\u002F${props.productId}`, {\n      method: 'POST'\n    })\n    message.value = 'Product archived.'\n  } catch {\n    message.value = 'Could not archive the product.'\n  } finally {\n    saving.value = false\n  }\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cbutton type='button' :disabled='saving' @click='archiveProduct'>\n    {{ saving ? 'Archiving...' : 'Archive product' }}\n  \u003C\u002Fbutton>\n  \u003Cp v-if='message'>{{ message }}\u003C\u002Fp>\n\u003C\u002Ftemplate>\n","ArchiveButton.vue",[1526,1536,1590,1591,1832,1841,1846,1855,1877],[1147,2461,2462,2478,2489,2493,2508,2517,2522,2526,2544,2562,2566,2579,2589,2599,2603,2611,2637,2646,2652,2663,2674,2684,2694,2705,2710,2714,2722,2726,2734,2767,2772,2780,2800],{"__ignoreMap":1340},[1344,2463,2464,2466,2468,2470,2472,2474,2476],{"class":1346,"line":241},[1344,2465,1350],{"class":1349},[1344,2467,1354],{"class":1353},[1344,2469,1358],{"class":1357},[1344,2471,1361],{"class":1357},[1344,2473,1364],{"class":1349},[1344,2475,1368],{"class":1367},[1344,2477,1371],{"class":1349},[1344,2479,2480,2482,2485,2487],{"class":1346,"line":176},[1344,2481,1614],{"class":1376},[1344,2483,2484],{"class":1349}," { ref } ",[1344,2486,1620],{"class":1376},[1344,2488,1623],{"class":1367},[1344,2490,2491],{"class":1346,"line":278},[1344,2492,1415],{"emptyLinePlaceholder":25},[1344,2494,2495,2497,2500,2502,2505],{"class":1346,"line":147},[1344,2496,1422],{"class":1376},[1344,2498,2499],{"class":1395}," props",[1344,2501,1428],{"class":1376},[1344,2503,2504],{"class":1357}," defineProps",[1344,2506,2507],{"class":1349},"\u003C{\n",[1344,2509,2510,2513,2515],{"class":1346,"line":484},[1344,2511,2512],{"class":1388},"  productId",[1344,2514,1392],{"class":1376},[1344,2516,1396],{"class":1395},[1344,2518,2519],{"class":1346,"line":118},[1344,2520,2521],{"class":1349},"}>()\n",[1344,2523,2524],{"class":1346,"line":426},[1344,2525,1415],{"emptyLinePlaceholder":25},[1344,2527,2528,2530,2533,2535,2537,2539,2542],{"class":1346,"line":349},[1344,2529,1422],{"class":1376},[1344,2531,2532],{"class":1395}," saving",[1344,2534,1428],{"class":1376},[1344,2536,1687],{"class":1357},[1344,2538,1690],{"class":1349},[1344,2540,2541],{"class":1395},"false",[1344,2543,1448],{"class":1349},[1344,2545,2546,2548,2551,2553,2555,2557,2560],{"class":1346,"line":362},[1344,2547,1422],{"class":1376},[1344,2549,2550],{"class":1395}," message",[1344,2552,1428],{"class":1376},[1344,2554,1687],{"class":1357},[1344,2556,1690],{"class":1349},[1344,2558,2559],{"class":1367},"''",[1344,2561,1448],{"class":1349},[1344,2563,2564],{"class":1346,"line":676},[1344,2565,1415],{"emptyLinePlaceholder":25},[1344,2567,2568,2570,2573,2576],{"class":1346,"line":643},[1344,2569,2135],{"class":1376},[1344,2571,2572],{"class":1376}," function",[1344,2574,2575],{"class":1357}," archiveProduct",[1344,2577,2578],{"class":1349},"() {\n",[1344,2580,2581,2584,2586],{"class":1346,"line":1483},[1344,2582,2583],{"class":1349},"  saving.value ",[1344,2585,1364],{"class":1376},[1344,2587,2588],{"class":1395}," true\n",[1344,2590,2591,2594,2596],{"class":1346,"line":1510},[1344,2592,2593],{"class":1349},"  message.value ",[1344,2595,1364],{"class":1376},[1344,2597,2598],{"class":1367}," ''\n",[1344,2600,2601],{"class":1346,"line":1516},[1344,2602,1415],{"emptyLinePlaceholder":25},[1344,2604,2606,2609],{"class":2605,"line":1526},[1346,1419],[1344,2607,2608],{"class":1376},"  try",[1344,2610,1383],{"class":1349},[1344,2612,2614,2617,2619,2621,2624,2626,2628,2631,2634],{"class":2613,"line":1536},[1346,1419],[1344,2615,2616],{"class":1376},"    await",[1344,2618,1434],{"class":1357},[1344,2620,1690],{"class":1349},[1344,2622,2623],{"class":1367},"`\u002Fapi\u002Fproducts\u002F${",[1344,2625,295],{"class":1349},[1344,2627,2171],{"class":1367},[1344,2629,2630],{"class":1349},"productId",[1344,2632,2633],{"class":1367},"}`",[1344,2635,2636],{"class":1349},", {\n",[1344,2638,2640,2643],{"class":2639,"line":1590},[1346,1419],[1344,2641,2642],{"class":1349},"      method: ",[1344,2644,2645],{"class":1367},"'POST'\n",[1344,2647,2649],{"class":2648,"line":1591},[1346,1419],[1344,2650,2651],{"class":1349},"    })\n",[1344,2653,2655,2658,2660],{"class":2654,"line":1832},[1346,1419],[1344,2656,2657],{"class":1349},"    message.value ",[1344,2659,1364],{"class":1376},[1344,2661,2662],{"class":1367}," 'Product archived.'\n",[1344,2664,2666,2669,2672],{"class":2665,"line":1841},[1346,1419],[1344,2667,2668],{"class":1349},"  } ",[1344,2670,2671],{"class":1376},"catch",[1344,2673,1383],{"class":1349},[1344,2675,2677,2679,2681],{"class":2676,"line":1846},[1346,1419],[1344,2678,2657],{"class":1349},[1344,2680,1364],{"class":1376},[1344,2682,2683],{"class":1367}," 'Could not archive the product.'\n",[1344,2685,2687,2689,2692],{"class":2686,"line":1855},[1346,1419],[1344,2688,2668],{"class":1349},[1344,2690,2691],{"class":1376},"finally",[1344,2693,1383],{"class":1349},[1344,2695,2697,2700,2702],{"class":2696,"line":1877},[1346,1419],[1344,2698,2699],{"class":1349},"    saving.value ",[1344,2701,1364],{"class":1376},[1344,2703,2704],{"class":1395}," false\n",[1344,2706,2707],{"class":1346,"line":1899},[1344,2708,2709],{"class":1349},"  }\n",[1344,2711,2712],{"class":1346,"line":1911},[1344,2713,1410],{"class":1349},[1344,2715,2716,2718,2720],{"class":1346,"line":1934},[1344,2717,1453],{"class":1349},[1344,2719,1354],{"class":1353},[1344,2721,1371],{"class":1349},[1344,2723,2724],{"class":1346,"line":1940},[1344,2725,1415],{"emptyLinePlaceholder":25},[1344,2727,2728,2730,2732],{"class":1346,"line":1949},[1344,2729,1350],{"class":1349},[1344,2731,1468],{"class":1353},[1344,2733,1371],{"class":1349},[1344,2735,2736,2738,2741,2744,2746,2749,2752,2754,2757,2760,2762,2765],{"class":1346,"line":1958},[1344,2737,1475],{"class":1349},[1344,2739,2740],{"class":1353},"button",[1344,2742,2743],{"class":1357}," type",[1344,2745,1364],{"class":1349},[1344,2747,2748],{"class":1367},"'button'",[1344,2750,2751],{"class":1357}," :disabled",[1344,2753,1364],{"class":1349},[1344,2755,2756],{"class":1367},"'saving'",[1344,2758,2759],{"class":1357}," @click",[1344,2761,1364],{"class":1349},[1344,2763,2764],{"class":1367},"'archiveProduct'",[1344,2766,1371],{"class":1349},[1344,2768,2769],{"class":1346,"line":2363},[1344,2770,2771],{"class":1349},"    {{ saving ? 'Archiving...' : 'Archive product' }}\n",[1344,2773,2774,2776,2778],{"class":1346,"line":2373},[1344,2775,1529],{"class":1349},[1344,2777,2740],{"class":1353},[1344,2779,1371],{"class":1349},[1344,2781,2782,2784,2786,2788,2790,2793,2796,2798],{"class":1346,"line":2382},[1344,2783,1475],{"class":1349},[1344,2785,1140],{"class":1353},[1344,2787,1862],{"class":1357},[1344,2789,1364],{"class":1349},[1344,2791,2792],{"class":1367},"'message'",[1344,2794,2795],{"class":1349},">{{ message }}\u003C\u002F",[1344,2797,1140],{"class":1353},[1344,2799,1371],{"class":1349},[1344,2801,2802,2804,2806],{"class":1346,"line":2391},[1344,2803,1453],{"class":1349},[1344,2805,1468],{"class":1353},[1344,2807,1371],{"class":1349},[1140,2809,2810,2811,2813,2814,2817],{},"This block demonstrates the command and local feedback; it does not by itself demonstrate ",[1147,2812,1571],{},", key-based invalidation, or a Pinia update. In a final implementation, the message region should announce changes with accessible semantics, for example through ",[1147,2815,2816],{},"aria-live",", and distinguish error messages from informational ones.",[1140,2819,2820,2821,2823],{},"After the mutation, separate two decisions: how to confirm the result in the interface and who owns the updated state. You can call ",[1147,2822,1571],{}," on an existing read, invalidate or reload by key, or intentionally update a Pinia store. The choice depends on the application’s consistency policy.",[1140,2825,2826,2827,2829,2830,2832,2833,2835,2836,2838],{},"You can also use ",[1147,2828,1157],{}," inside a ",[1147,2831,1153],{}," handler. In that case, ",[1147,2834,1153],{}," preserves SSR and payload integration, while ",[1147,2837,1157],{}," remains the handler’s HTTP implementation.",[1160,2840,2842],{"id":2841},"reactivity-waiting-and-loading-states","Reactivity, Waiting, and Loading States",[1140,2844,2845,2847,2848,2850,2851,2853],{},[1147,2846,1281],{}," and reactivity solve different problems. ",[1147,2849,1281],{}," decides when ",[1147,2852,559],{}," continues and whether client navigation waits. Reactive dependencies decide when the data identity can change and a new fetch can be triggered.",[1140,2855,2856,2857,1783,2859,2414,2861,2863],{},"The API returns refs such as ",[1147,2858,1774],{},[1147,2860,1791],{},[1147,2862,1786],{},". Those refs participate in Vue’s reactivity model: the template updates when their values change. Do not confuse that reactivity with a caching policy. A reactive URL does not determine how long the result is retained or what happens after a mutation.",[1140,2865,2866,2867,1783,2870,2873,2874,2877],{},"If navigation should not block, you can use ",[1147,2868,2869],{},"lazy: true",[1147,2871,2872],{},"useLazyFetch",", or ",[1147,2875,2876],{},"useLazyAsyncData",". Navigation continues before the handler finishes, so the interface must visibly represent loading and error states.",[1333,2879,2883],{"className":1335,"code":2880,"filename":2881,"highlights":2882,"language":1339,"meta":1340,"style":1340},"\u003Cscript setup lang='ts'>\ninterface CatalogItem {\n  id: string\n  name: string\n}\n\nconst { data: items, status, error } = await useLazyFetch\u003CCatalogItem[]>('\u002Fapi\u002Fcatalog')\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cp v-if='status === \"pending\"'>Loading catalog...\u003C\u002Fp>\n  \u003Cp v-else-if='error'>Could not load the catalog.\u003C\u002Fp>\n  \u003Cul v-else>\n    \u003Cli v-for='item in items ?? []' :key='item.id'>\n      {{ item.name }}\n    \u003C\u002Fli>\n  \u003C\u002Ful>\n\u003C\u002Ftemplate>\n","LazyCatalog.vue",[426,349],[1147,2884,2885,2901,2909,2917,2925,2929,2933,2974,2983,2987,2995,3013,3031,3041,3061,3065,3073,3081],{"__ignoreMap":1340},[1344,2886,2887,2889,2891,2893,2895,2897,2899],{"class":1346,"line":241},[1344,2888,1350],{"class":1349},[1344,2890,1354],{"class":1353},[1344,2892,1358],{"class":1357},[1344,2894,1361],{"class":1357},[1344,2896,1364],{"class":1349},[1344,2898,1368],{"class":1367},[1344,2900,1371],{"class":1349},[1344,2902,2903,2905,2907],{"class":1346,"line":176},[1344,2904,1377],{"class":1376},[1344,2906,1634],{"class":1357},[1344,2908,1383],{"class":1349},[1344,2910,2911,2913,2915],{"class":1346,"line":278},[1344,2912,1389],{"class":1388},[1344,2914,1392],{"class":1376},[1344,2916,1396],{"class":1395},[1344,2918,2919,2921,2923],{"class":1346,"line":147},[1344,2920,1401],{"class":1388},[1344,2922,1392],{"class":1376},[1344,2924,1396],{"class":1395},[1344,2926,2927],{"class":1346,"line":484},[1344,2928,1410],{"class":1349},[1344,2930,2931],{"class":1346,"line":118},[1344,2932,1415],{"emptyLinePlaceholder":25},[1344,2934,2936,2938,2940,2942,2944,2946,2948,2950,2952,2954,2956,2958,2960,2963,2965,2967,2969,2972],{"class":2935,"line":426},[1346,1419],[1344,2937,1422],{"class":1376},[1344,2939,1771],{"class":1349},[1344,2941,1774],{"class":1388},[1344,2943,1777],{"class":1349},[1344,2945,1780],{"class":1395},[1344,2947,1783],{"class":1349},[1344,2949,1786],{"class":1395},[1344,2951,1783],{"class":1349},[1344,2953,1791],{"class":1395},[1344,2955,1794],{"class":1349},[1344,2957,1364],{"class":1376},[1344,2959,1431],{"class":1376},[1344,2961,2962],{"class":1357}," useLazyFetch",[1344,2964,1350],{"class":1349},[1344,2966,1806],{"class":1357},[1344,2968,1442],{"class":1349},[1344,2970,2971],{"class":1367},"'\u002Fapi\u002Fcatalog'",[1344,2973,1448],{"class":1349},[1344,2975,2977,2979,2981],{"class":2976,"line":349},[1346,1419],[1344,2978,1453],{"class":1349},[1344,2980,1354],{"class":1353},[1344,2982,1371],{"class":1349},[1344,2984,2985],{"class":1346,"line":362},[1344,2986,1415],{"emptyLinePlaceholder":25},[1344,2988,2989,2991,2993],{"class":1346,"line":676},[1344,2990,1350],{"class":1349},[1344,2992,1468],{"class":1353},[1344,2994,1371],{"class":1349},[1344,2996,2997,2999,3001,3003,3005,3007,3009,3011],{"class":1346,"line":643},[1344,2998,1475],{"class":1349},[1344,3000,1140],{"class":1353},[1344,3002,1862],{"class":1357},[1344,3004,1364],{"class":1349},[1344,3006,1867],{"class":1367},[1344,3008,1870],{"class":1349},[1344,3010,1140],{"class":1353},[1344,3012,1371],{"class":1349},[1344,3014,3015,3017,3019,3021,3023,3025,3027,3029],{"class":1346,"line":1483},[1344,3016,1475],{"class":1349},[1344,3018,1140],{"class":1353},[1344,3020,1884],{"class":1357},[1344,3022,1364],{"class":1349},[1344,3024,1889],{"class":1367},[1344,3026,1892],{"class":1349},[1344,3028,1140],{"class":1353},[1344,3030,1371],{"class":1349},[1344,3032,3033,3035,3037,3039],{"class":1346,"line":1510},[1344,3034,1475],{"class":1349},[1344,3036,1478],{"class":1353},[1344,3038,1906],{"class":1357},[1344,3040,1371],{"class":1349},[1344,3042,3043,3045,3047,3049,3051,3053,3055,3057,3059],{"class":1346,"line":1516},[1344,3044,1486],{"class":1349},[1344,3046,1489],{"class":1353},[1344,3048,1492],{"class":1357},[1344,3050,1364],{"class":1349},[1344,3052,1922],{"class":1367},[1344,3054,1500],{"class":1357},[1344,3056,1364],{"class":1349},[1344,3058,1929],{"class":1367},[1344,3060,1371],{"class":1349},[1344,3062,3063],{"class":1346,"line":1526},[1344,3064,1937],{"class":1349},[1344,3066,3067,3069,3071],{"class":1346,"line":1536},[1344,3068,1519],{"class":1349},[1344,3070,1489],{"class":1353},[1344,3072,1371],{"class":1349},[1344,3074,3075,3077,3079],{"class":1346,"line":1590},[1344,3076,1529],{"class":1349},[1344,3078,1478],{"class":1353},[1344,3080,1371],{"class":1349},[1344,3082,3083,3085,3087],{"class":1346,"line":1591},[1344,3084,1453],{"class":1349},[1344,3086,1468],{"class":1353},[1344,3088,1371],{"class":1349},[1140,3090,3091,3094],{},[1147,3092,3093],{},"server: false"," is a different decision: the initial load happens only on the client, and the data is not available before hydration finishes. Do not use it as an automatic fix for a duplicate request; first decide whether the read belongs in the server-rendered HTML.",[1160,3096,3098],{"id":3097},"composables-pinia-and-data-ownership","Composables, Pinia, and Data Ownership",[1140,3100,3101],{},"A view-specific read can stay in the page or in a composable when it has no shared consumers or shared lifetime. This separation prevents turning every HTTP response into global state.",[1140,3103,3104,3105,3107],{},"Pinia is a better fit when multiple components need the same state, when domain actions exist, or when the information must live beyond a single view. Its Nuxt integration handles SSR context and serialization. For initial store loads, the documentation recommends a flow such as ",[1147,3106,2439],{}," to await the action without unnecessarily repeating it.",[1140,3109,3110,3111,3113],{},"Do not automatically copy every ",[1147,3112,1149],{}," response into Pinia. Doing so can create two sources of truth and two invalidation policies: one for the Nuxt ref and another for the store. If you decide to retain the data in Pinia, define which read is authoritative and when it is updated.",[1140,3115,3116,3117,3119,3120,3122,3123,3125],{},"The difference from ",[1147,3118,1556],{}," is responsibility: ",[1147,3121,1556],{}," provides reactive access to a value cached under an explicit key; Pinia represents shared state and domain behavior. For per-user state, respect the scope of each SSR request and avoid declaring a module-level singleton ",[1147,3124,999],{}," inside a composable.",[1140,3127,3128,3129,1248,3134,2171],{},"You can expand this criterion in ",[3130,3131,3133],"a",{"href":3132},"\u002Fblog\u002Freactivity-in-composables-toref-torefs-and-how-not-to-lose-it-when-destructuring.en\u002F","Reactivity in Composables: toRef, toRefs, and How Not to Lose It When Destructuring",[3130,3135,3137],{"href":3136},"\u002Fblog\u002Fpinia-in-vue-3-when-to-use-global-state-and-when-not-to.en\u002F","Pinia in Vue 3: When to Use Global State and When Not To",[1140,3139,3140],{},"The following fragment is preserved as the starting point for the lab configured in frontmatter. Its defects are deliberate: it is for diagnosing the flow, not production-ready code.",[1333,3142,3146],{"className":1335,"code":3143,"filename":3144,"highlights":3145,"language":1339,"meta":1340,"style":1340},"\u003Cscript setup lang='ts'>\nimport { computed, ref, watch } from 'vue'\n\ninterface CatalogItem {\n  id: string\n  name: string\n}\n\nconst route = useRoute()\nconst category = computed(() => String(route.params.category))\nconst items = await $fetch\u003CCatalogItem[]>('\u002Fapi\u002Fcatalog')\nconst staticKey = 'catalog'\nconst storeItems = ref\u003CCatalogItem[]>([])\n\nwatch(category, async () => {\n  storeItems.value = await $fetch\u003CCatalogItem[]>('\u002Fapi\u002Fcatalog')\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cp>{{ staticKey }}\u003C\u002Fp>\n  \u003Cul>\n    \u003Cli v-for='item in items' :key='item.id'>{{ item.name }}\u003C\u002Fli>\n  \u003C\u002Ful>\n\u003C\u002Ftemplate>\n","BrokenCatalog.vue",[362,676,643,1483,1510,1516,1526,1536,1590],[1147,3147,3148,3164,3175,3179,3187,3195,3203,3207,3211,3224,3244,3268,3281,3300,3305,3321,3343,3348,3356,3360,3368,3381,3389,3415,3423],{"__ignoreMap":1340},[1344,3149,3150,3152,3154,3156,3158,3160,3162],{"class":1346,"line":241},[1344,3151,1350],{"class":1349},[1344,3153,1354],{"class":1353},[1344,3155,1358],{"class":1357},[1344,3157,1361],{"class":1357},[1344,3159,1364],{"class":1349},[1344,3161,1368],{"class":1367},[1344,3163,1371],{"class":1349},[1344,3165,3166,3168,3171,3173],{"class":1346,"line":176},[1344,3167,1614],{"class":1376},[1344,3169,3170],{"class":1349}," { computed, ref, watch } ",[1344,3172,1620],{"class":1376},[1344,3174,1623],{"class":1367},[1344,3176,3177],{"class":1346,"line":278},[1344,3178,1415],{"emptyLinePlaceholder":25},[1344,3180,3181,3183,3185],{"class":1346,"line":147},[1344,3182,1377],{"class":1376},[1344,3184,1634],{"class":1357},[1344,3186,1383],{"class":1349},[1344,3188,3189,3191,3193],{"class":1346,"line":484},[1344,3190,1389],{"class":1388},[1344,3192,1392],{"class":1376},[1344,3194,1396],{"class":1395},[1344,3196,3197,3199,3201],{"class":1346,"line":118},[1344,3198,1401],{"class":1388},[1344,3200,1392],{"class":1376},[1344,3202,1396],{"class":1395},[1344,3204,3205],{"class":1346,"line":426},[1344,3206,1410],{"class":1349},[1344,3208,3209],{"class":1346,"line":349},[1344,3210,1415],{"emptyLinePlaceholder":25},[1344,3212,3214,3216,3218,3220,3222],{"class":3213,"line":362},[1346,1419],[1344,3215,1422],{"class":1376},[1344,3217,1667],{"class":1395},[1344,3219,1428],{"class":1376},[1344,3221,1672],{"class":1357},[1344,3223,1675],{"class":1349},[1344,3225,3227,3229,3231,3233,3235,3237,3239,3242],{"class":3226,"line":676},[1346,1419],[1344,3228,1422],{"class":1376},[1344,3230,1725],{"class":1395},[1344,3232,1428],{"class":1376},[1344,3234,1708],{"class":1357},[1344,3236,1711],{"class":1349},[1344,3238,1714],{"class":1376},[1344,3240,3241],{"class":1357}," String",[1344,3243,1738],{"class":1349},[1344,3245,3247,3249,3252,3254,3256,3258,3260,3262,3264,3266],{"class":3246,"line":643},[1346,1419],[1344,3248,1422],{"class":1376},[1344,3250,3251],{"class":1395}," items",[1344,3253,1428],{"class":1376},[1344,3255,1431],{"class":1376},[1344,3257,1434],{"class":1357},[1344,3259,1350],{"class":1349},[1344,3261,1806],{"class":1357},[1344,3263,1442],{"class":1349},[1344,3265,2971],{"class":1367},[1344,3267,1448],{"class":1349},[1344,3269,3271,3273,3276,3278],{"class":3270,"line":1483},[1346,1419],[1344,3272,1422],{"class":1376},[1344,3274,3275],{"class":1395}," staticKey",[1344,3277,1428],{"class":1376},[1344,3279,3280],{"class":1367}," 'catalog'\n",[1344,3282,3284,3286,3289,3291,3293,3295,3297],{"class":3283,"line":1510},[1346,1419],[1344,3285,1422],{"class":1376},[1344,3287,3288],{"class":1395}," storeItems",[1344,3290,1428],{"class":1376},[1344,3292,1687],{"class":1357},[1344,3294,1350],{"class":1349},[1344,3296,1806],{"class":1357},[1344,3298,3299],{"class":1349},"[]>([])\n",[1344,3301,3303],{"class":3302,"line":1516},[1346,1419],[1344,3304,1415],{"emptyLinePlaceholder":25},[1344,3306,3308,3310,3313,3315,3317,3319],{"class":3307,"line":1526},[1346,1419],[1344,3309,269],{"class":1357},[1344,3311,3312],{"class":1349},"(category, ",[1344,3314,2135],{"class":1376},[1344,3316,2138],{"class":1349},[1344,3318,1714],{"class":1376},[1344,3320,1383],{"class":1349},[1344,3322,3324,3327,3329,3331,3333,3335,3337,3339,3341],{"class":3323,"line":1536},[1346,1419],[1344,3325,3326],{"class":1349},"  storeItems.value ",[1344,3328,1364],{"class":1376},[1344,3330,1431],{"class":1376},[1344,3332,1434],{"class":1357},[1344,3334,1350],{"class":1349},[1344,3336,1806],{"class":1357},[1344,3338,1442],{"class":1349},[1344,3340,2971],{"class":1367},[1344,3342,1448],{"class":1349},[1344,3344,3346],{"class":3345,"line":1590},[1346,1419],[1344,3347,1759],{"class":1349},[1344,3349,3350,3352,3354],{"class":1346,"line":1591},[1344,3351,1453],{"class":1349},[1344,3353,1354],{"class":1353},[1344,3355,1371],{"class":1349},[1344,3357,3358],{"class":1346,"line":1832},[1344,3359,1415],{"emptyLinePlaceholder":25},[1344,3361,3362,3364,3366],{"class":1346,"line":1841},[1344,3363,1350],{"class":1349},[1344,3365,1468],{"class":1353},[1344,3367,1371],{"class":1349},[1344,3369,3370,3372,3374,3377,3379],{"class":1346,"line":1846},[1344,3371,1475],{"class":1349},[1344,3373,1140],{"class":1353},[1344,3375,3376],{"class":1349},">{{ staticKey }}\u003C\u002F",[1344,3378,1140],{"class":1353},[1344,3380,1371],{"class":1349},[1344,3382,3383,3385,3387],{"class":1346,"line":1855},[1344,3384,1475],{"class":1349},[1344,3386,1478],{"class":1353},[1344,3388,1371],{"class":1349},[1344,3390,3391,3393,3395,3397,3399,3402,3404,3406,3408,3411,3413],{"class":1346,"line":1877},[1344,3392,1486],{"class":1349},[1344,3394,1489],{"class":1353},[1344,3396,1492],{"class":1357},[1344,3398,1364],{"class":1349},[1344,3400,3401],{"class":1367},"'item in items'",[1344,3403,1500],{"class":1357},[1344,3405,1364],{"class":1349},[1344,3407,1929],{"class":1367},[1344,3409,3410],{"class":1349},">{{ item.name }}\u003C\u002F",[1344,3412,1489],{"class":1353},[1344,3414,1371],{"class":1349},[1344,3416,3417,3419,3421],{"class":1346,"line":1899},[1344,3418,1529],{"class":1349},[1344,3420,1478],{"class":1353},[1344,3422,1371],{"class":1349},[1344,3424,3425,3427,3429],{"class":1346,"line":1911},[1344,3426,1453],{"class":1349},[1344,3428,1468],{"class":1353},[1344,3430,1371],{"class":1349},[1140,3432,3433,3434,1267,3436,3438,3439,3442,3443,3446,3447,3450,3451,3453,3454,3456],{},"There is no ",[1147,3435,1149],{},[1147,3437,1153],{}," call with ",[1147,3440,3441],{},"key: 'catalog'",", and there is no Pinia store yet. ",[1147,3444,3445],{},"staticKey"," is only a local constant, while ",[1147,3448,3449],{},"storeItems"," is a local ref that is not rendered. The diagnosis should focus on the defects that are actually present: the initial call uses direct ",[1147,3452,1157],{},", the URL ignores ",[1147,3455,1750],{},", and the watcher requests data again without expressing a complete identity.",[1160,3458,3460],{"id":3459},"final-criterion","Final Criterion",[1140,3462,3463,3464,3466,3467,3469,3470,3472],{},"Use ",[1147,3465,1149],{}," for URL-based view reads. Use ",[1147,3468,1153],{}," for custom asynchronous work. Use ",[1147,3471,1157],{}," for event-driven commands or inside a handler. In every case, review what identifies the data, whether navigation waits, how the result is reused or invalidated, and who owns it.",[1140,3474,3475,3476,3479],{},"Before closing an implementation, also confirm whether the deployment enables ",[1147,3477,3478],{},"experimental.payloadExtraction"," when you need a static caching policy across navigations, whether the external API requires authentication or a configured client, and which strategy you will apply after a mutation.",[3481,3482,3483],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":1340,"searchDepth":176,"depth":176,"links":3485},[3486,3487,3488,3489,3490,3491,3492,3493],{"id":1162,"depth":176,"text":1163},{"id":1260,"depth":176,"text":1261},{"id":1575,"depth":176,"text":1576},{"id":1995,"depth":176,"text":1996},{"id":2448,"depth":176,"text":2449},{"id":2841,"depth":176,"text":2842},{"id":3097,"depth":176,"text":3098},{"id":3459,"depth":176,"text":3460},"Visual comparison of useFetch, useAsyncData, and $fetch in Nuxt 4 for SSR, payload, and hydration.","Learn how to choose between useFetch, useAsyncData, and $fetch in Nuxt 4 according to the data flow, SSR, payload, reactivity, and state ownership with Pinia.",{"title":3497,"goal":3498,"tasks":3499,"starterCode":3143,"solutionHint":3504},"Lab: Diagnose and Fix a Duplicate Fetch","Identify why an initial read can repeat during hydration and decide whether useFetch, useAsyncData, or $fetch fits, with coherent data identity and state ownership.",[3500,3501,3502,3503],"Explain what happens to the direct $fetch call during SSR and why it can repeat during hydration.","Make the URL or key represent the category and remove the redundant watcher.","Decide whether the read should remain in a composable or whether shared state and domain behavior justify Pinia.","Define the strategy to apply after a mutation: refresh(), key-based invalidation, or an intentional store update.","The fragment does not use a data composable, ignores category in the URL, keeps a local key with no effect on Nuxt, and retains a local ref that is not a Pinia store. Fix each issue separately and justify the post-mutation policy.","en",{"updatedAt":15,"author":16,"coverCaption":3507,"keywords":3508},"Visual guide to choosing the right data API in Nuxt 4.",[19,20,3509,3510,3511,3512],"Nuxt payload","Nuxt hydration","duplicate requests","Pinia in Nuxt","\u002Fblog\u002Fusefetch-vs-useasyncdata-vs-fetch-nuxt-4.en",[3515],{"headline":1131,"author":3516,"datePublished":15,"@type":31},{"name":16,"@type":30},{"title":1131,"description":3495},"blog\u002Fusefetch-vs-useasyncdata-vs-fetch-nuxt-4.en",[3520,3522,3523,3524,3525,3527],{"tag":3521,"color":38},"Guides",{"tag":40,"color":41},{"tag":43,"color":44},{"tag":1185,"color":47},{"tag":3526,"color":50},"State Management",{"tag":3528,"color":53},"Best Practices","50toIIebIqTzVS6mgtn9ssAXJ4iWOnitqhxi717awD4",[3531,3545,3557,3568,3579,3593,3606,3620,3632,3644,3656,3669,3682,3694,3706,3717,3730,3742,3754,3766,3778,3791,3803,3816,3828,3840,3852,3863,3875,3887,3899,3913,3927,3941,3952,3964,3974,3983,3993],{"id":5,"title":6,"cover":7,"coverAlt":8,"date":9,"description":10,"draft":11,"extension":12,"locale":13,"meta":3532,"navigation":25,"path":26,"schemaOrg":3534,"seo":3537,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":34,"tags":3538,"__hash__":54},{"updatedAt":15,"author":16,"coverCaption":17,"keywords":3533},[19,20,21,22,23,24],[3535],{"headline":6,"author":3536,"datePublished":15,"@type":31},{"name":16,"@type":30},{"title":6,"description":10},[3539,3540,3541,3542,3543,3544],{"tag":37,"color":38},{"tag":40,"color":41},{"tag":43,"color":44},{"tag":46,"color":47},{"tag":49,"color":50},{"tag":52,"color":53},{"id":56,"title":57,"cover":58,"coverAlt":59,"date":60,"description":61,"draft":11,"extension":12,"locale":13,"meta":3546,"navigation":25,"path":72,"schemaOrg":3548,"seo":3551,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":78,"tags":3552,"__hash__":92},{"updatedAt":63,"author":16,"coverCaption":64,"keywords":3547},[66,67,68,69,70,71],[3549],{"headline":57,"author":3550,"datePublished":76,"@type":31},{"name":16,"@type":30},{"title":57,"description":61},[3553,3554,3555,3556],{"tag":81,"color":82},{"tag":84,"color":85},{"tag":87,"color":88},{"tag":90,"color":91},{"id":94,"title":95,"cover":96,"coverAlt":97,"date":98,"description":99,"draft":11,"extension":12,"locale":13,"meta":3558,"navigation":25,"path":111,"schemaOrg":3560,"seo":3563,"series":116,"seriesDescription":117,"seriesOrder":118,"seriesTitle":119,"slug":33,"stem":120,"tags":3564,"__hash__":125},{"updatedAt":101,"author":16,"coverCaption":102,"keywords":3559},[104,105,106,107,108,109,110],[3561],{"headline":95,"author":3562,"datePublished":101,"@type":31},{"name":16,"@type":30},{"title":95,"description":99},[3565,3566,3567],{"tag":46,"color":47},{"tag":87,"color":88},{"tag":52,"color":53},{"id":127,"title":128,"cover":129,"coverAlt":130,"date":131,"description":132,"draft":11,"extension":12,"locale":13,"meta":3569,"navigation":25,"path":142,"schemaOrg":3571,"seo":3574,"series":116,"seriesDescription":117,"seriesOrder":147,"seriesTitle":119,"slug":33,"stem":148,"tags":3575,"__hash__":153},{"updatedAt":134,"author":16,"coverCaption":135,"keywords":3570},[137,138,139,140,141],[3572],{"headline":128,"author":3573,"datePublished":134,"@type":31},{"name":16,"@type":30},{"title":128,"description":132},[3576,3577,3578],{"tag":46,"color":47},{"tag":43,"color":44},{"tag":37,"color":38},{"id":155,"title":156,"cover":157,"coverAlt":158,"date":159,"description":160,"draft":11,"extension":12,"locale":13,"meta":3580,"navigation":25,"path":171,"schemaOrg":3582,"seo":3585,"series":116,"seriesDescription":117,"seriesOrder":176,"seriesTitle":119,"slug":33,"stem":177,"tags":3586,"__hash__":185},{"updatedAt":162,"author":16,"coverCaption":163,"keywords":3581},[165,166,167,168,169,170],[3583],{"headline":156,"author":3584,"datePublished":162,"@type":31},{"name":16,"@type":30},{"title":156,"description":160},[3587,3588,3589,3590,3591,3592],{"tag":46,"color":47},{"tag":49,"color":50},{"tag":37,"color":38},{"tag":43,"color":44},{"tag":40,"color":41},{"tag":52,"color":53},{"id":187,"title":188,"cover":189,"coverAlt":190,"date":191,"description":192,"draft":11,"extension":12,"locale":13,"meta":3594,"navigation":25,"path":201,"schemaOrg":3596,"seo":3599,"series":207,"seriesDescription":208,"seriesOrder":118,"seriesTitle":209,"slug":33,"stem":210,"tags":3600,"__hash__":218},{"updatedAt":194,"author":16,"coverCaption":195,"keywords":3595},[197,198,199,49,200,43],[3597],{"headline":188,"author":3598,"datePublished":205,"@type":31},{"name":16,"@type":30},{"title":188,"description":192},[3601,3602,3603,3604,3605],{"tag":49,"color":50},{"tag":200,"color":214},{"tag":52,"color":53},{"tag":43,"color":44},{"tag":40,"color":41},{"id":220,"title":221,"cover":222,"coverAlt":223,"date":224,"description":225,"draft":11,"extension":12,"locale":13,"meta":3607,"navigation":25,"path":235,"schemaOrg":3609,"seo":3612,"series":207,"seriesDescription":208,"seriesOrder":241,"seriesTitle":209,"slug":33,"stem":242,"tags":3613,"__hash__":255},{"updatedAt":194,"author":16,"coverCaption":227,"keywords":3608},[229,230,231,232,233,234],[3610],{"headline":221,"author":3611,"datePublished":239,"@type":31},{"name":16,"@type":30},{"title":221,"description":225},[3614,3615,3616,3617,3618,3619],{"tag":229,"color":245},{"tag":200,"color":214},{"tag":52,"color":53},{"tag":43,"color":44},{"tag":250,"color":251},{"tag":253,"color":254},{"id":257,"title":258,"cover":259,"coverAlt":260,"date":261,"description":262,"draft":11,"extension":12,"locale":13,"meta":3621,"navigation":25,"path":272,"schemaOrg":3623,"seo":3626,"series":116,"seriesDescription":117,"seriesOrder":278,"seriesTitle":119,"slug":33,"stem":279,"tags":3627,"__hash__":285},{"updatedAt":264,"coverCaption":265,"author":16,"keywords":3622},[267,199,268,269,270,271,170],[3624],{"headline":258,"author":3625,"datePublished":276,"@type":31},{"name":16,"@type":30},{"title":258,"description":262},[3628,3629,3630,3631],{"tag":46,"color":47},{"tag":52,"color":53},{"tag":87,"color":88},{"tag":37,"color":38},{"id":287,"title":288,"cover":289,"coverAlt":288,"date":290,"description":291,"draft":11,"extension":12,"locale":13,"meta":3633,"navigation":25,"path":300,"schemaOrg":3635,"seo":3638,"series":207,"seriesDescription":208,"seriesOrder":176,"seriesTitle":209,"slug":33,"stem":306,"tags":3639,"__hash__":314},{"updatedAt":194,"coverCaption":293,"author":16,"keywords":3634},[267,199,295,296,297,298,299],[3636],{"headline":288,"author":3637,"datePublished":304,"@type":31},{"name":16,"@type":30},{"title":288,"description":291},[3640,3641,3642,3643],{"tag":229,"color":245},{"tag":250,"color":251},{"tag":37,"color":38},{"tag":312,"color":313},{"id":316,"title":317,"cover":318,"coverAlt":319,"date":320,"description":321,"draft":11,"extension":12,"locale":13,"meta":3645,"navigation":25,"path":327,"schemaOrg":3647,"seo":3650,"series":207,"seriesDescription":208,"seriesOrder":278,"seriesTitle":209,"slug":33,"stem":333,"tags":3651,"__hash__":339},{"updatedAt":194,"coverCaption":323,"author":16,"keywords":3646},[267,199,43,170,325,326],[3648],{"headline":317,"author":3649,"datePublished":331,"@type":31},{"name":16,"@type":30},{"title":317,"description":321},[3652,3653,3654,3655],{"tag":43,"color":44},{"tag":229,"color":245},{"tag":52,"color":53},{"tag":312,"color":313},{"id":341,"title":342,"cover":343,"coverAlt":344,"date":345,"description":346,"draft":11,"extension":12,"locale":13,"meta":3657,"navigation":25,"path":355,"schemaOrg":3659,"seo":3662,"series":360,"seriesDescription":361,"seriesOrder":362,"seriesTitle":363,"slug":33,"stem":364,"tags":3663,"__hash__":373},{"updatedAt":348,"readingTime":349,"coverCaption":350,"author":16,"keywords":3658},[267,352,353,40,354],[3660],{"headline":342,"author":3661,"datePublished":348,"@type":31},{"name":16,"@type":30},{"title":342,"description":346},[3664,3665,3666,3667,3668],{"tag":367,"color":368},{"tag":40,"color":41},{"tag":200,"color":214},{"tag":229,"color":245},{"tag":84,"color":85},{"id":375,"title":376,"cover":377,"coverAlt":378,"date":379,"description":380,"draft":11,"extension":12,"locale":13,"meta":3670,"navigation":25,"path":389,"schemaOrg":3672,"seo":3675,"series":360,"seriesDescription":361,"seriesOrder":349,"seriesTitle":363,"slug":33,"stem":394,"tags":3676,"__hash__":405},{"updatedAt":382,"coverCaption":383,"author":16,"keywords":3671},[267,385,386,387,388],[3673],{"headline":376,"author":3674,"datePublished":382,"@type":31},{"name":16,"@type":30},{"title":376,"description":380},[3677,3678,3679,3680,3681],{"tag":367,"color":368},{"tag":398,"color":399},{"tag":401,"color":402},{"tag":46,"color":47},{"tag":84,"color":85},{"id":407,"title":408,"cover":409,"coverAlt":410,"date":411,"description":412,"draft":11,"extension":12,"locale":13,"meta":3683,"navigation":25,"path":421,"schemaOrg":3685,"seo":3688,"series":360,"seriesDescription":361,"seriesOrder":426,"seriesTitle":363,"slug":33,"stem":427,"tags":3689,"__hash__":435},{"updatedAt":414,"coverCaption":415,"author":16,"keywords":3684},[267,417,418,419,420],[3686],{"headline":408,"author":3687,"datePublished":414,"@type":31},{"name":16,"@type":30},{"title":408,"description":412},[3690,3691,3692,3693],{"tag":367,"color":368},{"tag":431,"color":432},{"tag":229,"color":245},{"tag":84,"color":85},{"id":437,"title":438,"cover":439,"coverAlt":440,"date":441,"description":442,"draft":11,"extension":12,"locale":13,"meta":3695,"navigation":25,"path":451,"schemaOrg":3697,"seo":3700,"series":360,"seriesDescription":361,"seriesOrder":118,"seriesTitle":363,"slug":33,"stem":456,"tags":3701,"__hash__":463},{"updatedAt":444,"coverCaption":445,"author":16,"keywords":3696},[267,447,448,449,450],[3698],{"headline":438,"author":3699,"datePublished":444,"@type":31},{"name":16,"@type":30},{"title":438,"description":442},[3702,3703,3704,3705],{"tag":367,"color":368},{"tag":447,"color":460},{"tag":229,"color":245},{"tag":84,"color":85},{"id":465,"title":466,"cover":467,"coverAlt":468,"date":469,"description":470,"draft":11,"extension":12,"locale":13,"meta":3707,"navigation":25,"path":479,"schemaOrg":3709,"seo":3712,"series":360,"seriesDescription":361,"seriesOrder":484,"seriesTitle":363,"slug":33,"stem":485,"tags":3713,"__hash__":490},{"updatedAt":472,"coverCaption":473,"author":16,"keywords":3708},[267,475,476,477,478],[3710],{"headline":466,"author":3711,"datePublished":472,"@type":31},{"name":16,"@type":30},{"title":466,"description":470},[3714,3715,3716],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":312,"color":313},{"id":492,"title":493,"cover":494,"coverAlt":495,"date":496,"description":497,"draft":11,"extension":12,"locale":13,"meta":3718,"navigation":25,"path":506,"schemaOrg":3720,"seo":3723,"series":360,"seriesDescription":361,"seriesOrder":147,"seriesTitle":363,"slug":33,"stem":511,"tags":3724,"__hash__":518},{"updatedAt":499,"coverCaption":500,"author":16,"keywords":3719},[267,502,503,504,505],[3721],{"headline":493,"author":3722,"datePublished":499,"@type":31},{"name":16,"@type":30},{"title":493,"description":497},[3725,3726,3727,3728,3729],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":401,"color":402},{"tag":46,"color":47},{"tag":312,"color":313},{"id":520,"title":521,"cover":522,"coverAlt":523,"date":524,"description":525,"draft":11,"extension":12,"locale":13,"meta":3731,"navigation":25,"path":534,"schemaOrg":3733,"seo":3736,"series":360,"seriesDescription":361,"seriesOrder":278,"seriesTitle":363,"slug":33,"stem":539,"tags":3737,"__hash__":545},{"updatedAt":527,"coverCaption":528,"author":16,"keywords":3732},[267,530,531,532,533],[3734],{"headline":521,"author":3735,"datePublished":527,"@type":31},{"name":16,"@type":30},{"title":521,"description":525},[3738,3739,3740,3741],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":401,"color":402},{"tag":312,"color":313},{"id":547,"title":548,"cover":549,"coverAlt":550,"date":551,"description":552,"draft":11,"extension":12,"locale":13,"meta":3743,"navigation":25,"path":560,"schemaOrg":3745,"seo":3748,"series":360,"seriesDescription":361,"seriesOrder":176,"seriesTitle":363,"slug":33,"stem":565,"tags":3749,"__hash__":571},{"updatedAt":554,"coverCaption":555,"author":16,"keywords":3744},[267,557,558,559,170],[3746],{"headline":548,"author":3747,"datePublished":554,"@type":31},{"name":16,"@type":30},{"title":548,"description":552},[3750,3751,3752,3753],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":46,"color":47},{"tag":312,"color":313},{"id":573,"title":574,"cover":575,"coverAlt":574,"date":576,"description":577,"draft":11,"extension":12,"locale":13,"meta":3755,"navigation":25,"path":585,"schemaOrg":3757,"seo":3760,"series":360,"seriesDescription":361,"seriesOrder":241,"seriesTitle":363,"slug":33,"stem":590,"tags":3761,"__hash__":596},{"updatedAt":579,"readingTime":349,"coverCaption":580,"author":16,"keywords":3756},[267,582,170,583,584],[3758],{"headline":574,"author":3759,"datePublished":579,"@type":31},{"name":16,"@type":30},{"title":574,"description":577},[3762,3763,3764,3765],{"tag":367,"color":368},{"tag":229,"color":245},{"tag":46,"color":47},{"tag":312,"color":313},{"id":598,"title":599,"cover":600,"coverAlt":599,"date":601,"description":602,"draft":11,"extension":12,"locale":13,"meta":3767,"navigation":25,"path":609,"schemaOrg":3769,"seo":3772,"series":116,"seriesDescription":117,"seriesOrder":484,"seriesTitle":119,"slug":33,"stem":615,"tags":3773,"__hash__":621},{"updatedAt":264,"coverCaption":604,"author":16,"keywords":3768},[199,271,606,607,608,268],[3770],{"headline":599,"author":3771,"datePublished":613,"@type":31},{"name":16,"@type":30},{"title":599,"description":602},[3774,3775,3776,3777],{"tag":46,"color":47},{"tag":200,"color":214},{"tag":87,"color":88},{"tag":84,"color":85},{"id":623,"title":624,"cover":625,"coverAlt":626,"date":627,"description":628,"draft":11,"extension":12,"locale":13,"meta":3779,"navigation":25,"path":635,"schemaOrg":3781,"seo":3784,"series":641,"seriesDescription":642,"seriesOrder":643,"seriesTitle":644,"slug":33,"stem":645,"tags":3785,"__hash__":656},{"updatedAt":630,"coverCaption":626,"author":16,"keywords":3780},[267,632,633,634,170,583],[3782],{"headline":638,"author":3783,"datePublished":630,"@type":31},{"name":16,"@type":30},{"title":624,"description":628},[3786,3787,3788,3789,3790],{"tag":648,"color":649},{"tag":651,"color":652},{"tag":200,"color":214},{"tag":46,"color":47},{"tag":84,"color":85},{"id":658,"title":659,"cover":660,"coverAlt":661,"date":662,"description":663,"draft":11,"extension":12,"locale":13,"meta":3792,"navigation":25,"path":670,"schemaOrg":3794,"seo":3797,"series":641,"seriesDescription":642,"seriesOrder":676,"seriesTitle":644,"slug":33,"stem":677,"tags":3798,"__hash__":685},{"updatedAt":665,"coverCaption":604,"author":16,"keywords":3793},[267,667,668,669,170,583],[3795],{"headline":673,"author":3796,"datePublished":665,"@type":31},{"name":16,"@type":30},{"title":659,"description":663},[3799,3800,3801,3802],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":401,"color":402},{"tag":312,"color":313},{"id":687,"title":688,"cover":689,"coverAlt":690,"date":691,"description":692,"draft":11,"extension":12,"locale":13,"meta":3804,"navigation":25,"path":700,"schemaOrg":3806,"seo":3809,"series":641,"seriesDescription":642,"seriesOrder":362,"seriesTitle":644,"slug":33,"stem":706,"tags":3810,"__hash__":713},{"updatedAt":694,"coverCaption":604,"author":16,"keywords":3805},[267,696,697,698,699],[3807],{"headline":703,"author":3808,"datePublished":694,"@type":31},{"name":16,"@type":30},{"title":688,"description":692},[3811,3812,3813,3814,3815],{"tag":648,"color":649},{"tag":87,"color":88},{"tag":401,"color":402},{"tag":46,"color":47},{"tag":84,"color":85},{"id":715,"title":716,"cover":717,"coverAlt":718,"date":719,"description":720,"draft":11,"extension":12,"locale":33,"meta":3817,"navigation":25,"path":728,"schemaOrg":3819,"seo":3822,"series":641,"seriesDescription":642,"seriesOrder":349,"seriesTitle":644,"slug":33,"stem":733,"tags":3823,"__hash__":739},{"updatedAt":722,"coverCaption":723,"keywords":3818},[267,725,726,727,505,170,583],[3820],{"headline":716,"author":3821,"datePublished":722,"@type":31},{"name":16,"@type":30},{"title":716,"description":720},[3824,3825,3826,3827],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":401,"color":402},{"tag":312,"color":313},{"id":741,"title":742,"cover":743,"coverAlt":744,"date":745,"description":746,"draft":11,"extension":12,"locale":13,"meta":3829,"navigation":25,"path":755,"schemaOrg":3831,"seo":3834,"series":641,"seriesDescription":642,"seriesOrder":426,"seriesTitle":644,"slug":33,"stem":761,"tags":3835,"__hash__":767},{"updatedAt":748,"coverCaption":749,"author":16,"keywords":3830},[267,751,752,753,754,170,583],[3832],{"headline":758,"author":3833,"datePublished":748,"@type":31},{"name":16,"@type":30},{"title":742,"description":746},[3836,3837,3838,3839],{"tag":648,"color":649},{"tag":253,"color":254},{"tag":229,"color":245},{"tag":84,"color":85},{"id":769,"title":770,"cover":771,"coverAlt":772,"date":773,"description":774,"draft":11,"extension":12,"locale":13,"meta":3841,"navigation":25,"path":781,"schemaOrg":3843,"seo":3846,"series":641,"seriesDescription":642,"seriesOrder":118,"seriesTitle":644,"slug":33,"stem":787,"tags":3847,"__hash__":795},{"updatedAt":776,"coverCaption":604,"author":16,"keywords":3842},[267,778,779,780,170,583],[3844],{"headline":784,"author":3845,"datePublished":776,"@type":31},{"name":16,"@type":30},{"title":770,"description":774},[3848,3849,3850,3851],{"tag":648,"color":649},{"tag":791,"color":792},{"tag":46,"color":47},{"tag":312,"color":313},{"id":797,"title":798,"cover":799,"coverAlt":800,"date":801,"description":802,"draft":11,"extension":12,"locale":13,"meta":3853,"navigation":25,"path":809,"schemaOrg":3855,"seo":3858,"series":641,"seriesDescription":642,"seriesOrder":484,"seriesTitle":644,"slug":33,"stem":815,"tags":3859,"__hash__":820},{"updatedAt":804,"coverCaption":604,"author":16,"keywords":3854},[267,806,807,808,170,583],[3856],{"headline":812,"author":3857,"datePublished":804,"@type":31},{"name":16,"@type":30},{"title":798,"description":802},[3860,3861,3862],{"tag":648,"color":649},{"tag":250,"color":251},{"tag":312,"color":313},{"id":822,"title":823,"cover":824,"coverAlt":825,"date":826,"description":827,"draft":11,"extension":12,"locale":13,"meta":3864,"navigation":25,"path":835,"schemaOrg":3866,"seo":3869,"series":641,"seriesDescription":642,"seriesOrder":147,"seriesTitle":644,"slug":33,"stem":841,"tags":3870,"__hash__":847},{"updatedAt":829,"coverCaption":604,"author":16,"keywords":3865},[267,831,832,833,834,170,583],[3867],{"headline":838,"author":3868,"datePublished":829,"@type":31},{"name":16,"@type":30},{"title":823,"description":827},[3871,3872,3873,3874],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":46,"color":47},{"tag":312,"color":313},{"id":849,"title":850,"cover":851,"coverAlt":852,"date":853,"description":854,"draft":11,"extension":12,"locale":13,"meta":3876,"navigation":25,"path":861,"schemaOrg":3878,"seo":3881,"series":641,"seriesDescription":642,"seriesOrder":278,"seriesTitle":644,"slug":33,"stem":867,"tags":3882,"__hash__":874},{"updatedAt":856,"coverCaption":604,"author":16,"keywords":3877},[267,858,859,860,170,583,505],[3879],{"headline":864,"author":3880,"datePublished":856,"@type":31},{"name":16,"@type":30},{"title":850,"description":854},[3883,3884,3885,3886],{"tag":648,"color":649},{"tag":871,"color":47},{"tag":681,"color":682},{"tag":312,"color":313},{"id":876,"title":877,"cover":878,"coverAlt":879,"date":880,"description":881,"draft":11,"extension":12,"locale":13,"meta":3888,"navigation":25,"path":891,"schemaOrg":3890,"seo":3893,"series":641,"seriesDescription":642,"seriesOrder":176,"seriesTitle":644,"slug":33,"stem":897,"tags":3894,"__hash__":905},{"updatedAt":883,"coverCaption":884,"author":16,"keywords":3889},[267,886,887,888,889,890,170,583],[3891],{"headline":894,"author":3892,"datePublished":883,"@type":31},{"name":16,"@type":30},{"title":877,"description":881},[3895,3896,3897,3898],{"tag":648,"color":649},{"tag":901,"color":902},{"tag":681,"color":682},{"tag":312,"color":313},{"id":907,"title":908,"cover":909,"coverAlt":908,"date":910,"description":911,"draft":11,"extension":12,"locale":13,"meta":3900,"navigation":25,"path":916,"schemaOrg":3902,"seo":3905,"series":641,"seriesDescription":642,"seriesOrder":241,"seriesTitle":644,"slug":33,"stem":922,"tags":3906,"__hash__":930},{"updatedAt":748,"readingTime":118,"coverCaption":913,"author":16,"keywords":3901},[267,648,915,52],[3903],{"headline":908,"author":3904,"datePublished":920,"@type":31},{"name":16,"@type":30},{"title":908,"description":911},[3907,3908,3909,3910,3911,3912],{"tag":648,"color":649},{"tag":681,"color":682},{"tag":901,"color":902},{"tag":871,"color":47},{"tag":46,"color":47},{"tag":312,"color":313},{"id":932,"title":933,"cover":934,"coverAlt":933,"date":935,"description":936,"draft":11,"extension":12,"locale":13,"meta":3914,"navigation":25,"path":943,"schemaOrg":3916,"seo":3919,"series":207,"seriesDescription":208,"seriesOrder":484,"seriesTitle":209,"slug":33,"stem":949,"tags":3920,"__hash__":958},{"updatedAt":194,"coverCaption":938,"author":16,"keywords":3915},[199,940,941,942,915],[3917],{"headline":933,"author":3918,"datePublished":947,"@type":31},{"name":16,"@type":30},{"title":933,"description":936},[3921,3922,3923,3924,3925,3926],{"tag":200,"color":214},{"tag":942,"color":953},{"tag":229,"color":245},{"tag":46,"color":47},{"tag":84,"color":85},{"tag":52,"color":53},{"id":960,"title":961,"cover":962,"coverAlt":961,"date":963,"description":964,"draft":11,"extension":12,"locale":13,"meta":3928,"navigation":25,"path":971,"schemaOrg":3930,"seo":3933,"series":207,"seriesDescription":208,"seriesOrder":147,"seriesTitle":209,"slug":33,"stem":977,"tags":3934,"__hash__":987},{"updatedAt":194,"coverCaption":966,"author":16,"keywords":3929},[267,968,969,970,170,271],[3931],{"headline":961,"author":3932,"datePublished":975,"@type":31},{"name":16,"@type":30},{"title":961,"description":964},[3935,3936,3937,3938,3939,3940],{"tag":980,"color":981},{"tag":49,"color":50},{"tag":200,"color":214},{"tag":942,"color":953},{"tag":229,"color":245},{"tag":52,"color":53},{"id":989,"title":990,"cover":991,"coverAlt":992,"date":993,"description":994,"draft":11,"extension":12,"locale":13,"meta":3942,"navigation":25,"path":1001,"schemaOrg":3944,"seo":3947,"series":116,"seriesDescription":117,"seriesOrder":241,"seriesTitle":119,"slug":33,"stem":1007,"tags":3948,"__hash__":1014},{"updatedAt":264,"coverCaption":996,"author":16,"keywords":3943},[267,46,998,170,999,1000],[3945],{"headline":990,"author":3946,"datePublished":1005,"@type":31},{"name":16,"@type":30},{"title":990,"description":994},[3949,3950,3951],{"tag":46,"color":47},{"tag":312,"color":313},{"tag":1012,"color":1013},{"id":1016,"title":1017,"cover":1018,"coverAlt":1019,"date":1020,"description":1021,"draft":11,"extension":12,"locale":13,"meta":3953,"navigation":25,"path":1026,"schemaOrg":3954,"seo":3957,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1032,"tags":3958,"__hash__":1041},{"updatedAt":1023,"coverCaption":1024,"author":16,"keywords":1025},[3955],{"headline":1017,"author":3956,"datePublished":1030,"@type":31},{"name":16,"@type":30},{"title":1017,"description":1021},[3959,3960,3961,3962,3963],{"tag":1035,"color":1036},{"tag":81,"color":82},{"tag":46,"color":47},{"tag":90,"color":91},{"tag":84,"color":85},{"id":1043,"title":1044,"cover":1045,"coverAlt":1046,"date":1047,"description":1048,"draft":11,"extension":12,"locale":13,"meta":3965,"navigation":25,"path":1051,"schemaOrg":3966,"seo":3969,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1057,"tags":3970,"__hash__":1064},{"updatedAt":1023,"coverCaption":1050},[3967],{"headline":1044,"author":3968,"datePublished":1055,"@type":31},{"name":16,"@type":30},{"title":1044,"description":1048},[3971,3972,3973],{"tag":1060,"color":1061},{"tag":90,"color":91},{"tag":312,"color":313},{"id":1066,"title":1067,"cover":1068,"coverAlt":1069,"date":1070,"description":1071,"draft":11,"extension":12,"locale":13,"meta":3975,"navigation":25,"path":1074,"schemaOrg":3976,"seo":3979,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1080,"tags":3980,"__hash__":1084},{"updatedAt":1023,"coverCaption":1073},[3977],{"headline":1067,"author":3978,"datePublished":1078,"@type":31},{"name":16,"@type":30},{"title":1067,"description":1071},[3981,3982],{"tag":1012,"color":1013},{"tag":90,"color":91},{"id":1086,"title":1087,"cover":1088,"coverAlt":1019,"date":1089,"description":1090,"draft":11,"extension":12,"locale":13,"meta":3984,"navigation":25,"path":1094,"schemaOrg":3985,"seo":3988,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1100,"tags":3989,"__hash__":1105},{"updatedAt":1023,"coverCaption":1092,"author":16,"keywords":1093},[3986],{"headline":1087,"author":3987,"datePublished":1098,"@type":31},{"name":16,"@type":30},{"title":1087,"description":1090},[3990,3991,3992],{"tag":90,"color":91},{"tag":312,"color":313},{"tag":1012,"color":1013},{"id":1107,"title":1108,"cover":1109,"coverAlt":1110,"date":1111,"description":1112,"draft":11,"extension":12,"locale":13,"meta":3994,"navigation":25,"path":1115,"schemaOrg":3995,"seo":3998,"series":33,"seriesDescription":33,"seriesOrder":33,"seriesTitle":33,"slug":33,"stem":1121,"tags":3999,"__hash__":1128},{"updatedAt":1023,"coverCaption":1114},[3996],{"headline":1108,"author":3997,"datePublished":1119,"@type":31},{"name":16,"@type":30},{"title":1108,"description":1112},[4000,4001,4002],{"tag":16,"color":1036},{"tag":1125,"color":1126},{"tag":90,"color":91},1786764859321]