[{"data":1,"prerenderedAt":2406},["ShallowReactive",2],{"article-alternates":3,"article-\u002Ffr\u002Ftech\u002Fnuxt-3-cloudflare-pages-10s-lcp-vers-2s":13},{"i18nKey":4,"paths":5},"tech-001-2026-06",{"de":6,"en":7,"es":8,"fr":9,"it":10,"ru":11,"tr":12},"\u002Fde\u002Ftech\u002Fnuxt-3-cloudflare-pages-lcp-verbesserung","\u002Fen\u002Ftech\u002Fnuxt-3-cloudflare-pages-lcp-optimization","\u002Fes\u002Ftech\u002Fnuxt-3-cloudflare-pages-lcp-2-segundos","\u002Ffr\u002Ftech\u002Fnuxt-3-cloudflare-pages-10s-lcp-vers-2s","\u002Fit\u002Ftech\u002Fnuxt-3-cloudflare-pages-lcp-ottimizzazione","\u002Fru\u002Ftech\u002Fnuxt-3-cloudflare-pages-lcp-optimizacija","\u002Ftr\u002Ftech\u002Fnuxt-3-cloudflare-pages-10s-lcpden-2sye",{"_path":9,"_dir":14,"_draft":15,"_partial":15,"_locale":16,"title":17,"description":18,"publishedAt":19,"modifiedAt":19,"category":14,"i18nKey":4,"tags":20,"readingTime":26,"author":27,"body":28,"_type":2400,"_id":2401,"_source":2402,"_file":2403,"_stem":2404,"_extension":2405},"tech",false,"","Nuxt 3 + Cloudflare Pages : LCP de 10s à 2s","Fonts auto-hébergées, hydration lazy, content-visibility et edge caching pour réduire le Largest Contentful Paint de 80%. Benchmarks et code inclus.","2026-06-16",[21,22,23,24,25],"nuxt-3","cloudflare-pages","web-performance","core-web-vitals","edge-caching",9,"Roibase",{"type":29,"children":30,"toc":2388},"root",[31,48,55,68,101,114,143,155,349,362,367,373,378,399,483,488,832,837,850,857,870,957,969,975,988,1069,1080,1085,1192,1210,1318,1334,1340,1353,1361,1401,1406,1417,1423,1428,1703,1708,1714,1719,2106,2111,2183,2195,2319,2324,2330,2343,2367,2372,2377,2382],{"type":32,"tag":33,"props":34,"children":35},"element","p",{},[36,39,46],{"type":37,"value":38},"text","Un projet e-commerce Nuxt 3 déployé sur Cloudflare Pages affichait un LCP de 10,2s sur PageSpeed Insights. Google Fonts, hydration côté client, chargement above-the-fold et headers cache CDN étaient les goulots classiques. En utilisant le subsetting de fonts auto-hébergées, l'API lazy hydration de Vue 3, la propriété CSS ",{"type":32,"tag":40,"props":41,"children":43},"code",{"className":42},[],[44],{"type":37,"value":45},"content-visibility",{"type":37,"value":47}," et les réglages de TTL edge cache Cloudflare, nous avons ramené le LCP à 2,1s. Voici les détails techniques des quatre interventions et les résultats mesurés.",{"type":32,"tag":49,"props":50,"children":52},"h2",{"id":51},"subsetting-de-fonts-auto-hébergées-réduction-fcp-de-900ms",[53],{"type":37,"value":54},"Subsetting de fonts auto-hébergées : réduction FCP de 900ms",{"type":32,"tag":33,"props":56,"children":57},{},[58,60,66],{"type":37,"value":59},"Le fichier CSS Google Fonts était une requête de 320ms bloquant le rendu. Après le téléchargement de la variable font WOFF2, le First Contentful Paint se situait autour de 3,8s. Nous avons installé le paquet ",{"type":32,"tag":40,"props":61,"children":63},{"className":62},[],[64],{"type":37,"value":65},"@fontsource",{"type":37,"value":67}," et sélectionné uniquement le subset Latin + plage de weights 400-700 :",{"type":32,"tag":69,"props":70,"children":74},"pre",{"code":71,"language":72,"meta":16,"className":73,"style":16},"npm install @fontsource-variable\u002Finter\n","bash","language-bash shiki shiki-themes github-dark",[75],{"type":32,"tag":40,"props":76,"children":77},{"__ignoreMap":16},[78],{"type":32,"tag":79,"props":80,"children":83},"span",{"class":81,"line":82},"line",1,[84,90,96],{"type":32,"tag":79,"props":85,"children":87},{"style":86},"--shiki-default:#B392F0",[88],{"type":37,"value":89},"npm",{"type":32,"tag":79,"props":91,"children":93},{"style":92},"--shiki-default:#9ECBFF",[94],{"type":37,"value":95}," install",{"type":32,"tag":79,"props":97,"children":98},{"style":92},[99],{"type":37,"value":100}," @fontsource-variable\u002Finter\n",{"type":32,"tag":33,"props":102,"children":103},{},[104,106,112],{"type":37,"value":105},"Import dans ",{"type":32,"tag":40,"props":107,"children":109},{"className":108},[],[110],{"type":37,"value":111},"app.vue",{"type":37,"value":113}," :",{"type":32,"tag":69,"props":115,"children":119},{"code":116,"language":117,"meta":16,"className":118,"style":16},"import '@fontsource-variable\u002Finter\u002Fwght.css';\n","javascript","language-javascript shiki shiki-themes github-dark",[120],{"type":32,"tag":40,"props":121,"children":122},{"__ignoreMap":16},[123],{"type":32,"tag":79,"props":124,"children":125},{"class":81,"line":82},[126,132,137],{"type":32,"tag":79,"props":127,"children":129},{"style":128},"--shiki-default:#F97583",[130],{"type":37,"value":131},"import",{"type":32,"tag":79,"props":133,"children":134},{"style":92},[135],{"type":37,"value":136}," '@fontsource-variable\u002Finter\u002Fwght.css'",{"type":32,"tag":79,"props":138,"children":140},{"style":139},"--shiki-default:#E1E4E8",[141],{"type":37,"value":142},";\n",{"type":32,"tag":33,"props":144,"children":145},{},[146,148,154],{"type":37,"value":147},"Réglage dans ",{"type":32,"tag":40,"props":149,"children":151},{"className":150},[],[152],{"type":37,"value":153},"nuxt.config.ts",{"type":37,"value":113},{"type":32,"tag":69,"props":156,"children":160},{"code":157,"language":158,"meta":16,"className":159,"style":16},"export default defineNuxtConfig({\n  css: ['@fontsource-variable\u002Finter\u002Fwght.css'],\n  vite: {\n    css: {\n      postcss: {\n        plugins: [\n          require('postcss-preset-env')({\n            features: { 'custom-properties': false }\n          })\n        ]\n      }\n    }\n  }\n});\n","typescript","language-typescript shiki shiki-themes github-dark",[161],{"type":32,"tag":40,"props":162,"children":163},{"__ignoreMap":16},[164,187,206,215,224,233,242,266,296,304,313,322,331,340],{"type":32,"tag":79,"props":165,"children":166},{"class":81,"line":82},[167,172,177,182],{"type":32,"tag":79,"props":168,"children":169},{"style":128},[170],{"type":37,"value":171},"export",{"type":32,"tag":79,"props":173,"children":174},{"style":128},[175],{"type":37,"value":176}," default",{"type":32,"tag":79,"props":178,"children":179},{"style":86},[180],{"type":37,"value":181}," defineNuxtConfig",{"type":32,"tag":79,"props":183,"children":184},{"style":139},[185],{"type":37,"value":186},"({\n",{"type":32,"tag":79,"props":188,"children":190},{"class":81,"line":189},2,[191,196,201],{"type":32,"tag":79,"props":192,"children":193},{"style":139},[194],{"type":37,"value":195},"  css: [",{"type":32,"tag":79,"props":197,"children":198},{"style":92},[199],{"type":37,"value":200},"'@fontsource-variable\u002Finter\u002Fwght.css'",{"type":32,"tag":79,"props":202,"children":203},{"style":139},[204],{"type":37,"value":205},"],\n",{"type":32,"tag":79,"props":207,"children":209},{"class":81,"line":208},3,[210],{"type":32,"tag":79,"props":211,"children":212},{"style":139},[213],{"type":37,"value":214},"  vite: {\n",{"type":32,"tag":79,"props":216,"children":218},{"class":81,"line":217},4,[219],{"type":32,"tag":79,"props":220,"children":221},{"style":139},[222],{"type":37,"value":223},"    css: {\n",{"type":32,"tag":79,"props":225,"children":227},{"class":81,"line":226},5,[228],{"type":32,"tag":79,"props":229,"children":230},{"style":139},[231],{"type":37,"value":232},"      postcss: {\n",{"type":32,"tag":79,"props":234,"children":236},{"class":81,"line":235},6,[237],{"type":32,"tag":79,"props":238,"children":239},{"style":139},[240],{"type":37,"value":241},"        plugins: [\n",{"type":32,"tag":79,"props":243,"children":245},{"class":81,"line":244},7,[246,251,256,261],{"type":32,"tag":79,"props":247,"children":248},{"style":86},[249],{"type":37,"value":250},"          require",{"type":32,"tag":79,"props":252,"children":253},{"style":139},[254],{"type":37,"value":255},"(",{"type":32,"tag":79,"props":257,"children":258},{"style":92},[259],{"type":37,"value":260},"'postcss-preset-env'",{"type":32,"tag":79,"props":262,"children":263},{"style":139},[264],{"type":37,"value":265},")({\n",{"type":32,"tag":79,"props":267,"children":269},{"class":81,"line":268},8,[270,275,280,285,291],{"type":32,"tag":79,"props":271,"children":272},{"style":139},[273],{"type":37,"value":274},"            features: { ",{"type":32,"tag":79,"props":276,"children":277},{"style":92},[278],{"type":37,"value":279},"'custom-properties'",{"type":32,"tag":79,"props":281,"children":282},{"style":139},[283],{"type":37,"value":284},": ",{"type":32,"tag":79,"props":286,"children":288},{"style":287},"--shiki-default:#79B8FF",[289],{"type":37,"value":290},"false",{"type":32,"tag":79,"props":292,"children":293},{"style":139},[294],{"type":37,"value":295}," }\n",{"type":32,"tag":79,"props":297,"children":298},{"class":81,"line":26},[299],{"type":32,"tag":79,"props":300,"children":301},{"style":139},[302],{"type":37,"value":303},"          })\n",{"type":32,"tag":79,"props":305,"children":307},{"class":81,"line":306},10,[308],{"type":32,"tag":79,"props":309,"children":310},{"style":139},[311],{"type":37,"value":312},"        ]\n",{"type":32,"tag":79,"props":314,"children":316},{"class":81,"line":315},11,[317],{"type":32,"tag":79,"props":318,"children":319},{"style":139},[320],{"type":37,"value":321},"      }\n",{"type":32,"tag":79,"props":323,"children":325},{"class":81,"line":324},12,[326],{"type":32,"tag":79,"props":327,"children":328},{"style":139},[329],{"type":37,"value":330},"    }\n",{"type":32,"tag":79,"props":332,"children":334},{"class":81,"line":333},13,[335],{"type":32,"tag":79,"props":336,"children":337},{"style":139},[338],{"type":37,"value":339},"  }\n",{"type":32,"tag":79,"props":341,"children":343},{"class":81,"line":342},14,[344],{"type":32,"tag":79,"props":345,"children":346},{"style":139},[347],{"type":37,"value":348},"});\n",{"type":32,"tag":33,"props":350,"children":351},{},[352,354,360],{"type":37,"value":353},"Résultat : fichier WOFF2 de 24KB, servi en ligne lors de la première requête. FCP 3,8s → 2,9s. Durée bloquant le rendu 320ms → 0ms. Nous avons conservé les axes de variable font en important ",{"type":32,"tag":40,"props":355,"children":357},{"className":356},[],[358],{"type":37,"value":359},"wght.css",{"type":37,"value":361}," plutôt que des fichiers de poids statiques.",{"type":32,"tag":33,"props":363,"children":364},{},[365],{"type":37,"value":366},"Bien que le CDN de Google Fonts dispose de nombreux points de présence, le lookup DNS + poignée de main TLS ajoute 200-300ms pour chaque visiteur. Avec le serveur auto-hébergé, le temps de servir depuis l'edge de Cloudflare Pages est identique, mais nous éliminons le hop DNS supplémentaire.",{"type":32,"tag":49,"props":368,"children":370},{"id":369},"hydration-lazy-tbt-2190ms-200ms",[371],{"type":37,"value":372},"Hydration lazy : TBT 2190ms → 200ms",{"type":32,"tag":33,"props":374,"children":375},{},[376],{"type":37,"value":377},"Nuxt 3 hydrate tous les composants côté client par défaut. Sur une page de liste de produits avec 48 cartes, chacune a généré 120KB de JavaScript à parser pour le système de réactivité Vue. Le Total Blocking Time s'élevait à 2190ms — l'utilisateur ne pouvait pas faire défiler la page pendant 2 secondes.",{"type":32,"tag":33,"props":379,"children":380},{},[381,383,389,391,397],{"type":37,"value":382},"Nous avons utilisé ",{"type":32,"tag":40,"props":384,"children":386},{"className":385},[],[387],{"type":37,"value":388},"defineAsyncComponent",{"type":37,"value":390}," + ",{"type":32,"tag":40,"props":392,"children":394},{"className":393},[],[395],{"type":37,"value":396},"hydration:lazy",{"type":37,"value":398}," de Vue 3.5+ pour hydrater les composants below-the-fold au besoin :",{"type":32,"tag":69,"props":400,"children":402},{"code":401,"language":117,"meta":16,"className":118,"style":16},"\u002F\u002F components\u002FProductCard.vue\n\u003Cscript setup>\ndefineOptions({\n  hydration: 'lazy'\n});\n\u003C\u002Fscript>\n",[403],{"type":32,"tag":40,"props":404,"children":405},{"__ignoreMap":16},[406,415,439,447,460,467],{"type":32,"tag":79,"props":407,"children":408},{"class":81,"line":82},[409],{"type":32,"tag":79,"props":410,"children":412},{"style":411},"--shiki-default:#6A737D",[413],{"type":37,"value":414},"\u002F\u002F components\u002FProductCard.vue\n",{"type":32,"tag":79,"props":416,"children":417},{"class":81,"line":189},[418,423,429,434],{"type":32,"tag":79,"props":419,"children":420},{"style":139},[421],{"type":37,"value":422},"\u003C",{"type":32,"tag":79,"props":424,"children":426},{"style":425},"--shiki-default:#85E89D",[427],{"type":37,"value":428},"script",{"type":32,"tag":79,"props":430,"children":431},{"style":86},[432],{"type":37,"value":433}," setup",{"type":32,"tag":79,"props":435,"children":436},{"style":139},[437],{"type":37,"value":438},">\n",{"type":32,"tag":79,"props":440,"children":441},{"class":81,"line":208},[442],{"type":32,"tag":79,"props":443,"children":444},{"style":139},[445],{"type":37,"value":446},"defineOptions({\n",{"type":32,"tag":79,"props":448,"children":449},{"class":81,"line":217},[450,455],{"type":32,"tag":79,"props":451,"children":452},{"style":139},[453],{"type":37,"value":454},"  hydration: ",{"type":32,"tag":79,"props":456,"children":457},{"style":92},[458],{"type":37,"value":459},"'lazy'\n",{"type":32,"tag":79,"props":461,"children":462},{"class":81,"line":226},[463],{"type":32,"tag":79,"props":464,"children":465},{"style":139},[466],{"type":37,"value":348},{"type":32,"tag":79,"props":468,"children":469},{"class":81,"line":235},[470,475,479],{"type":32,"tag":79,"props":471,"children":472},{"style":139},[473],{"type":37,"value":474},"\u003C\u002F",{"type":32,"tag":79,"props":476,"children":477},{"style":425},[478],{"type":37,"value":428},{"type":32,"tag":79,"props":480,"children":481},{"style":139},[482],{"type":37,"value":438},{"type":32,"tag":33,"props":484,"children":485},{},[486],{"type":37,"value":487},"Avec Intersection Observer pour hydrater lorsqu'ils entrent dans le viewport :",{"type":32,"tag":69,"props":489,"children":491},{"code":490,"language":117,"meta":16,"className":118,"style":16},"\u002F\u002F plugins\u002Flazy-hydration.client.ts\nexport default defineNuxtPlugin((nuxtApp) => {\n  nuxtApp.vueApp.mixin({\n    mounted() {\n      if (this.$options.hydration === 'lazy') {\n        const observer = new IntersectionObserver((entries) => {\n          entries.forEach((entry) => {\n            if (entry.isIntersecting) {\n              this.$forceUpdate();\n              observer.disconnect();\n            }\n          });\n        });\n        observer.observe(this.$el);\n      }\n    }\n  });\n});\n",[492],{"type":32,"tag":40,"props":493,"children":494},{"__ignoreMap":16},[495,503,545,562,575,613,662,696,709,732,749,757,765,773,799,807,815,824],{"type":32,"tag":79,"props":496,"children":497},{"class":81,"line":82},[498],{"type":32,"tag":79,"props":499,"children":500},{"style":411},[501],{"type":37,"value":502},"\u002F\u002F plugins\u002Flazy-hydration.client.ts\n",{"type":32,"tag":79,"props":504,"children":505},{"class":81,"line":189},[506,510,514,519,524,530,535,540],{"type":32,"tag":79,"props":507,"children":508},{"style":128},[509],{"type":37,"value":171},{"type":32,"tag":79,"props":511,"children":512},{"style":128},[513],{"type":37,"value":176},{"type":32,"tag":79,"props":515,"children":516},{"style":86},[517],{"type":37,"value":518}," defineNuxtPlugin",{"type":32,"tag":79,"props":520,"children":521},{"style":139},[522],{"type":37,"value":523},"((",{"type":32,"tag":79,"props":525,"children":527},{"style":526},"--shiki-default:#FFAB70",[528],{"type":37,"value":529},"nuxtApp",{"type":32,"tag":79,"props":531,"children":532},{"style":139},[533],{"type":37,"value":534},") ",{"type":32,"tag":79,"props":536,"children":537},{"style":128},[538],{"type":37,"value":539},"=>",{"type":32,"tag":79,"props":541,"children":542},{"style":139},[543],{"type":37,"value":544}," {\n",{"type":32,"tag":79,"props":546,"children":547},{"class":81,"line":208},[548,553,558],{"type":32,"tag":79,"props":549,"children":550},{"style":139},[551],{"type":37,"value":552},"  nuxtApp.vueApp.",{"type":32,"tag":79,"props":554,"children":555},{"style":86},[556],{"type":37,"value":557},"mixin",{"type":32,"tag":79,"props":559,"children":560},{"style":139},[561],{"type":37,"value":186},{"type":32,"tag":79,"props":563,"children":564},{"class":81,"line":217},[565,570],{"type":32,"tag":79,"props":566,"children":567},{"style":86},[568],{"type":37,"value":569},"    mounted",{"type":32,"tag":79,"props":571,"children":572},{"style":139},[573],{"type":37,"value":574},"() {\n",{"type":32,"tag":79,"props":576,"children":577},{"class":81,"line":226},[578,583,588,593,598,603,608],{"type":32,"tag":79,"props":579,"children":580},{"style":128},[581],{"type":37,"value":582},"      if",{"type":32,"tag":79,"props":584,"children":585},{"style":139},[586],{"type":37,"value":587}," (",{"type":32,"tag":79,"props":589,"children":590},{"style":287},[591],{"type":37,"value":592},"this",{"type":32,"tag":79,"props":594,"children":595},{"style":139},[596],{"type":37,"value":597},".$options.hydration ",{"type":32,"tag":79,"props":599,"children":600},{"style":128},[601],{"type":37,"value":602},"===",{"type":32,"tag":79,"props":604,"children":605},{"style":92},[606],{"type":37,"value":607}," 'lazy'",{"type":32,"tag":79,"props":609,"children":610},{"style":139},[611],{"type":37,"value":612},") {\n",{"type":32,"tag":79,"props":614,"children":615},{"class":81,"line":235},[616,621,626,631,636,641,645,650,654,658],{"type":32,"tag":79,"props":617,"children":618},{"style":128},[619],{"type":37,"value":620},"        const",{"type":32,"tag":79,"props":622,"children":623},{"style":287},[624],{"type":37,"value":625}," observer",{"type":32,"tag":79,"props":627,"children":628},{"style":128},[629],{"type":37,"value":630}," =",{"type":32,"tag":79,"props":632,"children":633},{"style":128},[634],{"type":37,"value":635}," new",{"type":32,"tag":79,"props":637,"children":638},{"style":86},[639],{"type":37,"value":640}," IntersectionObserver",{"type":32,"tag":79,"props":642,"children":643},{"style":139},[644],{"type":37,"value":523},{"type":32,"tag":79,"props":646,"children":647},{"style":526},[648],{"type":37,"value":649},"entries",{"type":32,"tag":79,"props":651,"children":652},{"style":139},[653],{"type":37,"value":534},{"type":32,"tag":79,"props":655,"children":656},{"style":128},[657],{"type":37,"value":539},{"type":32,"tag":79,"props":659,"children":660},{"style":139},[661],{"type":37,"value":544},{"type":32,"tag":79,"props":663,"children":664},{"class":81,"line":244},[665,670,675,679,684,688,692],{"type":32,"tag":79,"props":666,"children":667},{"style":139},[668],{"type":37,"value":669},"          entries.",{"type":32,"tag":79,"props":671,"children":672},{"style":86},[673],{"type":37,"value":674},"forEach",{"type":32,"tag":79,"props":676,"children":677},{"style":139},[678],{"type":37,"value":523},{"type":32,"tag":79,"props":680,"children":681},{"style":526},[682],{"type":37,"value":683},"entry",{"type":32,"tag":79,"props":685,"children":686},{"style":139},[687],{"type":37,"value":534},{"type":32,"tag":79,"props":689,"children":690},{"style":128},[691],{"type":37,"value":539},{"type":32,"tag":79,"props":693,"children":694},{"style":139},[695],{"type":37,"value":544},{"type":32,"tag":79,"props":697,"children":698},{"class":81,"line":268},[699,704],{"type":32,"tag":79,"props":700,"children":701},{"style":128},[702],{"type":37,"value":703},"            if",{"type":32,"tag":79,"props":705,"children":706},{"style":139},[707],{"type":37,"value":708}," (entry.isIntersecting) {\n",{"type":32,"tag":79,"props":710,"children":711},{"class":81,"line":26},[712,717,722,727],{"type":32,"tag":79,"props":713,"children":714},{"style":287},[715],{"type":37,"value":716},"              this",{"type":32,"tag":79,"props":718,"children":719},{"style":139},[720],{"type":37,"value":721},".",{"type":32,"tag":79,"props":723,"children":724},{"style":86},[725],{"type":37,"value":726},"$forceUpdate",{"type":32,"tag":79,"props":728,"children":729},{"style":139},[730],{"type":37,"value":731},"();\n",{"type":32,"tag":79,"props":733,"children":734},{"class":81,"line":306},[735,740,745],{"type":32,"tag":79,"props":736,"children":737},{"style":139},[738],{"type":37,"value":739},"              observer.",{"type":32,"tag":79,"props":741,"children":742},{"style":86},[743],{"type":37,"value":744},"disconnect",{"type":32,"tag":79,"props":746,"children":747},{"style":139},[748],{"type":37,"value":731},{"type":32,"tag":79,"props":750,"children":751},{"class":81,"line":315},[752],{"type":32,"tag":79,"props":753,"children":754},{"style":139},[755],{"type":37,"value":756},"            }\n",{"type":32,"tag":79,"props":758,"children":759},{"class":81,"line":324},[760],{"type":32,"tag":79,"props":761,"children":762},{"style":139},[763],{"type":37,"value":764},"          });\n",{"type":32,"tag":79,"props":766,"children":767},{"class":81,"line":333},[768],{"type":32,"tag":79,"props":769,"children":770},{"style":139},[771],{"type":37,"value":772},"        });\n",{"type":32,"tag":79,"props":774,"children":775},{"class":81,"line":342},[776,781,786,790,794],{"type":32,"tag":79,"props":777,"children":778},{"style":139},[779],{"type":37,"value":780},"        observer.",{"type":32,"tag":79,"props":782,"children":783},{"style":86},[784],{"type":37,"value":785},"observe",{"type":32,"tag":79,"props":787,"children":788},{"style":139},[789],{"type":37,"value":255},{"type":32,"tag":79,"props":791,"children":792},{"style":287},[793],{"type":37,"value":592},{"type":32,"tag":79,"props":795,"children":796},{"style":139},[797],{"type":37,"value":798},".$el);\n",{"type":32,"tag":79,"props":800,"children":802},{"class":81,"line":801},15,[803],{"type":32,"tag":79,"props":804,"children":805},{"style":139},[806],{"type":37,"value":321},{"type":32,"tag":79,"props":808,"children":810},{"class":81,"line":809},16,[811],{"type":32,"tag":79,"props":812,"children":813},{"style":139},[814],{"type":37,"value":330},{"type":32,"tag":79,"props":816,"children":818},{"class":81,"line":817},17,[819],{"type":32,"tag":79,"props":820,"children":821},{"style":139},[822],{"type":37,"value":823},"  });\n",{"type":32,"tag":79,"props":825,"children":827},{"class":81,"line":826},18,[828],{"type":32,"tag":79,"props":829,"children":830},{"style":139},[831],{"type":37,"value":348},{"type":32,"tag":33,"props":833,"children":834},{},[835],{"type":37,"value":836},"Le héros above-the-fold + les 6 premiers produits sont hydratés immédiatement, les autres en mode lazy. Taille du bundle 480KB → 280KB initial, 200KB lazy chunk. TBT 2190ms → 200ms. L'utilisateur peut faire défiler après 1 seconde.",{"type":32,"tag":33,"props":838,"children":839},{},[840,842,848],{"type":37,"value":841},"Compromis : délai d'attachement du listener d'événement lazy hydration. Pour les composants avec des gestionnaires de clics, nous avons gardé ",{"type":32,"tag":40,"props":843,"children":845},{"className":844},[],[846],{"type":37,"value":847},"hydration: 'immediate'",{"type":37,"value":849}," (bouton Ajouter au panier). Pour le contenu déclenché au scroll, lazy est idéal.",{"type":32,"tag":851,"props":852,"children":854},"h3",{"id":853},"composant-lazy-intégré-de-nuxt",[855],{"type":37,"value":856},"Composant Lazy intégré de Nuxt",{"type":32,"tag":33,"props":858,"children":859},{},[860,862,868],{"type":37,"value":861},"Nuxt 3.0+ inclut le préfixe ",{"type":32,"tag":40,"props":863,"children":865},{"className":864},[],[866],{"type":37,"value":867},"\u003CLazyComponentName>",{"type":37,"value":869}," qui fait la même chose :",{"type":32,"tag":69,"props":871,"children":875},{"code":872,"language":873,"meta":16,"className":874,"style":16},"\u003Ctemplate>\n  \u003CLazyProductCard v-for=\"product in products\" :key=\"product.id\" \u002F>\n\u003C\u002Ftemplate>\n","vue","language-vue shiki shiki-themes github-dark",[876],{"type":32,"tag":40,"props":877,"children":878},{"__ignoreMap":16},[879,895,942],{"type":32,"tag":79,"props":880,"children":881},{"class":81,"line":82},[882,886,891],{"type":32,"tag":79,"props":883,"children":884},{"style":139},[885],{"type":37,"value":422},{"type":32,"tag":79,"props":887,"children":888},{"style":425},[889],{"type":37,"value":890},"template",{"type":32,"tag":79,"props":892,"children":893},{"style":139},[894],{"type":37,"value":438},{"type":32,"tag":79,"props":896,"children":897},{"class":81,"line":189},[898,903,908,913,918,923,928,932,937],{"type":32,"tag":79,"props":899,"children":900},{"style":139},[901],{"type":37,"value":902},"  \u003C",{"type":32,"tag":79,"props":904,"children":905},{"style":425},[906],{"type":37,"value":907},"LazyProductCard",{"type":32,"tag":79,"props":909,"children":910},{"style":86},[911],{"type":37,"value":912}," v-for",{"type":32,"tag":79,"props":914,"children":915},{"style":139},[916],{"type":37,"value":917},"=",{"type":32,"tag":79,"props":919,"children":920},{"style":92},[921],{"type":37,"value":922},"\"product in products\"",{"type":32,"tag":79,"props":924,"children":925},{"style":86},[926],{"type":37,"value":927}," :key",{"type":32,"tag":79,"props":929,"children":930},{"style":139},[931],{"type":37,"value":917},{"type":32,"tag":79,"props":933,"children":934},{"style":92},[935],{"type":37,"value":936},"\"product.id\"",{"type":32,"tag":79,"props":938,"children":939},{"style":139},[940],{"type":37,"value":941}," \u002F>\n",{"type":32,"tag":79,"props":943,"children":944},{"class":81,"line":208},[945,949,953],{"type":32,"tag":79,"props":946,"children":947},{"style":139},[948],{"type":37,"value":474},{"type":32,"tag":79,"props":950,"children":951},{"style":425},[952],{"type":37,"value":890},{"type":32,"tag":79,"props":954,"children":955},{"style":139},[956],{"type":37,"value":438},{"type":32,"tag":33,"props":958,"children":959},{},[960,962,968],{"type":37,"value":961},"Cependant, cette méthode ne rend pas le composant côté serveur, seulement côté client. Dans notre configuration, SSR était requis pour le SEO, donc nous avons préféré l'approche ",{"type":32,"tag":40,"props":963,"children":965},{"className":964},[],[966],{"type":37,"value":967},"defineOptions",{"type":37,"value":721},{"type":32,"tag":49,"props":970,"children":972},{"id":971},"css-content-visibility-gain-lcp-de-14s",[973],{"type":37,"value":974},"CSS content-visibility : gain LCP de 1,4s",{"type":32,"tag":33,"props":976,"children":977},{},[978,980,986],{"type":37,"value":979},"Dans la grille de produits avec 48 cartes, le rendu provoquait un layout shift. Le navigateur rendait chaque carte et calculait CLS, retardant le LCP. Nous avons utilisé ",{"type":32,"tag":40,"props":981,"children":983},{"className":982},[],[984],{"type":37,"value":985},"content-visibility: auto",{"type":37,"value":987}," pour retirer le contenu off-screen du cycle de rendu :",{"type":32,"tag":69,"props":989,"children":993},{"code":990,"language":991,"meta":16,"className":992,"style":16},".product-card {\n  content-visibility: auto;\n  contain-intrinsic-size: 0 360px;\n}\n","css","language-css shiki shiki-themes github-dark",[994],{"type":32,"tag":40,"props":995,"children":996},{"__ignoreMap":16},[997,1009,1030,1061],{"type":32,"tag":79,"props":998,"children":999},{"class":81,"line":82},[1000,1005],{"type":32,"tag":79,"props":1001,"children":1002},{"style":86},[1003],{"type":37,"value":1004},".product-card",{"type":32,"tag":79,"props":1006,"children":1007},{"style":139},[1008],{"type":37,"value":544},{"type":32,"tag":79,"props":1010,"children":1011},{"class":81,"line":189},[1012,1017,1021,1026],{"type":32,"tag":79,"props":1013,"children":1014},{"style":287},[1015],{"type":37,"value":1016},"  content-visibility",{"type":32,"tag":79,"props":1018,"children":1019},{"style":139},[1020],{"type":37,"value":284},{"type":32,"tag":79,"props":1022,"children":1023},{"style":287},[1024],{"type":37,"value":1025},"auto",{"type":32,"tag":79,"props":1027,"children":1028},{"style":139},[1029],{"type":37,"value":142},{"type":32,"tag":79,"props":1031,"children":1032},{"class":81,"line":208},[1033,1038,1042,1047,1052,1057],{"type":32,"tag":79,"props":1034,"children":1035},{"style":287},[1036],{"type":37,"value":1037},"  contain-intrinsic-size",{"type":32,"tag":79,"props":1039,"children":1040},{"style":139},[1041],{"type":37,"value":284},{"type":32,"tag":79,"props":1043,"children":1044},{"style":287},[1045],{"type":37,"value":1046},"0",{"type":32,"tag":79,"props":1048,"children":1049},{"style":287},[1050],{"type":37,"value":1051}," 360",{"type":32,"tag":79,"props":1053,"children":1054},{"style":128},[1055],{"type":37,"value":1056},"px",{"type":32,"tag":79,"props":1058,"children":1059},{"style":139},[1060],{"type":37,"value":142},{"type":32,"tag":79,"props":1062,"children":1063},{"class":81,"line":217},[1064],{"type":32,"tag":79,"props":1065,"children":1066},{"style":139},[1067],{"type":37,"value":1068},"}\n",{"type":32,"tag":33,"props":1070,"children":1071},{},[1072,1078],{"type":32,"tag":40,"props":1073,"children":1075},{"className":1074},[],[1076],{"type":37,"value":1077},"contain-intrinsic-size",{"type":37,"value":1079}," dit au navigateur « cet élément mesure 360px de haut », conservant une hauteur de placeholder en dehors du viewport. Layout shift CLS 0,18 → 0,02.",{"type":32,"tag":33,"props":1081,"children":1082},{},[1083],{"type":37,"value":1084},"Benchmark (Lighthouse 10.4, réseau throttlé 4G) :",{"type":32,"tag":1086,"props":1087,"children":1088},"table",{},[1089,1118],{"type":32,"tag":1090,"props":1091,"children":1092},"thead",{},[1093],{"type":32,"tag":1094,"props":1095,"children":1096},"tr",{},[1097,1103,1108,1113],{"type":32,"tag":1098,"props":1099,"children":1100},"th",{},[1101],{"type":37,"value":1102},"Métrique",{"type":32,"tag":1098,"props":1104,"children":1105},{},[1106],{"type":37,"value":1107},"Avant",{"type":32,"tag":1098,"props":1109,"children":1110},{},[1111],{"type":37,"value":1112},"Après",{"type":32,"tag":1098,"props":1114,"children":1115},{},[1116],{"type":37,"value":1117},"Delta",{"type":32,"tag":1119,"props":1120,"children":1121},"tbody",{},[1122,1146,1169],{"type":32,"tag":1094,"props":1123,"children":1124},{},[1125,1131,1136,1141],{"type":32,"tag":1126,"props":1127,"children":1128},"td",{},[1129],{"type":37,"value":1130},"LCP",{"type":32,"tag":1126,"props":1132,"children":1133},{},[1134],{"type":37,"value":1135},"10,2s",{"type":32,"tag":1126,"props":1137,"children":1138},{},[1139],{"type":37,"value":1140},"2,1s",{"type":32,"tag":1126,"props":1142,"children":1143},{},[1144],{"type":37,"value":1145},"-8,1s",{"type":32,"tag":1094,"props":1147,"children":1148},{},[1149,1154,1159,1164],{"type":32,"tag":1126,"props":1150,"children":1151},{},[1152],{"type":37,"value":1153},"CLS",{"type":32,"tag":1126,"props":1155,"children":1156},{},[1157],{"type":37,"value":1158},"0,18",{"type":32,"tag":1126,"props":1160,"children":1161},{},[1162],{"type":37,"value":1163},"0,02",{"type":32,"tag":1126,"props":1165,"children":1166},{},[1167],{"type":37,"value":1168},"-0,16",{"type":32,"tag":1094,"props":1170,"children":1171},{},[1172,1177,1182,1187],{"type":32,"tag":1126,"props":1173,"children":1174},{},[1175],{"type":37,"value":1176},"TBT",{"type":32,"tag":1126,"props":1178,"children":1179},{},[1180],{"type":37,"value":1181},"2190ms",{"type":32,"tag":1126,"props":1183,"children":1184},{},[1185],{"type":37,"value":1186},"200ms",{"type":32,"tag":1126,"props":1188,"children":1189},{},[1190],{"type":37,"value":1191},"-1990ms",{"type":32,"tag":33,"props":1193,"children":1194},{},[1195,1200,1202,1208],{"type":32,"tag":40,"props":1196,"children":1198},{"className":1197},[],[1199],{"type":37,"value":45},{"type":37,"value":1201}," est supporté Safari 17+, iOS 16 se replie sur le rendu normal. Nous utilisons ",{"type":32,"tag":40,"props":1203,"children":1205},{"className":1204},[],[1206],{"type":37,"value":1207},"@supports",{"type":37,"value":1209}," pour l'amélioration progressive :",{"type":32,"tag":69,"props":1211,"children":1213},{"code":1212,"language":991,"meta":16,"className":992,"style":16},"@supports (content-visibility: auto) {\n  .product-card {\n    content-visibility: auto;\n    contain-intrinsic-size: 0 360px;\n  }\n}\n",[1214],{"type":32,"tag":40,"props":1215,"children":1216},{"__ignoreMap":16},[1217,1244,1256,1276,1304,1311],{"type":32,"tag":79,"props":1218,"children":1219},{"class":81,"line":82},[1220,1224,1228,1232,1236,1240],{"type":32,"tag":79,"props":1221,"children":1222},{"style":128},[1223],{"type":37,"value":1207},{"type":32,"tag":79,"props":1225,"children":1226},{"style":139},[1227],{"type":37,"value":587},{"type":32,"tag":79,"props":1229,"children":1230},{"style":287},[1231],{"type":37,"value":45},{"type":32,"tag":79,"props":1233,"children":1234},{"style":139},[1235],{"type":37,"value":284},{"type":32,"tag":79,"props":1237,"children":1238},{"style":287},[1239],{"type":37,"value":1025},{"type":32,"tag":79,"props":1241,"children":1242},{"style":139},[1243],{"type":37,"value":612},{"type":32,"tag":79,"props":1245,"children":1246},{"class":81,"line":189},[1247,1252],{"type":32,"tag":79,"props":1248,"children":1249},{"style":86},[1250],{"type":37,"value":1251},"  .product-card",{"type":32,"tag":79,"props":1253,"children":1254},{"style":139},[1255],{"type":37,"value":544},{"type":32,"tag":79,"props":1257,"children":1258},{"class":81,"line":208},[1259,1264,1268,1272],{"type":32,"tag":79,"props":1260,"children":1261},{"style":287},[1262],{"type":37,"value":1263},"    content-visibility",{"type":32,"tag":79,"props":1265,"children":1266},{"style":139},[1267],{"type":37,"value":284},{"type":32,"tag":79,"props":1269,"children":1270},{"style":287},[1271],{"type":37,"value":1025},{"type":32,"tag":79,"props":1273,"children":1274},{"style":139},[1275],{"type":37,"value":142},{"type":32,"tag":79,"props":1277,"children":1278},{"class":81,"line":217},[1279,1284,1288,1292,1296,1300],{"type":32,"tag":79,"props":1280,"children":1281},{"style":287},[1282],{"type":37,"value":1283},"    contain-intrinsic-size",{"type":32,"tag":79,"props":1285,"children":1286},{"style":139},[1287],{"type":37,"value":284},{"type":32,"tag":79,"props":1289,"children":1290},{"style":287},[1291],{"type":37,"value":1046},{"type":32,"tag":79,"props":1293,"children":1294},{"style":287},[1295],{"type":37,"value":1051},{"type":32,"tag":79,"props":1297,"children":1298},{"style":128},[1299],{"type":37,"value":1056},{"type":32,"tag":79,"props":1301,"children":1302},{"style":139},[1303],{"type":37,"value":142},{"type":32,"tag":79,"props":1305,"children":1306},{"class":81,"line":226},[1307],{"type":32,"tag":79,"props":1308,"children":1309},{"style":139},[1310],{"type":37,"value":339},{"type":32,"tag":79,"props":1312,"children":1313},{"class":81,"line":235},[1314],{"type":32,"tag":79,"props":1315,"children":1316},{"style":139},[1317],{"type":37,"value":1068},{"type":32,"tag":33,"props":1319,"children":1320},{},[1321,1323,1332],{"type":37,"value":1322},"Cette approche est critique dans le processus ",{"type":32,"tag":1324,"props":1325,"children":1329},"a",{"href":1326,"rel":1327},"https:\u002F\u002Fwww.roibase.com.tr\u002Ffr\u002Fui-ux",[1328],"nofollow",[1330],{"type":37,"value":1331},"UI\u002FUX Design",{"type":37,"value":1333}," pour la stabilité du layout. L'expérience utilisateur devient indépendante du coût de rendu du contenu en dehors du viewport.",{"type":32,"tag":49,"props":1335,"children":1337},{"id":1336},"optimisation-ttl-edge-cache-cloudflare-pages",[1338],{"type":37,"value":1339},"Optimisation TTL Edge Cache Cloudflare Pages",{"type":32,"tag":33,"props":1341,"children":1342},{},[1343,1345,1351],{"type":37,"value":1344},"Le TTL edge cache par défaut de Cloudflare Pages est de 2 heures. Les prix des produits se mettent à jour toutes les 15 minutes, mais les assets visuels (images, fonts) restent statiques pendant 7 jours. Nous avons utilisé le fichier ",{"type":32,"tag":40,"props":1346,"children":1348},{"className":1347},[],[1349],{"type":37,"value":1350},"_headers",{"type":37,"value":1352}," pour un contrôle granulaire du cache :",{"type":32,"tag":69,"props":1354,"children":1356},{"code":1355},"# _headers\n\u002Fassets\u002F*\n  Cache-Control: public, max-age=604800, immutable\n\n\u002F_nuxt\u002F*\n  Cache-Control: public, max-age=31536000, immutable\n\n\u002Fapi\u002F*\n  Cache-Control: public, s-maxage=900, stale-while-revalidate=60\n\n\u002F*\n  Cache-Control: public, max-age=0, s-maxage=3600, stale-while-revalidate=300\n",[1357],{"type":32,"tag":40,"props":1358,"children":1359},{"__ignoreMap":16},[1360],{"type":37,"value":1355},{"type":32,"tag":1362,"props":1363,"children":1364},"ul",{},[1365,1385,1396],{"type":32,"tag":1366,"props":1367,"children":1368},"li",{},[1369,1375,1377,1383],{"type":32,"tag":40,"props":1370,"children":1372},{"className":1371},[],[1373],{"type":37,"value":1374},"\u002Fassets\u002F*",{"type":37,"value":1376}," et ",{"type":32,"tag":40,"props":1378,"children":1380},{"className":1379},[],[1381],{"type":37,"value":1382},"\u002F_nuxt\u002F*",{"type":37,"value":1384}," : 1 an immutable (hash d'empreinte digitale, URL change = nouveau fichier)",{"type":32,"tag":1366,"props":1386,"children":1387},{},[1388,1394],{"type":32,"tag":40,"props":1389,"children":1391},{"className":1390},[],[1392],{"type":37,"value":1393},"\u002Fapi\u002F*",{"type":37,"value":1395}," : 15 minutes edge cache, 60 secondes stale-while-revalidate (en cas de défaillance origin, servir les anciennes données)",{"type":32,"tag":1366,"props":1397,"children":1398},{},[1399],{"type":37,"value":1400},"HTML racine : 1 heure edge cache, 5 minutes stale-while-revalidate",{"type":32,"tag":33,"props":1402,"children":1403},{},[1404],{"type":37,"value":1405},"Time to First Byte depuis l'edge 40ms, depuis l'origin 280ms. Taux de hit edge %89 → %96. TTFB médian 280ms → 45ms.",{"type":32,"tag":33,"props":1407,"children":1408},{},[1409,1415],{"type":32,"tag":40,"props":1410,"children":1412},{"className":1411},[],[1413],{"type":37,"value":1414},"stale-while-revalidate",{"type":37,"value":1416}," est critique pour l'utilisateur : si l'origin se met à jour, servir le cache ancien et récupérer les nouvelles données en arrière-plan. L'utilisateur n'attend jamais.",{"type":32,"tag":851,"props":1418,"children":1420},{"id":1419},"purge-dynamique-avec-cloudflare-kv",[1421],{"type":37,"value":1422},"Purge dynamique avec Cloudflare KV",{"type":32,"tag":33,"props":1424,"children":1425},{},[1426],{"type":37,"value":1427},"Au lieu de purger tout le cache lors d'une mise à jour des prix, nous utilisons Cloudflare KV + Workers pour invalider de manière sélective :",{"type":32,"tag":69,"props":1429,"children":1431},{"code":1430,"language":117,"meta":16,"className":118,"style":16},"\u002F\u002F workers\u002Fcache-purge.js\nexport default {\n  async fetch(request, env) {\n    const url = new URL(request.url);\n    const productId = url.searchParams.get('id');\n    \n    const cacheKey = `product:${productId}`;\n    await env.CACHE_KV.delete(cacheKey);\n    \n    return new Response('Cache purged', { status: 200 });\n  }\n};\n",[1432],{"type":32,"tag":40,"props":1433,"children":1434},{"__ignoreMap":16},[1435,1443,1458,1494,1525,1565,1573,1608,1640,1647,1688,1695],{"type":32,"tag":79,"props":1436,"children":1437},{"class":81,"line":82},[1438],{"type":32,"tag":79,"props":1439,"children":1440},{"style":411},[1441],{"type":37,"value":1442},"\u002F\u002F workers\u002Fcache-purge.js\n",{"type":32,"tag":79,"props":1444,"children":1445},{"class":81,"line":189},[1446,1450,1454],{"type":32,"tag":79,"props":1447,"children":1448},{"style":128},[1449],{"type":37,"value":171},{"type":32,"tag":79,"props":1451,"children":1452},{"style":128},[1453],{"type":37,"value":176},{"type":32,"tag":79,"props":1455,"children":1456},{"style":139},[1457],{"type":37,"value":544},{"type":32,"tag":79,"props":1459,"children":1460},{"class":81,"line":208},[1461,1466,1471,1475,1480,1485,1490],{"type":32,"tag":79,"props":1462,"children":1463},{"style":128},[1464],{"type":37,"value":1465},"  async",{"type":32,"tag":79,"props":1467,"children":1468},{"style":86},[1469],{"type":37,"value":1470}," fetch",{"type":32,"tag":79,"props":1472,"children":1473},{"style":139},[1474],{"type":37,"value":255},{"type":32,"tag":79,"props":1476,"children":1477},{"style":526},[1478],{"type":37,"value":1479},"request",{"type":32,"tag":79,"props":1481,"children":1482},{"style":139},[1483],{"type":37,"value":1484},", ",{"type":32,"tag":79,"props":1486,"children":1487},{"style":526},[1488],{"type":37,"value":1489},"env",{"type":32,"tag":79,"props":1491,"children":1492},{"style":139},[1493],{"type":37,"value":612},{"type":32,"tag":79,"props":1495,"children":1496},{"class":81,"line":217},[1497,1502,1507,1511,1515,1520],{"type":32,"tag":79,"props":1498,"children":1499},{"style":128},[1500],{"type":37,"value":1501},"    const",{"type":32,"tag":79,"props":1503,"children":1504},{"style":287},[1505],{"type":37,"value":1506}," url",{"type":32,"tag":79,"props":1508,"children":1509},{"style":128},[1510],{"type":37,"value":630},{"type":32,"tag":79,"props":1512,"children":1513},{"style":128},[1514],{"type":37,"value":635},{"type":32,"tag":79,"props":1516,"children":1517},{"style":86},[1518],{"type":37,"value":1519}," URL",{"type":32,"tag":79,"props":1521,"children":1522},{"style":139},[1523],{"type":37,"value":1524},"(request.url);\n",{"type":32,"tag":79,"props":1526,"children":1527},{"class":81,"line":226},[1528,1532,1537,1541,1546,1551,1555,1560],{"type":32,"tag":79,"props":1529,"children":1530},{"style":128},[1531],{"type":37,"value":1501},{"type":32,"tag":79,"props":1533,"children":1534},{"style":287},[1535],{"type":37,"value":1536}," productId",{"type":32,"tag":79,"props":1538,"children":1539},{"style":128},[1540],{"type":37,"value":630},{"type":32,"tag":79,"props":1542,"children":1543},{"style":139},[1544],{"type":37,"value":1545}," url.searchParams.",{"type":32,"tag":79,"props":1547,"children":1548},{"style":86},[1549],{"type":37,"value":1550},"get",{"type":32,"tag":79,"props":1552,"children":1553},{"style":139},[1554],{"type":37,"value":255},{"type":32,"tag":79,"props":1556,"children":1557},{"style":92},[1558],{"type":37,"value":1559},"'id'",{"type":32,"tag":79,"props":1561,"children":1562},{"style":139},[1563],{"type":37,"value":1564},");\n",{"type":32,"tag":79,"props":1566,"children":1567},{"class":81,"line":235},[1568],{"type":32,"tag":79,"props":1569,"children":1570},{"style":139},[1571],{"type":37,"value":1572},"    \n",{"type":32,"tag":79,"props":1574,"children":1575},{"class":81,"line":244},[1576,1580,1585,1589,1594,1599,1604],{"type":32,"tag":79,"props":1577,"children":1578},{"style":128},[1579],{"type":37,"value":1501},{"type":32,"tag":79,"props":1581,"children":1582},{"style":287},[1583],{"type":37,"value":1584}," cacheKey",{"type":32,"tag":79,"props":1586,"children":1587},{"style":128},[1588],{"type":37,"value":630},{"type":32,"tag":79,"props":1590,"children":1591},{"style":92},[1592],{"type":37,"value":1593}," `product:${",{"type":32,"tag":79,"props":1595,"children":1596},{"style":139},[1597],{"type":37,"value":1598},"productId",{"type":32,"tag":79,"props":1600,"children":1601},{"style":92},[1602],{"type":37,"value":1603},"}`",{"type":32,"tag":79,"props":1605,"children":1606},{"style":139},[1607],{"type":37,"value":142},{"type":32,"tag":79,"props":1609,"children":1610},{"class":81,"line":268},[1611,1616,1621,1626,1630,1635],{"type":32,"tag":79,"props":1612,"children":1613},{"style":128},[1614],{"type":37,"value":1615},"    await",{"type":32,"tag":79,"props":1617,"children":1618},{"style":139},[1619],{"type":37,"value":1620}," env.",{"type":32,"tag":79,"props":1622,"children":1623},{"style":287},[1624],{"type":37,"value":1625},"CACHE_KV",{"type":32,"tag":79,"props":1627,"children":1628},{"style":139},[1629],{"type":37,"value":721},{"type":32,"tag":79,"props":1631,"children":1632},{"style":86},[1633],{"type":37,"value":1634},"delete",{"type":32,"tag":79,"props":1636,"children":1637},{"style":139},[1638],{"type":37,"value":1639},"(cacheKey);\n",{"type":32,"tag":79,"props":1641,"children":1642},{"class":81,"line":26},[1643],{"type":32,"tag":79,"props":1644,"children":1645},{"style":139},[1646],{"type":37,"value":1572},{"type":32,"tag":79,"props":1648,"children":1649},{"class":81,"line":306},[1650,1655,1659,1664,1668,1673,1678,1683],{"type":32,"tag":79,"props":1651,"children":1652},{"style":128},[1653],{"type":37,"value":1654},"    return",{"type":32,"tag":79,"props":1656,"children":1657},{"style":128},[1658],{"type":37,"value":635},{"type":32,"tag":79,"props":1660,"children":1661},{"style":86},[1662],{"type":37,"value":1663}," Response",{"type":32,"tag":79,"props":1665,"children":1666},{"style":139},[1667],{"type":37,"value":255},{"type":32,"tag":79,"props":1669,"children":1670},{"style":92},[1671],{"type":37,"value":1672},"'Cache purged'",{"type":32,"tag":79,"props":1674,"children":1675},{"style":139},[1676],{"type":37,"value":1677},", { status: ",{"type":32,"tag":79,"props":1679,"children":1680},{"style":287},[1681],{"type":37,"value":1682},"200",{"type":32,"tag":79,"props":1684,"children":1685},{"style":139},[1686],{"type":37,"value":1687}," });\n",{"type":32,"tag":79,"props":1689,"children":1690},{"class":81,"line":315},[1691],{"type":32,"tag":79,"props":1692,"children":1693},{"style":139},[1694],{"type":37,"value":339},{"type":32,"tag":79,"props":1696,"children":1697},{"class":81,"line":324},[1698],{"type":32,"tag":79,"props":1699,"children":1700},{"style":139},[1701],{"type":37,"value":1702},"};\n",{"type":32,"tag":33,"props":1704,"children":1705},{},[1706],{"type":37,"value":1707},"Mise à jour prix panel admin → webhook → Cloudflare Worker → suppression KV. Le TTL edge cache est préservé, seuls les produits modifiés sont invalidés.",{"type":32,"tag":49,"props":1709,"children":1711},{"id":1710},"suivi-de-la-performance-et-prévention-des-régressions",[1712],{"type":37,"value":1713},"Suivi de la performance et prévention des régressions",{"type":32,"tag":33,"props":1715,"children":1716},{},[1717],{"type":37,"value":1718},"Pour RUM (Real User Monitoring), nous utilisons Cloudflare Web Analytics + beacon Navigation Timing personnalisé :",{"type":32,"tag":69,"props":1720,"children":1722},{"code":1721,"language":117,"meta":16,"className":118,"style":16},"\u002F\u002F plugins\u002Fanalytics.client.ts\nexport default defineNuxtPlugin(() => {\n  if (typeof window !== 'undefined') {\n    window.addEventListener('load', () => {\n      const perfData = performance.getEntriesByType('navigation')[0];\n      const lcp = performance.getEntriesByType('largest-contentful-paint')[0];\n      \n      fetch('\u002Fapi\u002Fperf', {\n        method: 'POST',\n        body: JSON.stringify({\n          ttfb: perfData.responseStart - perfData.requestStart,\n          fcp: perfData.domContentLoadedEventEnd - perfData.fetchStart,\n          lcp: lcp?.renderTime || 0,\n          pathname: window.location.pathname\n        })\n      });\n    });\n  }\n});\n",[1723],{"type":32,"tag":40,"props":1724,"children":1725},{"__ignoreMap":16},[1726,1734,1762,1798,1833,1883,1928,1936,1958,1976,2002,2020,2037,2059,2067,2075,2083,2091,2098],{"type":32,"tag":79,"props":1727,"children":1728},{"class":81,"line":82},[1729],{"type":32,"tag":79,"props":1730,"children":1731},{"style":411},[1732],{"type":37,"value":1733},"\u002F\u002F plugins\u002Fanalytics.client.ts\n",{"type":32,"tag":79,"props":1735,"children":1736},{"class":81,"line":189},[1737,1741,1745,1749,1754,1758],{"type":32,"tag":79,"props":1738,"children":1739},{"style":128},[1740],{"type":37,"value":171},{"type":32,"tag":79,"props":1742,"children":1743},{"style":128},[1744],{"type":37,"value":176},{"type":32,"tag":79,"props":1746,"children":1747},{"style":86},[1748],{"type":37,"value":518},{"type":32,"tag":79,"props":1750,"children":1751},{"style":139},[1752],{"type":37,"value":1753},"(() ",{"type":32,"tag":79,"props":1755,"children":1756},{"style":128},[1757],{"type":37,"value":539},{"type":32,"tag":79,"props":1759,"children":1760},{"style":139},[1761],{"type":37,"value":544},{"type":32,"tag":79,"props":1763,"children":1764},{"class":81,"line":208},[1765,1770,1774,1779,1784,1789,1794],{"type":32,"tag":79,"props":1766,"children":1767},{"style":128},[1768],{"type":37,"value":1769},"  if",{"type":32,"tag":79,"props":1771,"children":1772},{"style":139},[1773],{"type":37,"value":587},{"type":32,"tag":79,"props":1775,"children":1776},{"style":128},[1777],{"type":37,"value":1778},"typeof",{"type":32,"tag":79,"props":1780,"children":1781},{"style":139},[1782],{"type":37,"value":1783}," window ",{"type":32,"tag":79,"props":1785,"children":1786},{"style":128},[1787],{"type":37,"value":1788},"!==",{"type":32,"tag":79,"props":1790,"children":1791},{"style":92},[1792],{"type":37,"value":1793}," 'undefined'",{"type":32,"tag":79,"props":1795,"children":1796},{"style":139},[1797],{"type":37,"value":612},{"type":32,"tag":79,"props":1799,"children":1800},{"class":81,"line":217},[1801,1806,1811,1815,1820,1825,1829],{"type":32,"tag":79,"props":1802,"children":1803},{"style":139},[1804],{"type":37,"value":1805},"    window.",{"type":32,"tag":79,"props":1807,"children":1808},{"style":86},[1809],{"type":37,"value":1810},"addEventListener",{"type":32,"tag":79,"props":1812,"children":1813},{"style":139},[1814],{"type":37,"value":255},{"type":32,"tag":79,"props":1816,"children":1817},{"style":92},[1818],{"type":37,"value":1819},"'load'",{"type":32,"tag":79,"props":1821,"children":1822},{"style":139},[1823],{"type":37,"value":1824},", () ",{"type":32,"tag":79,"props":1826,"children":1827},{"style":128},[1828],{"type":37,"value":539},{"type":32,"tag":79,"props":1830,"children":1831},{"style":139},[1832],{"type":37,"value":544},{"type":32,"tag":79,"props":1834,"children":1835},{"class":81,"line":226},[1836,1841,1846,1850,1855,1860,1864,1869,1874,1878],{"type":32,"tag":79,"props":1837,"children":1838},{"style":128},[1839],{"type":37,"value":1840},"      const",{"type":32,"tag":79,"props":1842,"children":1843},{"style":287},[1844],{"type":37,"value":1845}," perfData",{"type":32,"tag":79,"props":1847,"children":1848},{"style":128},[1849],{"type":37,"value":630},{"type":32,"tag":79,"props":1851,"children":1852},{"style":139},[1853],{"type":37,"value":1854}," performance.",{"type":32,"tag":79,"props":1856,"children":1857},{"style":86},[1858],{"type":37,"value":1859},"getEntriesByType",{"type":32,"tag":79,"props":1861,"children":1862},{"style":139},[1863],{"type":37,"value":255},{"type":32,"tag":79,"props":1865,"children":1866},{"style":92},[1867],{"type":37,"value":1868},"'navigation'",{"type":32,"tag":79,"props":1870,"children":1871},{"style":139},[1872],{"type":37,"value":1873},")[",{"type":32,"tag":79,"props":1875,"children":1876},{"style":287},[1877],{"type":37,"value":1046},{"type":32,"tag":79,"props":1879,"children":1880},{"style":139},[1881],{"type":37,"value":1882},"];\n",{"type":32,"tag":79,"props":1884,"children":1885},{"class":81,"line":235},[1886,1890,1895,1899,1903,1907,1911,1916,1920,1924],{"type":32,"tag":79,"props":1887,"children":1888},{"style":128},[1889],{"type":37,"value":1840},{"type":32,"tag":79,"props":1891,"children":1892},{"style":287},[1893],{"type":37,"value":1894}," lcp",{"type":32,"tag":79,"props":1896,"children":1897},{"style":128},[1898],{"type":37,"value":630},{"type":32,"tag":79,"props":1900,"children":1901},{"style":139},[1902],{"type":37,"value":1854},{"type":32,"tag":79,"props":1904,"children":1905},{"style":86},[1906],{"type":37,"value":1859},{"type":32,"tag":79,"props":1908,"children":1909},{"style":139},[1910],{"type":37,"value":255},{"type":32,"tag":79,"props":1912,"children":1913},{"style":92},[1914],{"type":37,"value":1915},"'largest-contentful-paint'",{"type":32,"tag":79,"props":1917,"children":1918},{"style":139},[1919],{"type":37,"value":1873},{"type":32,"tag":79,"props":1921,"children":1922},{"style":287},[1923],{"type":37,"value":1046},{"type":32,"tag":79,"props":1925,"children":1926},{"style":139},[1927],{"type":37,"value":1882},{"type":32,"tag":79,"props":1929,"children":1930},{"class":81,"line":244},[1931],{"type":32,"tag":79,"props":1932,"children":1933},{"style":139},[1934],{"type":37,"value":1935},"      \n",{"type":32,"tag":79,"props":1937,"children":1938},{"class":81,"line":268},[1939,1944,1948,1953],{"type":32,"tag":79,"props":1940,"children":1941},{"style":86},[1942],{"type":37,"value":1943},"      fetch",{"type":32,"tag":79,"props":1945,"children":1946},{"style":139},[1947],{"type":37,"value":255},{"type":32,"tag":79,"props":1949,"children":1950},{"style":92},[1951],{"type":37,"value":1952},"'\u002Fapi\u002Fperf'",{"type":32,"tag":79,"props":1954,"children":1955},{"style":139},[1956],{"type":37,"value":1957},", {\n",{"type":32,"tag":79,"props":1959,"children":1960},{"class":81,"line":26},[1961,1966,1971],{"type":32,"tag":79,"props":1962,"children":1963},{"style":139},[1964],{"type":37,"value":1965},"        method: ",{"type":32,"tag":79,"props":1967,"children":1968},{"style":92},[1969],{"type":37,"value":1970},"'POST'",{"type":32,"tag":79,"props":1972,"children":1973},{"style":139},[1974],{"type":37,"value":1975},",\n",{"type":32,"tag":79,"props":1977,"children":1978},{"class":81,"line":306},[1979,1984,1989,1993,1998],{"type":32,"tag":79,"props":1980,"children":1981},{"style":139},[1982],{"type":37,"value":1983},"        body: ",{"type":32,"tag":79,"props":1985,"children":1986},{"style":287},[1987],{"type":37,"value":1988},"JSON",{"type":32,"tag":79,"props":1990,"children":1991},{"style":139},[1992],{"type":37,"value":721},{"type":32,"tag":79,"props":1994,"children":1995},{"style":86},[1996],{"type":37,"value":1997},"stringify",{"type":32,"tag":79,"props":1999,"children":2000},{"style":139},[2001],{"type":37,"value":186},{"type":32,"tag":79,"props":2003,"children":2004},{"class":81,"line":315},[2005,2010,2015],{"type":32,"tag":79,"props":2006,"children":2007},{"style":139},[2008],{"type":37,"value":2009},"          ttfb: perfData.responseStart ",{"type":32,"tag":79,"props":2011,"children":2012},{"style":128},[2013],{"type":37,"value":2014},"-",{"type":32,"tag":79,"props":2016,"children":2017},{"style":139},[2018],{"type":37,"value":2019}," perfData.requestStart,\n",{"type":32,"tag":79,"props":2021,"children":2022},{"class":81,"line":324},[2023,2028,2032],{"type":32,"tag":79,"props":2024,"children":2025},{"style":139},[2026],{"type":37,"value":2027},"          fcp: perfData.domContentLoadedEventEnd ",{"type":32,"tag":79,"props":2029,"children":2030},{"style":128},[2031],{"type":37,"value":2014},{"type":32,"tag":79,"props":2033,"children":2034},{"style":139},[2035],{"type":37,"value":2036}," perfData.fetchStart,\n",{"type":32,"tag":79,"props":2038,"children":2039},{"class":81,"line":333},[2040,2045,2050,2055],{"type":32,"tag":79,"props":2041,"children":2042},{"style":139},[2043],{"type":37,"value":2044},"          lcp: lcp?.renderTime ",{"type":32,"tag":79,"props":2046,"children":2047},{"style":128},[2048],{"type":37,"value":2049},"||",{"type":32,"tag":79,"props":2051,"children":2052},{"style":287},[2053],{"type":37,"value":2054}," 0",{"type":32,"tag":79,"props":2056,"children":2057},{"style":139},[2058],{"type":37,"value":1975},{"type":32,"tag":79,"props":2060,"children":2061},{"class":81,"line":342},[2062],{"type":32,"tag":79,"props":2063,"children":2064},{"style":139},[2065],{"type":37,"value":2066},"          pathname: window.location.pathname\n",{"type":32,"tag":79,"props":2068,"children":2069},{"class":81,"line":801},[2070],{"type":32,"tag":79,"props":2071,"children":2072},{"style":139},[2073],{"type":37,"value":2074},"        })\n",{"type":32,"tag":79,"props":2076,"children":2077},{"class":81,"line":809},[2078],{"type":32,"tag":79,"props":2079,"children":2080},{"style":139},[2081],{"type":37,"value":2082},"      });\n",{"type":32,"tag":79,"props":2084,"children":2085},{"class":81,"line":817},[2086],{"type":32,"tag":79,"props":2087,"children":2088},{"style":139},[2089],{"type":37,"value":2090},"    });\n",{"type":32,"tag":79,"props":2092,"children":2093},{"class":81,"line":826},[2094],{"type":32,"tag":79,"props":2095,"children":2096},{"style":139},[2097],{"type":37,"value":339},{"type":32,"tag":79,"props":2099,"children":2101},{"class":81,"line":2100},19,[2102],{"type":32,"tag":79,"props":2103,"children":2104},{"style":139},[2105],{"type":37,"value":348},{"type":32,"tag":33,"props":2107,"children":2108},{},[2109],{"type":37,"value":2110},"Suivi P75 LCP quotidien dans BigQuery. Alerte Slack si le seuil de 2,5s est dépassé. Pipeline CI\u002FCD avec Lighthouse CI pour vérifier les régressions :",{"type":32,"tag":69,"props":2112,"children":2116},{"code":2113,"language":2114,"meta":16,"className":2115,"style":16},"# .github\u002Fworkflows\u002Flighthouse.yml\n- name: Lighthouse CI\n  run: |\n    npm install -g @lhci\u002Fcli\n    lhci autorun --config=.\u002Flighthouserc.json\n","yaml","language-yaml shiki shiki-themes github-dark",[2117],{"type":32,"tag":40,"props":2118,"children":2119},{"__ignoreMap":16},[2120,2128,2150,2167,2175],{"type":32,"tag":79,"props":2121,"children":2122},{"class":81,"line":82},[2123],{"type":32,"tag":79,"props":2124,"children":2125},{"style":411},[2126],{"type":37,"value":2127},"# .github\u002Fworkflows\u002Flighthouse.yml\n",{"type":32,"tag":79,"props":2129,"children":2130},{"class":81,"line":189},[2131,2136,2141,2145],{"type":32,"tag":79,"props":2132,"children":2133},{"style":139},[2134],{"type":37,"value":2135},"- ",{"type":32,"tag":79,"props":2137,"children":2138},{"style":425},[2139],{"type":37,"value":2140},"name",{"type":32,"tag":79,"props":2142,"children":2143},{"style":139},[2144],{"type":37,"value":284},{"type":32,"tag":79,"props":2146,"children":2147},{"style":92},[2148],{"type":37,"value":2149},"Lighthouse CI\n",{"type":32,"tag":79,"props":2151,"children":2152},{"class":81,"line":208},[2153,2158,2162],{"type":32,"tag":79,"props":2154,"children":2155},{"style":425},[2156],{"type":37,"value":2157},"  run",{"type":32,"tag":79,"props":2159,"children":2160},{"style":139},[2161],{"type":37,"value":284},{"type":32,"tag":79,"props":2163,"children":2164},{"style":128},[2165],{"type":37,"value":2166},"|\n",{"type":32,"tag":79,"props":2168,"children":2169},{"class":81,"line":217},[2170],{"type":32,"tag":79,"props":2171,"children":2172},{"style":92},[2173],{"type":37,"value":2174},"    npm install -g @lhci\u002Fcli\n",{"type":32,"tag":79,"props":2176,"children":2177},{"class":81,"line":226},[2178],{"type":32,"tag":79,"props":2179,"children":2180},{"style":92},[2181],{"type":37,"value":2182},"    lhci autorun --config=.\u002Flighthouserc.json\n",{"type":32,"tag":33,"props":2184,"children":2185},{},[2186,2188,2194],{"type":37,"value":2187},"Assertions LCP dans ",{"type":32,"tag":40,"props":2189,"children":2191},{"className":2190},[],[2192],{"type":37,"value":2193},"lighthouserc.json",{"type":37,"value":113},{"type":32,"tag":69,"props":2196,"children":2200},{"code":2197,"language":2198,"meta":16,"className":2199,"style":16},"{\n  \"ci\": {\n    \"assert\": {\n      \"assertions\": {\n        \"largest-contentful-paint\": [\"error\", { \"maxNumericValue\": 2500 }]\n      }\n    }\n  }\n}\n","json","language-json shiki shiki-themes github-dark",[2201],{"type":32,"tag":40,"props":2202,"children":2203},{"__ignoreMap":16},[2204,2212,2225,2237,2249,2291,2298,2305,2312],{"type":32,"tag":79,"props":2205,"children":2206},{"class":81,"line":82},[2207],{"type":32,"tag":79,"props":2208,"children":2209},{"style":139},[2210],{"type":37,"value":2211},"{\n",{"type":32,"tag":79,"props":2213,"children":2214},{"class":81,"line":189},[2215,2220],{"type":32,"tag":79,"props":2216,"children":2217},{"style":287},[2218],{"type":37,"value":2219},"  \"ci\"",{"type":32,"tag":79,"props":2221,"children":2222},{"style":139},[2223],{"type":37,"value":2224},": {\n",{"type":32,"tag":79,"props":2226,"children":2227},{"class":81,"line":208},[2228,2233],{"type":32,"tag":79,"props":2229,"children":2230},{"style":287},[2231],{"type":37,"value":2232},"    \"assert\"",{"type":32,"tag":79,"props":2234,"children":2235},{"style":139},[2236],{"type":37,"value":2224},{"type":32,"tag":79,"props":2238,"children":2239},{"class":81,"line":217},[2240,2245],{"type":32,"tag":79,"props":2241,"children":2242},{"style":287},[2243],{"type":37,"value":2244},"      \"assertions\"",{"type":32,"tag":79,"props":2246,"children":2247},{"style":139},[2248],{"type":37,"value":2224},{"type":32,"tag":79,"props":2250,"children":2251},{"class":81,"line":226},[2252,2257,2262,2267,2272,2277,2281,2286],{"type":32,"tag":79,"props":2253,"children":2254},{"style":287},[2255],{"type":37,"value":2256},"        \"largest-contentful-paint\"",{"type":32,"tag":79,"props":2258,"children":2259},{"style":139},[2260],{"type":37,"value":2261},": [",{"type":32,"tag":79,"props":2263,"children":2264},{"style":92},[2265],{"type":37,"value":2266},"\"error\"",{"type":32,"tag":79,"props":2268,"children":2269},{"style":139},[2270],{"type":37,"value":2271},", { ",{"type":32,"tag":79,"props":2273,"children":2274},{"style":287},[2275],{"type":37,"value":2276},"\"maxNumericValue\"",{"type":32,"tag":79,"props":2278,"children":2279},{"style":139},[2280],{"type":37,"value":284},{"type":32,"tag":79,"props":2282,"children":2283},{"style":287},[2284],{"type":37,"value":2285},"2500",{"type":32,"tag":79,"props":2287,"children":2288},{"style":139},[2289],{"type":37,"value":2290}," }]\n",{"type":32,"tag":79,"props":2292,"children":2293},{"class":81,"line":235},[2294],{"type":32,"tag":79,"props":2295,"children":2296},{"style":139},[2297],{"type":37,"value":321},{"type":32,"tag":79,"props":2299,"children":2300},{"class":81,"line":244},[2301],{"type":32,"tag":79,"props":2302,"children":2303},{"style":139},[2304],{"type":37,"value":330},{"type":32,"tag":79,"props":2306,"children":2307},{"class":81,"line":268},[2308],{"type":32,"tag":79,"props":2309,"children":2310},{"style":139},[2311],{"type":37,"value":339},{"type":32,"tag":79,"props":2313,"children":2314},{"class":81,"line":26},[2315],{"type":32,"tag":79,"props":2316,"children":2317},{"style":139},[2318],{"type":37,"value":1068},{"type":32,"tag":33,"props":2320,"children":2321},{},[2322],{"type":37,"value":2323},"Si le LCP dépasse 2,5s avant le déploiement, la build échoue. Regréssion en production évitée.",{"type":32,"tag":49,"props":2325,"children":2327},{"id":2326},"compromis-et-cas-limites",[2328],{"type":37,"value":2329},"Compromis et cas limites",{"type":32,"tag":33,"props":2331,"children":2332},{},[2333,2335,2341],{"type":37,"value":2334},"Lazy hydration dépend de la position du scroll. Si l'utilisateur fait défiler rapidement, le délai d'hydration peut affecter l'interactivité. Atténuation : déclencher Intersection Observer avec ",{"type":32,"tag":40,"props":2336,"children":2338},{"className":2337},[],[2339],{"type":37,"value":2340},"rootMargin: '100px'",{"type":37,"value":2342}," avant que l'élément n'entre dans le viewport.",{"type":32,"tag":33,"props":2344,"children":2345},{},[2346,2351,2353,2359,2361,2366],{"type":32,"tag":40,"props":2347,"children":2349},{"className":2348},[],[2350],{"type":37,"value":45},{"type":37,"value":2352}," sur les grilles peut augmenter CLS lors d'un changement de compte de colonnes. Combinaison obligatoire : ",{"type":32,"tag":40,"props":2354,"children":2356},{"className":2355},[],[2357],{"type":37,"value":2358},"grid-template-columns",{"type":37,"value":2360}," fixe + ",{"type":32,"tag":40,"props":2362,"children":2364},{"className":2363},[],[2365],{"type":37,"value":1077},{"type":37,"value":721},{"type":32,"tag":33,"props":2368,"children":2369},{},[2370],{"type":37,"value":2371},"Risque d'incohérence prix avec edge cache stale-while-revalidate : utilisateur A voit l'ancien prix, utilisateur B le nouveau. Décision selon exigence métier : e-commerce accepte 60 secondes de fenêtre stale, fintech non.",{"type":32,"tag":33,"props":2373,"children":2374},{},[2375],{"type":37,"value":2376},"Vérification de la licence de la font auto-hébergée requise. Google Fonts sous licence SIL Open Font libre d'utilisation, les fonts commerciales nécessitent vérification d'accord de licence.",{"type":32,"tag":33,"props":2378,"children":2379},{},[2380],{"type":37,"value":2381},"Ces quatre interventions ont amélioré le LCP de 80%. Le système de réactivité Vue 3 de Nuxt 3 est idéal pour lazy hydration. Le réseau edge de Cloudflare Pages est suffisant comme CDN, mais pour le contenu dynamique, la combinaison KV + Workers fournit la granularité de cache. En production, RUM + Lighthouse CI sont obligatoires pour prévenir les régressions.",{"type":32,"tag":2383,"props":2384,"children":2385},"style",{},[2386],{"type":37,"value":2387},"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);}",{"title":16,"searchDepth":208,"depth":208,"links":2389},[2390,2391,2394,2395,2398,2399],{"id":51,"depth":189,"text":54},{"id":369,"depth":189,"text":372,"children":2392},[2393],{"id":853,"depth":208,"text":856},{"id":971,"depth":189,"text":974},{"id":1336,"depth":189,"text":1339,"children":2396},[2397],{"id":1419,"depth":208,"text":1422},{"id":1710,"depth":189,"text":1713},{"id":2326,"depth":189,"text":2329},"markdown","content:fr:tech:nuxt-3-cloudflare-pages-10s-lcp-vers-2s.md","content","fr\u002Ftech\u002Fnuxt-3-cloudflare-pages-10s-lcp-vers-2s.md","fr\u002Ftech\u002Fnuxt-3-cloudflare-pages-10s-lcp-vers-2s","md",1782079493631]