[{"data":1,"prerenderedAt":3025},["ShallowReactive",2],{"article-alternates":3,"article-\u002Fes\u002Ftech\u002Fpresupuestos-rendimiento-web-conectar-decision":13},{"i18nKey":4,"paths":5},"tech-004-2026-07",{"de":6,"en":7,"es":8,"fr":9,"it":10,"ru":11,"tr":12},"\u002Fde\u002Ftech\u002Fweb-performance-budgets-in-ci-cd","\u002Fen\u002Ftech\u002Fweb-performance-budgets-decision-framework","\u002Fes\u002Ftech\u002Fpresupuestos-rendimiento-web-conectar-decision","\u002Ffr\u002Ftech\u002Fbudgets-de-performance-web-mecanismes-de-decision","\u002Fit\u002Ftech\u002Fweb-performance-budget-decision-mechanism","\u002Fru\u002Ftech\u002Fpresupuesti-proizvodstva-integraciya-v-pipeline","\u002Ftr\u002Ftech\u002Fweb-performance-budgetlari-karar-mekanizmasina-baglamak",{"_path":8,"_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":3019,"_id":3020,"_source":3021,"_file":3022,"_stem":3023,"_extension":3024},"tech",false,"","Presupuestos de Rendimiento Web: Conectarlos al Mecanismo de Decisión","Integra Lighthouse CI, RUM y alarmas de regresión de rendimiento en tu pipeline CI\u002FCD para detener ralentizaciones en el deployment — casos reales de aplicación.","2026-07-30",[21,22,23,24,25],"rendimiento-web","lighthouse-ci","rum","presupuesto-rendimiento","core-web-vitals",8,"Roibase",{"type":29,"children":30,"toc":3010},"root",[31,39,46,51,56,61,74,575,594,600,605,1112,1133,1138,1146,1159,1183,1189,1194,1199,1605,1618,1744,1749,1754,1761,1766,2298,2303,2311,2317,2322,2331,2366,2374,2404,2409,2414,2420,2425,2438,2724,2729,2917,2922,2999,3004],{"type":32,"tag":33,"props":34,"children":35},"element","p",{},[36],{"type":37,"value":38},"text","Descubrir una regresión de rendimiento después de lanzar a producción es como verificar el tipo de cambio después del cambio: demasiado tarde. Según el informe Commerce Signals de Google 2026, cada 100ms adicional en LCP genera un aumento del 3,5% en la tasa de rebote. Así como atrapamos bugs antes del deployment, necesitamos capturar ralentizaciones en el pipeline CI\u002FCD. Este artículo te mostrará cómo integrar Lighthouse CI, RUM, monitoreo sintético y presupuestos de rendimiento — con código y números reales.",{"type":32,"tag":40,"props":41,"children":43},"h2",{"id":42},"qué-es-un-presupuesto-de-rendimiento-y-por-qué-es-obligatorio-en-cicd",[44],{"type":37,"value":45},"Qué es un Presupuesto de Rendimiento y Por Qué es Obligatorio en CI\u002FCD",{"type":32,"tag":33,"props":47,"children":48},{},[49],{"type":37,"value":50},"Un presupuesto de rendimiento es el límite máximo de recursos que una página puede consumir en rendimiento. Ejemplo: \"Homepage: LCP \u003C 2s, Total Blocking Time \u003C 200ms, bundle JS \u003C 400KB\". Funciona como un SLA: si alguno de estos números se supera, el build falla y no llega a producción.",{"type":32,"tag":33,"props":52,"children":53},{},[54],{"type":37,"value":55},"El enfoque clásico — ejecutar un reporte Lighthouse manual al final de cada sprint — detectaría una regresión dos semanas después. En la práctica moderna, el presupuesto está integrado en CI. Cada pull request se ejecuta a través de Lighthouse CI, que renderiza la página en Chromium headless, mide métricas de rendimiento y las compara con el presupuesto. Si lo supera, GitHub Action devuelve error y bloquea el merge.",{"type":32,"tag":33,"props":57,"children":58},{},[59],{"type":37,"value":60},"Caso real: en un storefront Shopify Hydrogen, al agregar un widget de recomendaciones de productos, el tamaño del bundle saltó de 340KB a 510KB. El pipeline CI lo detectó instantáneamente, marcando el PR en rojo. El widget permaneció bloqueado hasta que se optimizó con lazy-loading. Sin esto, habría llegado a producción: 510KB en 3G móvil = 4 segundos adicionales de blocking time — dos días de pérdida hasta el hotfix.",{"type":32,"tag":33,"props":62,"children":63},{},[64,66,72],{"type":37,"value":65},"Usaremos ",{"type":32,"tag":67,"props":68,"children":70},"code",{"className":69},[],[71],{"type":37,"value":22},{"type":37,"value":73}," para configurar presupuestos. Lighthouse CI toma una URL de deployment preview, la renderiza en Chromium, mide Core Web Vitals + métricas personalizadas y los compara con un archivo JSON de presupuesto.",{"type":32,"tag":75,"props":76,"children":80},"pre",{"code":77,"language":78,"meta":16,"className":79,"style":16},"\u002F\u002F lighthouserc.json\n{\n \"ci\": {\n \"assert\": {\n \"preset\": \"lighthouse:recommended\",\n \"assertions\": {\n \"largest-contentful-paint\": [\"error\", { \"maxNumericValue\": 2000 }],\n \"total-blocking-time\": [\"error\", { \"maxNumericValue\": 200 }],\n \"cumulative-layout-shift\": [\"error\", { \"maxNumericValue\": 0.1 }],\n \"speed-index\": [\"error\", { \"maxNumericValue\": 3000 }],\n \"resource-summary:script:size\": [\"error\", { \"maxNumericValue\": 400000 }]\n }\n },\n \"collect\": {\n \"numberOfRuns\": 3,\n \"url\": [\"https:\u002F\u002Fpreview-{PR_NUMBER}.vercel.app\"],\n \"settings\": {\n \"throttling\": {\n \"rttMs\": 150,\n \"throughputKbps\": 1638.4,\n \"cpuSlowdownMultiplier\": 4\n }\n }\n }\n }\n}\n","json","language-json shiki shiki-themes github-dark",[81],{"type":32,"tag":67,"props":82,"children":83},{"__ignoreMap":16},[84,96,106,121,134,159,172,215,252,290,328,367,376,385,398,420,443,456,469,491,513,531,540,548,557,566],{"type":32,"tag":85,"props":86,"children":89},"span",{"class":87,"line":88},"line",1,[90],{"type":32,"tag":85,"props":91,"children":93},{"style":92},"--shiki-default:#6A737D",[94],{"type":37,"value":95},"\u002F\u002F lighthouserc.json\n",{"type":32,"tag":85,"props":97,"children":99},{"class":87,"line":98},2,[100],{"type":32,"tag":85,"props":101,"children":103},{"style":102},"--shiki-default:#E1E4E8",[104],{"type":37,"value":105},"{\n",{"type":32,"tag":85,"props":107,"children":109},{"class":87,"line":108},3,[110,116],{"type":32,"tag":85,"props":111,"children":113},{"style":112},"--shiki-default:#79B8FF",[114],{"type":37,"value":115}," \"ci\"",{"type":32,"tag":85,"props":117,"children":118},{"style":102},[119],{"type":37,"value":120},": {\n",{"type":32,"tag":85,"props":122,"children":124},{"class":87,"line":123},4,[125,130],{"type":32,"tag":85,"props":126,"children":127},{"style":112},[128],{"type":37,"value":129}," \"assert\"",{"type":32,"tag":85,"props":131,"children":132},{"style":102},[133],{"type":37,"value":120},{"type":32,"tag":85,"props":135,"children":137},{"class":87,"line":136},5,[138,143,148,154],{"type":32,"tag":85,"props":139,"children":140},{"style":112},[141],{"type":37,"value":142}," \"preset\"",{"type":32,"tag":85,"props":144,"children":145},{"style":102},[146],{"type":37,"value":147},": ",{"type":32,"tag":85,"props":149,"children":151},{"style":150},"--shiki-default:#9ECBFF",[152],{"type":37,"value":153},"\"lighthouse:recommended\"",{"type":32,"tag":85,"props":155,"children":156},{"style":102},[157],{"type":37,"value":158},",\n",{"type":32,"tag":85,"props":160,"children":162},{"class":87,"line":161},6,[163,168],{"type":32,"tag":85,"props":164,"children":165},{"style":112},[166],{"type":37,"value":167}," \"assertions\"",{"type":32,"tag":85,"props":169,"children":170},{"style":102},[171],{"type":37,"value":120},{"type":32,"tag":85,"props":173,"children":175},{"class":87,"line":174},7,[176,181,186,191,196,201,205,210],{"type":32,"tag":85,"props":177,"children":178},{"style":112},[179],{"type":37,"value":180}," \"largest-contentful-paint\"",{"type":32,"tag":85,"props":182,"children":183},{"style":102},[184],{"type":37,"value":185},": [",{"type":32,"tag":85,"props":187,"children":188},{"style":150},[189],{"type":37,"value":190},"\"error\"",{"type":32,"tag":85,"props":192,"children":193},{"style":102},[194],{"type":37,"value":195},", { ",{"type":32,"tag":85,"props":197,"children":198},{"style":112},[199],{"type":37,"value":200},"\"maxNumericValue\"",{"type":32,"tag":85,"props":202,"children":203},{"style":102},[204],{"type":37,"value":147},{"type":32,"tag":85,"props":206,"children":207},{"style":112},[208],{"type":37,"value":209},"2000",{"type":32,"tag":85,"props":211,"children":212},{"style":102},[213],{"type":37,"value":214}," }],\n",{"type":32,"tag":85,"props":216,"children":217},{"class":87,"line":26},[218,223,227,231,235,239,243,248],{"type":32,"tag":85,"props":219,"children":220},{"style":112},[221],{"type":37,"value":222}," \"total-blocking-time\"",{"type":32,"tag":85,"props":224,"children":225},{"style":102},[226],{"type":37,"value":185},{"type":32,"tag":85,"props":228,"children":229},{"style":150},[230],{"type":37,"value":190},{"type":32,"tag":85,"props":232,"children":233},{"style":102},[234],{"type":37,"value":195},{"type":32,"tag":85,"props":236,"children":237},{"style":112},[238],{"type":37,"value":200},{"type":32,"tag":85,"props":240,"children":241},{"style":102},[242],{"type":37,"value":147},{"type":32,"tag":85,"props":244,"children":245},{"style":112},[246],{"type":37,"value":247},"200",{"type":32,"tag":85,"props":249,"children":250},{"style":102},[251],{"type":37,"value":214},{"type":32,"tag":85,"props":253,"children":255},{"class":87,"line":254},9,[256,261,265,269,273,277,281,286],{"type":32,"tag":85,"props":257,"children":258},{"style":112},[259],{"type":37,"value":260}," \"cumulative-layout-shift\"",{"type":32,"tag":85,"props":262,"children":263},{"style":102},[264],{"type":37,"value":185},{"type":32,"tag":85,"props":266,"children":267},{"style":150},[268],{"type":37,"value":190},{"type":32,"tag":85,"props":270,"children":271},{"style":102},[272],{"type":37,"value":195},{"type":32,"tag":85,"props":274,"children":275},{"style":112},[276],{"type":37,"value":200},{"type":32,"tag":85,"props":278,"children":279},{"style":102},[280],{"type":37,"value":147},{"type":32,"tag":85,"props":282,"children":283},{"style":112},[284],{"type":37,"value":285},"0.1",{"type":32,"tag":85,"props":287,"children":288},{"style":102},[289],{"type":37,"value":214},{"type":32,"tag":85,"props":291,"children":293},{"class":87,"line":292},10,[294,299,303,307,311,315,319,324],{"type":32,"tag":85,"props":295,"children":296},{"style":112},[297],{"type":37,"value":298}," \"speed-index\"",{"type":32,"tag":85,"props":300,"children":301},{"style":102},[302],{"type":37,"value":185},{"type":32,"tag":85,"props":304,"children":305},{"style":150},[306],{"type":37,"value":190},{"type":32,"tag":85,"props":308,"children":309},{"style":102},[310],{"type":37,"value":195},{"type":32,"tag":85,"props":312,"children":313},{"style":112},[314],{"type":37,"value":200},{"type":32,"tag":85,"props":316,"children":317},{"style":102},[318],{"type":37,"value":147},{"type":32,"tag":85,"props":320,"children":321},{"style":112},[322],{"type":37,"value":323},"3000",{"type":32,"tag":85,"props":325,"children":326},{"style":102},[327],{"type":37,"value":214},{"type":32,"tag":85,"props":329,"children":331},{"class":87,"line":330},11,[332,337,341,345,349,353,357,362],{"type":32,"tag":85,"props":333,"children":334},{"style":112},[335],{"type":37,"value":336}," \"resource-summary:script:size\"",{"type":32,"tag":85,"props":338,"children":339},{"style":102},[340],{"type":37,"value":185},{"type":32,"tag":85,"props":342,"children":343},{"style":150},[344],{"type":37,"value":190},{"type":32,"tag":85,"props":346,"children":347},{"style":102},[348],{"type":37,"value":195},{"type":32,"tag":85,"props":350,"children":351},{"style":112},[352],{"type":37,"value":200},{"type":32,"tag":85,"props":354,"children":355},{"style":102},[356],{"type":37,"value":147},{"type":32,"tag":85,"props":358,"children":359},{"style":112},[360],{"type":37,"value":361},"400000",{"type":32,"tag":85,"props":363,"children":364},{"style":102},[365],{"type":37,"value":366}," }]\n",{"type":32,"tag":85,"props":368,"children":370},{"class":87,"line":369},12,[371],{"type":32,"tag":85,"props":372,"children":373},{"style":102},[374],{"type":37,"value":375}," }\n",{"type":32,"tag":85,"props":377,"children":379},{"class":87,"line":378},13,[380],{"type":32,"tag":85,"props":381,"children":382},{"style":102},[383],{"type":37,"value":384}," },\n",{"type":32,"tag":85,"props":386,"children":388},{"class":87,"line":387},14,[389,394],{"type":32,"tag":85,"props":390,"children":391},{"style":112},[392],{"type":37,"value":393}," \"collect\"",{"type":32,"tag":85,"props":395,"children":396},{"style":102},[397],{"type":37,"value":120},{"type":32,"tag":85,"props":399,"children":401},{"class":87,"line":400},15,[402,407,411,416],{"type":32,"tag":85,"props":403,"children":404},{"style":112},[405],{"type":37,"value":406}," \"numberOfRuns\"",{"type":32,"tag":85,"props":408,"children":409},{"style":102},[410],{"type":37,"value":147},{"type":32,"tag":85,"props":412,"children":413},{"style":112},[414],{"type":37,"value":415},"3",{"type":32,"tag":85,"props":417,"children":418},{"style":102},[419],{"type":37,"value":158},{"type":32,"tag":85,"props":421,"children":423},{"class":87,"line":422},16,[424,429,433,438],{"type":32,"tag":85,"props":425,"children":426},{"style":112},[427],{"type":37,"value":428}," \"url\"",{"type":32,"tag":85,"props":430,"children":431},{"style":102},[432],{"type":37,"value":185},{"type":32,"tag":85,"props":434,"children":435},{"style":150},[436],{"type":37,"value":437},"\"https:\u002F\u002Fpreview-{PR_NUMBER}.vercel.app\"",{"type":32,"tag":85,"props":439,"children":440},{"style":102},[441],{"type":37,"value":442},"],\n",{"type":32,"tag":85,"props":444,"children":446},{"class":87,"line":445},17,[447,452],{"type":32,"tag":85,"props":448,"children":449},{"style":112},[450],{"type":37,"value":451}," \"settings\"",{"type":32,"tag":85,"props":453,"children":454},{"style":102},[455],{"type":37,"value":120},{"type":32,"tag":85,"props":457,"children":459},{"class":87,"line":458},18,[460,465],{"type":32,"tag":85,"props":461,"children":462},{"style":112},[463],{"type":37,"value":464}," \"throttling\"",{"type":32,"tag":85,"props":466,"children":467},{"style":102},[468],{"type":37,"value":120},{"type":32,"tag":85,"props":470,"children":472},{"class":87,"line":471},19,[473,478,482,487],{"type":32,"tag":85,"props":474,"children":475},{"style":112},[476],{"type":37,"value":477}," \"rttMs\"",{"type":32,"tag":85,"props":479,"children":480},{"style":102},[481],{"type":37,"value":147},{"type":32,"tag":85,"props":483,"children":484},{"style":112},[485],{"type":37,"value":486},"150",{"type":32,"tag":85,"props":488,"children":489},{"style":102},[490],{"type":37,"value":158},{"type":32,"tag":85,"props":492,"children":494},{"class":87,"line":493},20,[495,500,504,509],{"type":32,"tag":85,"props":496,"children":497},{"style":112},[498],{"type":37,"value":499}," \"throughputKbps\"",{"type":32,"tag":85,"props":501,"children":502},{"style":102},[503],{"type":37,"value":147},{"type":32,"tag":85,"props":505,"children":506},{"style":112},[507],{"type":37,"value":508},"1638.4",{"type":32,"tag":85,"props":510,"children":511},{"style":102},[512],{"type":37,"value":158},{"type":32,"tag":85,"props":514,"children":516},{"class":87,"line":515},21,[517,522,526],{"type":32,"tag":85,"props":518,"children":519},{"style":112},[520],{"type":37,"value":521}," \"cpuSlowdownMultiplier\"",{"type":32,"tag":85,"props":523,"children":524},{"style":102},[525],{"type":37,"value":147},{"type":32,"tag":85,"props":527,"children":528},{"style":112},[529],{"type":37,"value":530},"4\n",{"type":32,"tag":85,"props":532,"children":534},{"class":87,"line":533},22,[535],{"type":32,"tag":85,"props":536,"children":537},{"style":102},[538],{"type":37,"value":539}," }\n",{"type":32,"tag":85,"props":541,"children":543},{"class":87,"line":542},23,[544],{"type":32,"tag":85,"props":545,"children":546},{"style":102},[547],{"type":37,"value":375},{"type":32,"tag":85,"props":549,"children":551},{"class":87,"line":550},24,[552],{"type":32,"tag":85,"props":553,"children":554},{"style":102},[555],{"type":37,"value":556}," }\n",{"type":32,"tag":85,"props":558,"children":560},{"class":87,"line":559},25,[561],{"type":32,"tag":85,"props":562,"children":563},{"style":102},[564],{"type":37,"value":565}," }\n",{"type":32,"tag":85,"props":567,"children":569},{"class":87,"line":568},26,[570],{"type":32,"tag":85,"props":571,"children":572},{"style":102},[573],{"type":37,"value":574},"}\n",{"type":32,"tag":33,"props":576,"children":577},{},[578,584,586,592],{"type":32,"tag":67,"props":579,"children":581},{"className":580},[],[582],{"type":37,"value":583},"numberOfRuns: 3",{"type":37,"value":585}," reduce la variabilidad; toma la mediana. ",{"type":32,"tag":67,"props":587,"children":589},{"className":588},[],[590],{"type":37,"value":591},"throttling",{"type":37,"value":593}," simula 3G móvil — el peor escenario del usuario real.",{"type":32,"tag":40,"props":595,"children":597},{"id":596},"automatizar-lighthouse-ci-con-github-actions",[598],{"type":37,"value":599},"Automatizar Lighthouse CI con GitHub Actions",{"type":32,"tag":33,"props":601,"children":602},{},[603],{"type":37,"value":604},"Para ejecutar Lighthouse en el pipeline, usamos Vercel preview deployment + GitHub Actions. Cada PR abierto genera una URL preview automática en Vercel; Lighthouse CI rastrea esa URL. Los resultados aparecen como comentario en el PR. Si el presupuesto se supera, CI falla.",{"type":32,"tag":75,"props":606,"children":610},{"code":607,"language":608,"meta":16,"className":609,"style":16},"# .github\u002Fworkflows\u002Flighthouse.yml\nname: Lighthouse CI\non: [pull_request]\njobs:\n lighthouse:\n runs-on: ubuntu-latest\n steps:\n - uses: actions\u002Fcheckout@v3\n - uses: actions\u002Fsetup-node@v3\n with:\n node-version: '20'\n - run: npm ci\n - run: npm run build\n - name: Wait for Vercel Preview\n uses: patrickedqvist\u002Fwait-for-vercel-preview@v1.3.1\n id: vercel_preview\n with:\n token: ${{ secrets.GITHUB_TOKEN }}\n max_timeout: 300\n - name: Run Lighthouse CI\n env:\n LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_TOKEN }}\n run: |\n npm install -g @lhci\u002Fcli\n lhci autorun --collect.url=${{ steps.vercel_preview.outputs.url }}\n - name: Comment PR\n uses: treosh\u002Flighthouse-ci-action@v9\n with:\n urls: ${{ steps.vercel_preview.outputs.url }}\n uploadArtifacts: true\n temporaryPublicStorage: true\n","yaml","language-yaml shiki shiki-themes github-dark",[611],{"type":32,"tag":67,"props":612,"children":613},{"__ignoreMap":16},[614,622,640,662,675,687,704,716,738,758,770,787,808,828,848,865,882,893,910,927,947,959,976,994,1002,1010,1030,1047,1059,1077,1095],{"type":32,"tag":85,"props":615,"children":616},{"class":87,"line":88},[617],{"type":32,"tag":85,"props":618,"children":619},{"style":92},[620],{"type":37,"value":621},"# .github\u002Fworkflows\u002Flighthouse.yml\n",{"type":32,"tag":85,"props":623,"children":624},{"class":87,"line":98},[625,631,635],{"type":32,"tag":85,"props":626,"children":628},{"style":627},"--shiki-default:#85E89D",[629],{"type":37,"value":630},"name",{"type":32,"tag":85,"props":632,"children":633},{"style":102},[634],{"type":37,"value":147},{"type":32,"tag":85,"props":636,"children":637},{"style":150},[638],{"type":37,"value":639},"Lighthouse CI\n",{"type":32,"tag":85,"props":641,"children":642},{"class":87,"line":108},[643,648,652,657],{"type":32,"tag":85,"props":644,"children":645},{"style":112},[646],{"type":37,"value":647},"on",{"type":32,"tag":85,"props":649,"children":650},{"style":102},[651],{"type":37,"value":185},{"type":32,"tag":85,"props":653,"children":654},{"style":150},[655],{"type":37,"value":656},"pull_request",{"type":32,"tag":85,"props":658,"children":659},{"style":102},[660],{"type":37,"value":661},"]\n",{"type":32,"tag":85,"props":663,"children":664},{"class":87,"line":123},[665,670],{"type":32,"tag":85,"props":666,"children":667},{"style":627},[668],{"type":37,"value":669},"jobs",{"type":32,"tag":85,"props":671,"children":672},{"style":102},[673],{"type":37,"value":674},":\n",{"type":32,"tag":85,"props":676,"children":677},{"class":87,"line":136},[678,683],{"type":32,"tag":85,"props":679,"children":680},{"style":627},[681],{"type":37,"value":682}," lighthouse",{"type":32,"tag":85,"props":684,"children":685},{"style":102},[686],{"type":37,"value":674},{"type":32,"tag":85,"props":688,"children":689},{"class":87,"line":161},[690,695,699],{"type":32,"tag":85,"props":691,"children":692},{"style":627},[693],{"type":37,"value":694}," runs-on",{"type":32,"tag":85,"props":696,"children":697},{"style":102},[698],{"type":37,"value":147},{"type":32,"tag":85,"props":700,"children":701},{"style":150},[702],{"type":37,"value":703},"ubuntu-latest\n",{"type":32,"tag":85,"props":705,"children":706},{"class":87,"line":174},[707,712],{"type":32,"tag":85,"props":708,"children":709},{"style":627},[710],{"type":37,"value":711}," steps",{"type":32,"tag":85,"props":713,"children":714},{"style":102},[715],{"type":37,"value":674},{"type":32,"tag":85,"props":717,"children":718},{"class":87,"line":26},[719,724,729,733],{"type":32,"tag":85,"props":720,"children":721},{"style":102},[722],{"type":37,"value":723}," - ",{"type":32,"tag":85,"props":725,"children":726},{"style":627},[727],{"type":37,"value":728},"uses",{"type":32,"tag":85,"props":730,"children":731},{"style":102},[732],{"type":37,"value":147},{"type":32,"tag":85,"props":734,"children":735},{"style":150},[736],{"type":37,"value":737},"actions\u002Fcheckout@v3\n",{"type":32,"tag":85,"props":739,"children":740},{"class":87,"line":254},[741,745,749,753],{"type":32,"tag":85,"props":742,"children":743},{"style":102},[744],{"type":37,"value":723},{"type":32,"tag":85,"props":746,"children":747},{"style":627},[748],{"type":37,"value":728},{"type":32,"tag":85,"props":750,"children":751},{"style":102},[752],{"type":37,"value":147},{"type":32,"tag":85,"props":754,"children":755},{"style":150},[756],{"type":37,"value":757},"actions\u002Fsetup-node@v3\n",{"type":32,"tag":85,"props":759,"children":760},{"class":87,"line":292},[761,766],{"type":32,"tag":85,"props":762,"children":763},{"style":627},[764],{"type":37,"value":765}," with",{"type":32,"tag":85,"props":767,"children":768},{"style":102},[769],{"type":37,"value":674},{"type":32,"tag":85,"props":771,"children":772},{"class":87,"line":330},[773,778,782],{"type":32,"tag":85,"props":774,"children":775},{"style":627},[776],{"type":37,"value":777}," node-version",{"type":32,"tag":85,"props":779,"children":780},{"style":102},[781],{"type":37,"value":147},{"type":32,"tag":85,"props":783,"children":784},{"style":150},[785],{"type":37,"value":786},"'20'\n",{"type":32,"tag":85,"props":788,"children":789},{"class":87,"line":369},[790,794,799,803],{"type":32,"tag":85,"props":791,"children":792},{"style":102},[793],{"type":37,"value":723},{"type":32,"tag":85,"props":795,"children":796},{"style":627},[797],{"type":37,"value":798},"run",{"type":32,"tag":85,"props":800,"children":801},{"style":102},[802],{"type":37,"value":147},{"type":32,"tag":85,"props":804,"children":805},{"style":150},[806],{"type":37,"value":807},"npm ci\n",{"type":32,"tag":85,"props":809,"children":810},{"class":87,"line":378},[811,815,819,823],{"type":32,"tag":85,"props":812,"children":813},{"style":102},[814],{"type":37,"value":723},{"type":32,"tag":85,"props":816,"children":817},{"style":627},[818],{"type":37,"value":798},{"type":32,"tag":85,"props":820,"children":821},{"style":102},[822],{"type":37,"value":147},{"type":32,"tag":85,"props":824,"children":825},{"style":150},[826],{"type":37,"value":827},"npm run build\n",{"type":32,"tag":85,"props":829,"children":830},{"class":87,"line":387},[831,835,839,843],{"type":32,"tag":85,"props":832,"children":833},{"style":102},[834],{"type":37,"value":723},{"type":32,"tag":85,"props":836,"children":837},{"style":627},[838],{"type":37,"value":630},{"type":32,"tag":85,"props":840,"children":841},{"style":102},[842],{"type":37,"value":147},{"type":32,"tag":85,"props":844,"children":845},{"style":150},[846],{"type":37,"value":847},"Wait for Vercel Preview\n",{"type":32,"tag":85,"props":849,"children":850},{"class":87,"line":400},[851,856,860],{"type":32,"tag":85,"props":852,"children":853},{"style":627},[854],{"type":37,"value":855}," uses",{"type":32,"tag":85,"props":857,"children":858},{"style":102},[859],{"type":37,"value":147},{"type":32,"tag":85,"props":861,"children":862},{"style":150},[863],{"type":37,"value":864},"patrickedqvist\u002Fwait-for-vercel-preview@v1.3.1\n",{"type":32,"tag":85,"props":866,"children":867},{"class":87,"line":422},[868,873,877],{"type":32,"tag":85,"props":869,"children":870},{"style":627},[871],{"type":37,"value":872}," id",{"type":32,"tag":85,"props":874,"children":875},{"style":102},[876],{"type":37,"value":147},{"type":32,"tag":85,"props":878,"children":879},{"style":150},[880],{"type":37,"value":881},"vercel_preview\n",{"type":32,"tag":85,"props":883,"children":884},{"class":87,"line":445},[885,889],{"type":32,"tag":85,"props":886,"children":887},{"style":627},[888],{"type":37,"value":765},{"type":32,"tag":85,"props":890,"children":891},{"style":102},[892],{"type":37,"value":674},{"type":32,"tag":85,"props":894,"children":895},{"class":87,"line":458},[896,901,905],{"type":32,"tag":85,"props":897,"children":898},{"style":627},[899],{"type":37,"value":900}," token",{"type":32,"tag":85,"props":902,"children":903},{"style":102},[904],{"type":37,"value":147},{"type":32,"tag":85,"props":906,"children":907},{"style":150},[908],{"type":37,"value":909},"${{ secrets.GITHUB_TOKEN }}\n",{"type":32,"tag":85,"props":911,"children":912},{"class":87,"line":471},[913,918,922],{"type":32,"tag":85,"props":914,"children":915},{"style":627},[916],{"type":37,"value":917}," max_timeout",{"type":32,"tag":85,"props":919,"children":920},{"style":102},[921],{"type":37,"value":147},{"type":32,"tag":85,"props":923,"children":924},{"style":112},[925],{"type":37,"value":926},"300\n",{"type":32,"tag":85,"props":928,"children":929},{"class":87,"line":493},[930,934,938,942],{"type":32,"tag":85,"props":931,"children":932},{"style":102},[933],{"type":37,"value":723},{"type":32,"tag":85,"props":935,"children":936},{"style":627},[937],{"type":37,"value":630},{"type":32,"tag":85,"props":939,"children":940},{"style":102},[941],{"type":37,"value":147},{"type":32,"tag":85,"props":943,"children":944},{"style":150},[945],{"type":37,"value":946},"Run Lighthouse CI\n",{"type":32,"tag":85,"props":948,"children":949},{"class":87,"line":515},[950,955],{"type":32,"tag":85,"props":951,"children":952},{"style":627},[953],{"type":37,"value":954}," env",{"type":32,"tag":85,"props":956,"children":957},{"style":102},[958],{"type":37,"value":674},{"type":32,"tag":85,"props":960,"children":961},{"class":87,"line":533},[962,967,971],{"type":32,"tag":85,"props":963,"children":964},{"style":627},[965],{"type":37,"value":966}," LHCI_GITHUB_APP_TOKEN",{"type":32,"tag":85,"props":968,"children":969},{"style":102},[970],{"type":37,"value":147},{"type":32,"tag":85,"props":972,"children":973},{"style":150},[974],{"type":37,"value":975},"${{ secrets.LHCI_TOKEN }}\n",{"type":32,"tag":85,"props":977,"children":978},{"class":87,"line":542},[979,984,988],{"type":32,"tag":85,"props":980,"children":981},{"style":627},[982],{"type":37,"value":983}," run",{"type":32,"tag":85,"props":985,"children":986},{"style":102},[987],{"type":37,"value":147},{"type":32,"tag":85,"props":989,"children":991},{"style":990},"--shiki-default:#F97583",[992],{"type":37,"value":993},"|\n",{"type":32,"tag":85,"props":995,"children":996},{"class":87,"line":550},[997],{"type":32,"tag":85,"props":998,"children":999},{"style":150},[1000],{"type":37,"value":1001}," npm install -g @lhci\u002Fcli\n",{"type":32,"tag":85,"props":1003,"children":1004},{"class":87,"line":559},[1005],{"type":32,"tag":85,"props":1006,"children":1007},{"style":150},[1008],{"type":37,"value":1009}," lhci autorun --collect.url=${{ steps.vercel_preview.outputs.url }}\n",{"type":32,"tag":85,"props":1011,"children":1012},{"class":87,"line":568},[1013,1017,1021,1025],{"type":32,"tag":85,"props":1014,"children":1015},{"style":102},[1016],{"type":37,"value":723},{"type":32,"tag":85,"props":1018,"children":1019},{"style":627},[1020],{"type":37,"value":630},{"type":32,"tag":85,"props":1022,"children":1023},{"style":102},[1024],{"type":37,"value":147},{"type":32,"tag":85,"props":1026,"children":1027},{"style":150},[1028],{"type":37,"value":1029},"Comment PR\n",{"type":32,"tag":85,"props":1031,"children":1033},{"class":87,"line":1032},27,[1034,1038,1042],{"type":32,"tag":85,"props":1035,"children":1036},{"style":627},[1037],{"type":37,"value":855},{"type":32,"tag":85,"props":1039,"children":1040},{"style":102},[1041],{"type":37,"value":147},{"type":32,"tag":85,"props":1043,"children":1044},{"style":150},[1045],{"type":37,"value":1046},"treosh\u002Flighthouse-ci-action@v9\n",{"type":32,"tag":85,"props":1048,"children":1050},{"class":87,"line":1049},28,[1051,1055],{"type":32,"tag":85,"props":1052,"children":1053},{"style":627},[1054],{"type":37,"value":765},{"type":32,"tag":85,"props":1056,"children":1057},{"style":102},[1058],{"type":37,"value":674},{"type":32,"tag":85,"props":1060,"children":1062},{"class":87,"line":1061},29,[1063,1068,1072],{"type":32,"tag":85,"props":1064,"children":1065},{"style":627},[1066],{"type":37,"value":1067}," urls",{"type":32,"tag":85,"props":1069,"children":1070},{"style":102},[1071],{"type":37,"value":147},{"type":32,"tag":85,"props":1073,"children":1074},{"style":150},[1075],{"type":37,"value":1076},"${{ steps.vercel_preview.outputs.url }}\n",{"type":32,"tag":85,"props":1078,"children":1080},{"class":87,"line":1079},30,[1081,1086,1090],{"type":32,"tag":85,"props":1082,"children":1083},{"style":627},[1084],{"type":37,"value":1085}," uploadArtifacts",{"type":32,"tag":85,"props":1087,"children":1088},{"style":102},[1089],{"type":37,"value":147},{"type":32,"tag":85,"props":1091,"children":1092},{"style":112},[1093],{"type":37,"value":1094},"true\n",{"type":32,"tag":85,"props":1096,"children":1098},{"class":87,"line":1097},31,[1099,1104,1108],{"type":32,"tag":85,"props":1100,"children":1101},{"style":627},[1102],{"type":37,"value":1103}," temporaryPublicStorage",{"type":32,"tag":85,"props":1105,"children":1106},{"style":102},[1107],{"type":37,"value":147},{"type":32,"tag":85,"props":1109,"children":1110},{"style":112},[1111],{"type":37,"value":1094},{"type":32,"tag":33,"props":1113,"children":1114},{},[1115,1117,1123,1125,1131],{"type":37,"value":1116},"El paso ",{"type":32,"tag":67,"props":1118,"children":1120},{"className":1119},[],[1121],{"type":37,"value":1122},"wait-for-vercel-preview",{"type":37,"value":1124}," es crítico: si Lighthouse ejecuta antes de que Vercel termine, obtiene 404. Con ",{"type":32,"tag":67,"props":1126,"children":1128},{"className":1127},[],[1129],{"type":37,"value":1130},"max_timeout: 300",{"type":37,"value":1132},", esperamos 5 minutos. Una vez completado el deployment, Lighthouse inicia.",{"type":32,"tag":33,"props":1134,"children":1135},{},[1136],{"type":37,"value":1137},"El resultado aparece en el PR:",{"type":32,"tag":75,"props":1139,"children":1141},{"code":1140},"Lighthouse CI Report\n━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\n✅ Performance: 92\u002F100 (+2)\n❌ LCP: 2.3s (presupuesto: 2.0s) — FAILED\n✅ TBT: 180ms (presupuesto: 200ms)\n✅ CLS: 0.08 (presupuesto: 0.1)\n━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\n",[1142],{"type":32,"tag":67,"props":1143,"children":1144},{"__ignoreMap":16},[1145],{"type":37,"value":1140},{"type":32,"tag":33,"props":1147,"children":1148},{},[1149,1151,1157],{"type":37,"value":1150},"LCP en 2.3s hace que CI falle. El PR no puede fusionarse. El desarrollador ve que falta lazy-load en la imagen hero, lo corrige con ",{"type":32,"tag":67,"props":1152,"children":1154},{"className":1153},[],[1155],{"type":37,"value":1156},"loading=\"eager\"",{"type":37,"value":1158},", Lighthouse CI ejecuta nuevamente, LCP baja a 1.9s, el merge se desbloquea.",{"type":32,"tag":33,"props":1160,"children":1161},{},[1162,1164,1173,1175,1181],{"type":37,"value":1163},"Este enfoque es crítico en proyectos ",{"type":32,"tag":1165,"props":1166,"children":1170},"a",{"href":1167,"rel":1168},"https:\u002F\u002Fwww.roibase.com.tr\u002Fes\u002Fheadless",[1169],"nofollow",[1171],{"type":37,"value":1172},"Headless Commerce",{"type":37,"value":1174},". Storefront de Hydrogen o Next.js Commerce agregan componentes constantemente. Si en algún lugar ",{"type":32,"tag":67,"props":1176,"children":1178},{"className":1177},[],[1179],{"type":37,"value":1180},"await fetch()",{"type":37,"value":1182}," no se desenvuelve, el main thread se bloquea. Lighthouse CI lo captura con bundle size + TBT.",{"type":32,"tag":40,"props":1184,"children":1186},{"id":1185},"real-user-monitoring-para-validar-números-reales-en-producción",[1187],{"type":37,"value":1188},"Real User Monitoring para Validar Números Reales en Producción",{"type":32,"tag":33,"props":1190,"children":1191},{},[1192],{"type":37,"value":1193},"Lighthouse CI hace monitoreo sintético — ejecuta en laboratorio. Los usuarios reales tienen dispositivos, redes y estado de cache diferentes. Por eso necesitas RUM (Real User Monitoring). RUM recopila flujos de métricas reales desde tu sitio en vivo.",{"type":32,"tag":33,"props":1195,"children":1196},{},[1197],{"type":37,"value":1198},"Con la librería Web Vitals, puedes enviar RUM a tu backend:",{"type":32,"tag":75,"props":1200,"children":1204},{"code":1201,"language":1202,"meta":16,"className":1203,"style":16},"\u002F\u002F analytics\u002Fweb-vitals.ts\nimport { onCLS, onFID, onLCP, onTTFB, onINP } from 'web-vitals';\n\nfunction sendToAnalytics(metric: Metric) {\n const body = JSON.stringify({\n name: metric.name,\n value: metric.value,\n rating: metric.rating,\n delta: metric.delta,\n id: metric.id,\n navigationType: metric.navigationType,\n url: window.location.href,\n userAgent: navigator.userAgent,\n timestamp: Date.now()\n });\n\n \u002F\u002F Beacon API — envía incluso si la página se cierra\n if (navigator.sendBeacon) {\n navigator.sendBeacon('\u002Fapi\u002Fvitals', body);\n } else {\n fetch('\u002Fapi\u002Fvitals', { method: 'POST', body, keepalive: true });\n }\n}\n\nonCLS(sendToAnalytics);\nonLCP(sendToAnalytics);\nonINP(sendToAnalytics);\nonTTFB(sendToAnalytics);\n","typescript","language-typescript shiki shiki-themes github-dark",[1205],{"type":32,"tag":67,"props":1206,"children":1207},{"__ignoreMap":16},[1208,1216,1244,1253,1293,1331,1339,1347,1355,1363,1371,1379,1387,1395,1413,1421,1428,1436,1449,1476,1494,1535,1542,1549,1556,1569,1581,1593],{"type":32,"tag":85,"props":1209,"children":1210},{"class":87,"line":88},[1211],{"type":32,"tag":85,"props":1212,"children":1213},{"style":92},[1214],{"type":37,"value":1215},"\u002F\u002F analytics\u002Fweb-vitals.ts\n",{"type":32,"tag":85,"props":1217,"children":1218},{"class":87,"line":98},[1219,1224,1229,1234,1239],{"type":32,"tag":85,"props":1220,"children":1221},{"style":990},[1222],{"type":37,"value":1223},"import",{"type":32,"tag":85,"props":1225,"children":1226},{"style":102},[1227],{"type":37,"value":1228}," { onCLS, onFID, onLCP, onTTFB, onINP } ",{"type":32,"tag":85,"props":1230,"children":1231},{"style":990},[1232],{"type":37,"value":1233},"from",{"type":32,"tag":85,"props":1235,"children":1236},{"style":150},[1237],{"type":37,"value":1238}," 'web-vitals'",{"type":32,"tag":85,"props":1240,"children":1241},{"style":102},[1242],{"type":37,"value":1243},";\n",{"type":32,"tag":85,"props":1245,"children":1246},{"class":87,"line":108},[1247],{"type":32,"tag":85,"props":1248,"children":1250},{"emptyLinePlaceholder":1249},true,[1251],{"type":37,"value":1252},"\n",{"type":32,"tag":85,"props":1254,"children":1255},{"class":87,"line":123},[1256,1261,1267,1272,1278,1283,1288],{"type":32,"tag":85,"props":1257,"children":1258},{"style":990},[1259],{"type":37,"value":1260},"function",{"type":32,"tag":85,"props":1262,"children":1264},{"style":1263},"--shiki-default:#B392F0",[1265],{"type":37,"value":1266}," sendToAnalytics",{"type":32,"tag":85,"props":1268,"children":1269},{"style":102},[1270],{"type":37,"value":1271},"(",{"type":32,"tag":85,"props":1273,"children":1275},{"style":1274},"--shiki-default:#FFAB70",[1276],{"type":37,"value":1277},"metric",{"type":32,"tag":85,"props":1279,"children":1280},{"style":990},[1281],{"type":37,"value":1282},":",{"type":32,"tag":85,"props":1284,"children":1285},{"style":1263},[1286],{"type":37,"value":1287}," Metric",{"type":32,"tag":85,"props":1289,"children":1290},{"style":102},[1291],{"type":37,"value":1292},") {\n",{"type":32,"tag":85,"props":1294,"children":1295},{"class":87,"line":136},[1296,1301,1306,1311,1316,1321,1326],{"type":32,"tag":85,"props":1297,"children":1298},{"style":990},[1299],{"type":37,"value":1300}," const",{"type":32,"tag":85,"props":1302,"children":1303},{"style":112},[1304],{"type":37,"value":1305}," body",{"type":32,"tag":85,"props":1307,"children":1308},{"style":990},[1309],{"type":37,"value":1310}," =",{"type":32,"tag":85,"props":1312,"children":1313},{"style":112},[1314],{"type":37,"value":1315}," JSON",{"type":32,"tag":85,"props":1317,"children":1318},{"style":102},[1319],{"type":37,"value":1320},".",{"type":32,"tag":85,"props":1322,"children":1323},{"style":1263},[1324],{"type":37,"value":1325},"stringify",{"type":32,"tag":85,"props":1327,"children":1328},{"style":102},[1329],{"type":37,"value":1330},"({\n",{"type":32,"tag":85,"props":1332,"children":1333},{"class":87,"line":161},[1334],{"type":32,"tag":85,"props":1335,"children":1336},{"style":102},[1337],{"type":37,"value":1338}," name: metric.name,\n",{"type":32,"tag":85,"props":1340,"children":1341},{"class":87,"line":174},[1342],{"type":32,"tag":85,"props":1343,"children":1344},{"style":102},[1345],{"type":37,"value":1346}," value: metric.value,\n",{"type":32,"tag":85,"props":1348,"children":1349},{"class":87,"line":26},[1350],{"type":32,"tag":85,"props":1351,"children":1352},{"style":102},[1353],{"type":37,"value":1354}," rating: metric.rating,\n",{"type":32,"tag":85,"props":1356,"children":1357},{"class":87,"line":254},[1358],{"type":32,"tag":85,"props":1359,"children":1360},{"style":102},[1361],{"type":37,"value":1362}," delta: metric.delta,\n",{"type":32,"tag":85,"props":1364,"children":1365},{"class":87,"line":292},[1366],{"type":32,"tag":85,"props":1367,"children":1368},{"style":102},[1369],{"type":37,"value":1370}," id: metric.id,\n",{"type":32,"tag":85,"props":1372,"children":1373},{"class":87,"line":330},[1374],{"type":32,"tag":85,"props":1375,"children":1376},{"style":102},[1377],{"type":37,"value":1378}," navigationType: metric.navigationType,\n",{"type":32,"tag":85,"props":1380,"children":1381},{"class":87,"line":369},[1382],{"type":32,"tag":85,"props":1383,"children":1384},{"style":102},[1385],{"type":37,"value":1386}," url: window.location.href,\n",{"type":32,"tag":85,"props":1388,"children":1389},{"class":87,"line":378},[1390],{"type":32,"tag":85,"props":1391,"children":1392},{"style":102},[1393],{"type":37,"value":1394}," userAgent: navigator.userAgent,\n",{"type":32,"tag":85,"props":1396,"children":1397},{"class":87,"line":387},[1398,1403,1408],{"type":32,"tag":85,"props":1399,"children":1400},{"style":102},[1401],{"type":37,"value":1402}," timestamp: Date.",{"type":32,"tag":85,"props":1404,"children":1405},{"style":1263},[1406],{"type":37,"value":1407},"now",{"type":32,"tag":85,"props":1409,"children":1410},{"style":102},[1411],{"type":37,"value":1412},"()\n",{"type":32,"tag":85,"props":1414,"children":1415},{"class":87,"line":400},[1416],{"type":32,"tag":85,"props":1417,"children":1418},{"style":102},[1419],{"type":37,"value":1420}," });\n",{"type":32,"tag":85,"props":1422,"children":1423},{"class":87,"line":422},[1424],{"type":32,"tag":85,"props":1425,"children":1426},{"emptyLinePlaceholder":1249},[1427],{"type":37,"value":1252},{"type":32,"tag":85,"props":1429,"children":1430},{"class":87,"line":445},[1431],{"type":32,"tag":85,"props":1432,"children":1433},{"style":92},[1434],{"type":37,"value":1435}," \u002F\u002F Beacon API — envía incluso si la página se cierra\n",{"type":32,"tag":85,"props":1437,"children":1438},{"class":87,"line":458},[1439,1444],{"type":32,"tag":85,"props":1440,"children":1441},{"style":990},[1442],{"type":37,"value":1443}," if",{"type":32,"tag":85,"props":1445,"children":1446},{"style":102},[1447],{"type":37,"value":1448}," (navigator.sendBeacon) {\n",{"type":32,"tag":85,"props":1450,"children":1451},{"class":87,"line":471},[1452,1457,1462,1466,1471],{"type":32,"tag":85,"props":1453,"children":1454},{"style":102},[1455],{"type":37,"value":1456}," navigator.",{"type":32,"tag":85,"props":1458,"children":1459},{"style":1263},[1460],{"type":37,"value":1461},"sendBeacon",{"type":32,"tag":85,"props":1463,"children":1464},{"style":102},[1465],{"type":37,"value":1271},{"type":32,"tag":85,"props":1467,"children":1468},{"style":150},[1469],{"type":37,"value":1470},"'\u002Fapi\u002Fvitals'",{"type":32,"tag":85,"props":1472,"children":1473},{"style":102},[1474],{"type":37,"value":1475},", body);\n",{"type":32,"tag":85,"props":1477,"children":1478},{"class":87,"line":493},[1479,1484,1489],{"type":32,"tag":85,"props":1480,"children":1481},{"style":102},[1482],{"type":37,"value":1483}," } ",{"type":32,"tag":85,"props":1485,"children":1486},{"style":990},[1487],{"type":37,"value":1488},"else",{"type":32,"tag":85,"props":1490,"children":1491},{"style":102},[1492],{"type":37,"value":1493}," {\n",{"type":32,"tag":85,"props":1495,"children":1496},{"class":87,"line":515},[1497,1502,1506,1510,1515,1520,1525,1530],{"type":32,"tag":85,"props":1498,"children":1499},{"style":1263},[1500],{"type":37,"value":1501}," fetch",{"type":32,"tag":85,"props":1503,"children":1504},{"style":102},[1505],{"type":37,"value":1271},{"type":32,"tag":85,"props":1507,"children":1508},{"style":150},[1509],{"type":37,"value":1470},{"type":32,"tag":85,"props":1511,"children":1512},{"style":102},[1513],{"type":37,"value":1514},", { method: ",{"type":32,"tag":85,"props":1516,"children":1517},{"style":150},[1518],{"type":37,"value":1519},"'POST'",{"type":32,"tag":85,"props":1521,"children":1522},{"style":102},[1523],{"type":37,"value":1524},", body, keepalive: ",{"type":32,"tag":85,"props":1526,"children":1527},{"style":112},[1528],{"type":37,"value":1529},"true",{"type":32,"tag":85,"props":1531,"children":1532},{"style":102},[1533],{"type":37,"value":1534}," });\n",{"type":32,"tag":85,"props":1536,"children":1537},{"class":87,"line":533},[1538],{"type":32,"tag":85,"props":1539,"children":1540},{"style":102},[1541],{"type":37,"value":565},{"type":32,"tag":85,"props":1543,"children":1544},{"class":87,"line":542},[1545],{"type":32,"tag":85,"props":1546,"children":1547},{"style":102},[1548],{"type":37,"value":574},{"type":32,"tag":85,"props":1550,"children":1551},{"class":87,"line":550},[1552],{"type":32,"tag":85,"props":1553,"children":1554},{"emptyLinePlaceholder":1249},[1555],{"type":37,"value":1252},{"type":32,"tag":85,"props":1557,"children":1558},{"class":87,"line":559},[1559,1564],{"type":32,"tag":85,"props":1560,"children":1561},{"style":1263},[1562],{"type":37,"value":1563},"onCLS",{"type":32,"tag":85,"props":1565,"children":1566},{"style":102},[1567],{"type":37,"value":1568},"(sendToAnalytics);\n",{"type":32,"tag":85,"props":1570,"children":1571},{"class":87,"line":568},[1572,1577],{"type":32,"tag":85,"props":1573,"children":1574},{"style":1263},[1575],{"type":37,"value":1576},"onLCP",{"type":32,"tag":85,"props":1578,"children":1579},{"style":102},[1580],{"type":37,"value":1568},{"type":32,"tag":85,"props":1582,"children":1583},{"class":87,"line":1032},[1584,1589],{"type":32,"tag":85,"props":1585,"children":1586},{"style":1263},[1587],{"type":37,"value":1588},"onINP",{"type":32,"tag":85,"props":1590,"children":1591},{"style":102},[1592],{"type":37,"value":1568},{"type":32,"tag":85,"props":1594,"children":1595},{"class":87,"line":1049},[1596,1601],{"type":32,"tag":85,"props":1597,"children":1598},{"style":1263},[1599],{"type":37,"value":1600},"onTTFB",{"type":32,"tag":85,"props":1602,"children":1603},{"style":102},[1604],{"type":37,"value":1568},{"type":32,"tag":33,"props":1606,"children":1607},{},[1608,1610,1616],{"type":37,"value":1609},"El backend escribe ",{"type":32,"tag":67,"props":1611,"children":1613},{"className":1612},[],[1614],{"type":37,"value":1615},"\u002Fapi\u002Fvitals",{"type":37,"value":1617}," a BigQuery o Cloudflare Analytics. El reporte diario agregado se ve así:",{"type":32,"tag":1619,"props":1620,"children":1621},"table",{},[1622,1656],{"type":32,"tag":1623,"props":1624,"children":1625},"thead",{},[1626],{"type":32,"tag":1627,"props":1628,"children":1629},"tr",{},[1630,1636,1641,1646,1651],{"type":32,"tag":1631,"props":1632,"children":1633},"th",{},[1634],{"type":37,"value":1635},"Fecha",{"type":32,"tag":1631,"props":1637,"children":1638},{},[1639],{"type":37,"value":1640},"LCP p75",{"type":32,"tag":1631,"props":1642,"children":1643},{},[1644],{"type":37,"value":1645},"INP p75",{"type":32,"tag":1631,"props":1647,"children":1648},{},[1649],{"type":37,"value":1650},"CLS p75",{"type":32,"tag":1631,"props":1652,"children":1653},{},[1654],{"type":37,"value":1655},"Vistas de Página",{"type":32,"tag":1657,"props":1658,"children":1659},"tbody",{},[1660,1689,1717],{"type":32,"tag":1627,"props":1661,"children":1662},{},[1663,1669,1674,1679,1684],{"type":32,"tag":1664,"props":1665,"children":1666},"td",{},[1667],{"type":37,"value":1668},"2026-07-28",{"type":32,"tag":1664,"props":1670,"children":1671},{},[1672],{"type":37,"value":1673},"1.8s",{"type":32,"tag":1664,"props":1675,"children":1676},{},[1677],{"type":37,"value":1678},"140ms",{"type":32,"tag":1664,"props":1680,"children":1681},{},[1682],{"type":37,"value":1683},"0.06",{"type":32,"tag":1664,"props":1685,"children":1686},{},[1687],{"type":37,"value":1688},"12,400",{"type":32,"tag":1627,"props":1690,"children":1691},{},[1692,1697,1702,1707,1712],{"type":32,"tag":1664,"props":1693,"children":1694},{},[1695],{"type":37,"value":1696},"2026-07-29",{"type":32,"tag":1664,"props":1698,"children":1699},{},[1700],{"type":37,"value":1701},"2.1s",{"type":32,"tag":1664,"props":1703,"children":1704},{},[1705],{"type":37,"value":1706},"180ms",{"type":32,"tag":1664,"props":1708,"children":1709},{},[1710],{"type":37,"value":1711},"0.09",{"type":32,"tag":1664,"props":1713,"children":1714},{},[1715],{"type":37,"value":1716},"13,100",{"type":32,"tag":1627,"props":1718,"children":1719},{},[1720,1724,1729,1734,1739],{"type":32,"tag":1664,"props":1721,"children":1722},{},[1723],{"type":37,"value":19},{"type":32,"tag":1664,"props":1725,"children":1726},{},[1727],{"type":37,"value":1728},"3.2s",{"type":32,"tag":1664,"props":1730,"children":1731},{},[1732],{"type":37,"value":1733},"320ms",{"type":32,"tag":1664,"props":1735,"children":1736},{},[1737],{"type":37,"value":1738},"0.14",{"type":32,"tag":1664,"props":1740,"children":1741},{},[1742],{"type":37,"value":1743},"11,800",{"type":32,"tag":33,"props":1745,"children":1746},{},[1747],{"type":37,"value":1748},"Hubo un deployment el 29 de julio. LCP saltó de 2.1s a 3.2s, INP de 180ms a 320ms. La tasa de rebote subió 4.2%. RUM mostró esto en 2 horas — pero Lighthouse CI en laboratorio estaba bajo 2.0s; usuarios en dispositivos más lentos experimentaban realidad diferente.",{"type":32,"tag":33,"props":1750,"children":1751},{},[1752],{"type":37,"value":1753},"Esta métrica llevó a una decisión de rollback. El deployment se revirtió, LCP volvió a 1.9s.",{"type":32,"tag":1755,"props":1756,"children":1758},"h3",{"id":1757},"pipeline-de-alarma-rum",[1759],{"type":37,"value":1760},"Pipeline de Alarma RUM",{"type":32,"tag":33,"props":1762,"children":1763},{},[1764],{"type":37,"value":1765},"No basta mostrar RUM solo en un dashboard. Necesitas alertas Slack ante regresiones. Puedes configurar una consulta BigQuery programada:",{"type":32,"tag":75,"props":1767,"children":1771},{"code":1768,"language":1769,"meta":16,"className":1770,"style":16},"-- BigQuery scheduled query (cada hora)\nWITH current_hour AS (\n SELECT\n APPROX_QUANTILES(lcp_value, 100)[OFFSET(75)] AS lcp_p75,\n APPROX_QUANTILES(inp_value, 100)[OFFSET(75)] AS inp_p75\n FROM `project.dataset.web_vitals`\n WHERE timestamp >= TIMESTAMP_SUB(CURRENT_TIMESTAMP(), INTERVAL 1 HOUR)\n),\nbaseline AS (\n SELECT\n APPROX_QUANTILES(lcp_value, 100)[OFFSET(75)] AS lcp_p75_baseline\n FROM `project.dataset.web_vitals`\n WHERE timestamp BETWEEN TIMESTAMP_SUB(CURRENT_TIMESTAMP(), INTERVAL 8 HOUR)\n AND TIMESTAMP_SUB(CURRENT_TIMESTAMP(), INTERVAL 2 HOUR)\n)\nSELECT\n c.lcp_p75,\n b.lcp_p75_baseline,\n (c.lcp_p75 - b.lcp_p75_baseline) \u002F b.lcp_p75_baseline * 100 AS lcp_regression_pct\nFROM current_hour c, baseline b\nWHERE (c.lcp_p75 - b.lcp_p75_baseline) \u002F b.lcp_p75_baseline > 0.15\n","sql","language-sql shiki shiki-themes github-dark",[1772],{"type":32,"tag":67,"props":1773,"children":1774},{"__ignoreMap":16},[1775,1783,1806,1814,1841,1866,1879,1927,1935,1951,1958,1982,1993,2034,2067,2074,2082,2103,2124,2205,2218],{"type":32,"tag":85,"props":1776,"children":1777},{"class":87,"line":88},[1778],{"type":32,"tag":85,"props":1779,"children":1780},{"style":92},[1781],{"type":37,"value":1782},"-- BigQuery scheduled query (cada hora)\n",{"type":32,"tag":85,"props":1784,"children":1785},{"class":87,"line":98},[1786,1791,1796,1801],{"type":32,"tag":85,"props":1787,"children":1788},{"style":990},[1789],{"type":37,"value":1790},"WITH",{"type":32,"tag":85,"props":1792,"children":1793},{"style":102},[1794],{"type":37,"value":1795}," current_hour ",{"type":32,"tag":85,"props":1797,"children":1798},{"style":990},[1799],{"type":37,"value":1800},"AS",{"type":32,"tag":85,"props":1802,"children":1803},{"style":102},[1804],{"type":37,"value":1805}," (\n",{"type":32,"tag":85,"props":1807,"children":1808},{"class":87,"line":108},[1809],{"type":32,"tag":85,"props":1810,"children":1811},{"style":990},[1812],{"type":37,"value":1813}," SELECT\n",{"type":32,"tag":85,"props":1815,"children":1816},{"class":87,"line":123},[1817,1822,1827,1832,1836],{"type":32,"tag":85,"props":1818,"children":1819},{"style":102},[1820],{"type":37,"value":1821}," APPROX_QUANTILES(lcp_value, ",{"type":32,"tag":85,"props":1823,"children":1824},{"style":112},[1825],{"type":37,"value":1826},"100",{"type":32,"tag":85,"props":1828,"children":1829},{"style":102},[1830],{"type":37,"value":1831},")[OFFSET(75)] ",{"type":32,"tag":85,"props":1833,"children":1834},{"style":990},[1835],{"type":37,"value":1800},{"type":32,"tag":85,"props":1837,"children":1838},{"style":102},[1839],{"type":37,"value":1840}," lcp_p75,\n",{"type":32,"tag":85,"props":1842,"children":1843},{"class":87,"line":136},[1844,1849,1853,1857,1861],{"type":32,"tag":85,"props":1845,"children":1846},{"style":102},[1847],{"type":37,"value":1848}," APPROX_QUANTILES(inp_value, ",{"type":32,"tag":85,"props":1850,"children":1851},{"style":112},[1852],{"type":37,"value":1826},{"type":32,"tag":85,"props":1854,"children":1855},{"style":102},[1856],{"type":37,"value":1831},{"type":32,"tag":85,"props":1858,"children":1859},{"style":990},[1860],{"type":37,"value":1800},{"type":32,"tag":85,"props":1862,"children":1863},{"style":102},[1864],{"type":37,"value":1865}," inp_p75\n",{"type":32,"tag":85,"props":1867,"children":1868},{"class":87,"line":161},[1869,1874],{"type":32,"tag":85,"props":1870,"children":1871},{"style":990},[1872],{"type":37,"value":1873}," FROM",{"type":32,"tag":85,"props":1875,"children":1876},{"style":150},[1877],{"type":37,"value":1878}," `project.dataset.web_vitals`\n",{"type":32,"tag":85,"props":1880,"children":1881},{"class":87,"line":174},[1882,1887,1892,1897,1902,1907,1912,1917,1922],{"type":32,"tag":85,"props":1883,"children":1884},{"style":990},[1885],{"type":37,"value":1886}," WHERE",{"type":32,"tag":85,"props":1888,"children":1889},{"style":990},[1890],{"type":37,"value":1891}," timestamp",{"type":32,"tag":85,"props":1893,"children":1894},{"style":990},[1895],{"type":37,"value":1896}," >=",{"type":32,"tag":85,"props":1898,"children":1899},{"style":102},[1900],{"type":37,"value":1901}," TIMESTAMP_SUB(",{"type":32,"tag":85,"props":1903,"children":1904},{"style":112},[1905],{"type":37,"value":1906},"CURRENT_TIMESTAMP",{"type":32,"tag":85,"props":1908,"children":1909},{"style":102},[1910],{"type":37,"value":1911},"(), INTERVAL ",{"type":32,"tag":85,"props":1913,"children":1914},{"style":112},[1915],{"type":37,"value":1916},"1",{"type":32,"tag":85,"props":1918,"children":1919},{"style":990},[1920],{"type":37,"value":1921}," HOUR",{"type":32,"tag":85,"props":1923,"children":1924},{"style":102},[1925],{"type":37,"value":1926},")\n",{"type":32,"tag":85,"props":1928,"children":1929},{"class":87,"line":26},[1930],{"type":32,"tag":85,"props":1931,"children":1932},{"style":102},[1933],{"type":37,"value":1934},"),\n",{"type":32,"tag":85,"props":1936,"children":1937},{"class":87,"line":254},[1938,1943,1947],{"type":32,"tag":85,"props":1939,"children":1940},{"style":102},[1941],{"type":37,"value":1942},"baseline ",{"type":32,"tag":85,"props":1944,"children":1945},{"style":990},[1946],{"type":37,"value":1800},{"type":32,"tag":85,"props":1948,"children":1949},{"style":102},[1950],{"type":37,"value":1805},{"type":32,"tag":85,"props":1952,"children":1953},{"class":87,"line":292},[1954],{"type":32,"tag":85,"props":1955,"children":1956},{"style":990},[1957],{"type":37,"value":1813},{"type":32,"tag":85,"props":1959,"children":1960},{"class":87,"line":330},[1961,1965,1969,1973,1977],{"type":32,"tag":85,"props":1962,"children":1963},{"style":102},[1964],{"type":37,"value":1821},{"type":32,"tag":85,"props":1966,"children":1967},{"style":112},[1968],{"type":37,"value":1826},{"type":32,"tag":85,"props":1970,"children":1971},{"style":102},[1972],{"type":37,"value":1831},{"type":32,"tag":85,"props":1974,"children":1975},{"style":990},[1976],{"type":37,"value":1800},{"type":32,"tag":85,"props":1978,"children":1979},{"style":102},[1980],{"type":37,"value":1981}," lcp_p75_baseline\n",{"type":32,"tag":85,"props":1983,"children":1984},{"class":87,"line":369},[1985,1989],{"type":32,"tag":85,"props":1986,"children":1987},{"style":990},[1988],{"type":37,"value":1873},{"type":32,"tag":85,"props":1990,"children":1991},{"style":150},[1992],{"type":37,"value":1878},{"type":32,"tag":85,"props":1994,"children":1995},{"class":87,"line":378},[1996,2000,2004,2009,2013,2017,2021,2026,2030],{"type":32,"tag":85,"props":1997,"children":1998},{"style":990},[1999],{"type":37,"value":1886},{"type":32,"tag":85,"props":2001,"children":2002},{"style":990},[2003],{"type":37,"value":1891},{"type":32,"tag":85,"props":2005,"children":2006},{"style":990},[2007],{"type":37,"value":2008}," BETWEEN",{"type":32,"tag":85,"props":2010,"children":2011},{"style":102},[2012],{"type":37,"value":1901},{"type":32,"tag":85,"props":2014,"children":2015},{"style":112},[2016],{"type":37,"value":1906},{"type":32,"tag":85,"props":2018,"children":2019},{"style":102},[2020],{"type":37,"value":1911},{"type":32,"tag":85,"props":2022,"children":2023},{"style":112},[2024],{"type":37,"value":2025},"8",{"type":32,"tag":85,"props":2027,"children":2028},{"style":990},[2029],{"type":37,"value":1921},{"type":32,"tag":85,"props":2031,"children":2032},{"style":102},[2033],{"type":37,"value":1926},{"type":32,"tag":85,"props":2035,"children":2036},{"class":87,"line":387},[2037,2042,2046,2050,2054,2059,2063],{"type":32,"tag":85,"props":2038,"children":2039},{"style":990},[2040],{"type":37,"value":2041}," AND",{"type":32,"tag":85,"props":2043,"children":2044},{"style":102},[2045],{"type":37,"value":1901},{"type":32,"tag":85,"props":2047,"children":2048},{"style":112},[2049],{"type":37,"value":1906},{"type":32,"tag":85,"props":2051,"children":2052},{"style":102},[2053],{"type":37,"value":1911},{"type":32,"tag":85,"props":2055,"children":2056},{"style":112},[2057],{"type":37,"value":2058},"2",{"type":32,"tag":85,"props":2060,"children":2061},{"style":990},[2062],{"type":37,"value":1921},{"type":32,"tag":85,"props":2064,"children":2065},{"style":102},[2066],{"type":37,"value":1926},{"type":32,"tag":85,"props":2068,"children":2069},{"class":87,"line":400},[2070],{"type":32,"tag":85,"props":2071,"children":2072},{"style":102},[2073],{"type":37,"value":1926},{"type":32,"tag":85,"props":2075,"children":2076},{"class":87,"line":422},[2077],{"type":32,"tag":85,"props":2078,"children":2079},{"style":990},[2080],{"type":37,"value":2081},"SELECT\n",{"type":32,"tag":85,"props":2083,"children":2084},{"class":87,"line":445},[2085,2090,2094,2099],{"type":32,"tag":85,"props":2086,"children":2087},{"style":112},[2088],{"type":37,"value":2089}," c",{"type":32,"tag":85,"props":2091,"children":2092},{"style":102},[2093],{"type":37,"value":1320},{"type":32,"tag":85,"props":2095,"children":2096},{"style":112},[2097],{"type":37,"value":2098},"lcp_p75",{"type":32,"tag":85,"props":2100,"children":2101},{"style":102},[2102],{"type":37,"value":158},{"type":32,"tag":85,"props":2104,"children":2105},{"class":87,"line":458},[2106,2111,2115,2120],{"type":32,"tag":85,"props":2107,"children":2108},{"style":112},[2109],{"type":37,"value":2110}," b",{"type":32,"tag":85,"props":2112,"children":2113},{"style":102},[2114],{"type":37,"value":1320},{"type":32,"tag":85,"props":2116,"children":2117},{"style":112},[2118],{"type":37,"value":2119},"lcp_p75_baseline",{"type":32,"tag":85,"props":2121,"children":2122},{"style":102},[2123],{"type":37,"value":158},{"type":32,"tag":85,"props":2125,"children":2126},{"class":87,"line":471},[2127,2132,2137,2141,2145,2150,2155,2159,2163,2168,2173,2177,2181,2185,2190,2195,2200],{"type":32,"tag":85,"props":2128,"children":2129},{"style":102},[2130],{"type":37,"value":2131}," (",{"type":32,"tag":85,"props":2133,"children":2134},{"style":112},[2135],{"type":37,"value":2136},"c",{"type":32,"tag":85,"props":2138,"children":2139},{"style":102},[2140],{"type":37,"value":1320},{"type":32,"tag":85,"props":2142,"children":2143},{"style":112},[2144],{"type":37,"value":2098},{"type":32,"tag":85,"props":2146,"children":2147},{"style":990},[2148],{"type":37,"value":2149}," -",{"type":32,"tag":85,"props":2151,"children":2152},{"style":112},[2153],{"type":37,"value":2154}," b",{"type":32,"tag":85,"props":2156,"children":2157},{"style":102},[2158],{"type":37,"value":1320},{"type":32,"tag":85,"props":2160,"children":2161},{"style":112},[2162],{"type":37,"value":2119},{"type":32,"tag":85,"props":2164,"children":2165},{"style":102},[2166],{"type":37,"value":2167},") ",{"type":32,"tag":85,"props":2169,"children":2170},{"style":990},[2171],{"type":37,"value":2172},"\u002F",{"type":32,"tag":85,"props":2174,"children":2175},{"style":112},[2176],{"type":37,"value":2154},{"type":32,"tag":85,"props":2178,"children":2179},{"style":102},[2180],{"type":37,"value":1320},{"type":32,"tag":85,"props":2182,"children":2183},{"style":112},[2184],{"type":37,"value":2119},{"type":32,"tag":85,"props":2186,"children":2187},{"style":990},[2188],{"type":37,"value":2189}," *",{"type":32,"tag":85,"props":2191,"children":2192},{"style":112},[2193],{"type":37,"value":2194}," 100",{"type":32,"tag":85,"props":2196,"children":2197},{"style":990},[2198],{"type":37,"value":2199}," AS",{"type":32,"tag":85,"props":2201,"children":2202},{"style":102},[2203],{"type":37,"value":2204}," lcp_regression_pct\n",{"type":32,"tag":85,"props":2206,"children":2207},{"class":87,"line":493},[2208,2213],{"type":32,"tag":85,"props":2209,"children":2210},{"style":990},[2211],{"type":37,"value":2212},"FROM",{"type":32,"tag":85,"props":2214,"children":2215},{"style":102},[2216],{"type":37,"value":2217}," current_hour c, baseline b\n",{"type":32,"tag":85,"props":2219,"children":2220},{"class":87,"line":515},[2221,2226,2231,2235,2239,2243,2247,2251,2255,2259,2263,2267,2271,2275,2279,2284,2289,2293],{"type":32,"tag":85,"props":2222,"children":2223},{"style":990},[2224],{"type":37,"value":2225},"WHERE",{"type":32,"tag":85,"props":2227,"children":2228},{"style":102},[2229],{"type":37,"value":2230}," (",{"type":32,"tag":85,"props":2232,"children":2233},{"style":112},[2234],{"type":37,"value":2136},{"type":32,"tag":85,"props":2236,"children":2237},{"style":102},[2238],{"type":37,"value":1320},{"type":32,"tag":85,"props":2240,"children":2241},{"style":112},[2242],{"type":37,"value":2098},{"type":32,"tag":85,"props":2244,"children":2245},{"style":990},[2246],{"type":37,"value":2149},{"type":32,"tag":85,"props":2248,"children":2249},{"style":112},[2250],{"type":37,"value":2154},{"type":32,"tag":85,"props":2252,"children":2253},{"style":102},[2254],{"type":37,"value":1320},{"type":32,"tag":85,"props":2256,"children":2257},{"style":112},[2258],{"type":37,"value":2119},{"type":32,"tag":85,"props":2260,"children":2261},{"style":102},[2262],{"type":37,"value":2167},{"type":32,"tag":85,"props":2264,"children":2265},{"style":990},[2266],{"type":37,"value":2172},{"type":32,"tag":85,"props":2268,"children":2269},{"style":112},[2270],{"type":37,"value":2154},{"type":32,"tag":85,"props":2272,"children":2273},{"style":102},[2274],{"type":37,"value":1320},{"type":32,"tag":85,"props":2276,"children":2277},{"style":112},[2278],{"type":37,"value":2119},{"type":32,"tag":85,"props":2280,"children":2281},{"style":990},[2282],{"type":37,"value":2283}," >",{"type":32,"tag":85,"props":2285,"children":2286},{"style":112},[2287],{"type":37,"value":2288}," 0",{"type":32,"tag":85,"props":2290,"children":2291},{"style":102},[2292],{"type":37,"value":1320},{"type":32,"tag":85,"props":2294,"children":2295},{"style":112},[2296],{"type":37,"value":2297},"15\n",{"type":32,"tag":33,"props":2299,"children":2300},{},[2301],{"type":37,"value":2302},"Esta consulta verifica si LCP p75 se degradó más del 15% respecto al baseline. Si ocurre, una Cloud Function se activa y envía alerta a webhook Slack:",{"type":32,"tag":75,"props":2304,"children":2306},{"code":2305},"⚠️ Performance Regression Detected\n━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\nLCP p75: 3.2s (+68% vs baseline de 6h)\nBaseline: 1.9s\nURL: \u002Fproduct\u002Fxyz\nDeploy: #4521 (hace 30 min)\n━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\n",[2307],{"type":32,"tag":67,"props":2308,"children":2309},{"__ignoreMap":16},[2310],{"type":37,"value":2305},{"type":32,"tag":40,"props":2312,"children":2314},{"id":2313},"tradeoff-sintético-vs-rum-cuándo-usar-cada-uno",[2315],{"type":37,"value":2316},"Tradeoff: Sintético vs RUM — Cuándo Usar Cada Uno",{"type":32,"tag":33,"props":2318,"children":2319},{},[2320],{"type":37,"value":2321},"Lighthouse CI y RUM se complementan — no es elegir uno; usa ambos en paralelo.",{"type":32,"tag":33,"props":2323,"children":2324},{},[2325],{"type":32,"tag":2326,"props":2327,"children":2328},"strong",{},[2329],{"type":37,"value":2330},"Lighthouse CI (sintético):",{"type":32,"tag":2332,"props":2333,"children":2334},"ul",{},[2335,2346,2356],{"type":32,"tag":2336,"props":2337,"children":2338},"li",{},[2339,2344],{"type":32,"tag":2326,"props":2340,"children":2341},{},[2342],{"type":37,"value":2343},"Ventaja:",{"type":37,"value":2345}," Ambiente controlado, repetible, ejecuta en cada commit",{"type":32,"tag":2336,"props":2347,"children":2348},{},[2349,2354],{"type":32,"tag":2326,"props":2350,"children":2351},{},[2352],{"type":37,"value":2353},"Desventaja:",{"type":37,"value":2355}," No captura variabilidad de dispositivos reales, no simula estado de cache",{"type":32,"tag":2336,"props":2357,"children":2358},{},[2359,2364],{"type":32,"tag":2326,"props":2360,"children":2361},{},[2362],{"type":37,"value":2363},"Uso:",{"type":37,"value":2365}," En pipeline CI para prevención de regresión — \"¿este PR corre riesgo de ralentización?\"",{"type":32,"tag":33,"props":2367,"children":2368},{},[2369],{"type":32,"tag":2326,"props":2370,"children":2371},{},[2372],{"type":37,"value":2373},"RUM (usuario real):",{"type":32,"tag":2332,"props":2375,"children":2376},{},[2377,2386,2395],{"type":32,"tag":2336,"props":2378,"children":2379},{},[2380,2384],{"type":32,"tag":2326,"props":2381,"children":2382},{},[2383],{"type":37,"value":2343},{"type":37,"value":2385}," Datos de usuarios reales, captura edge cases (ej: \"iPhone 11 Safari: LCP 5s\")",{"type":32,"tag":2336,"props":2387,"children":2388},{},[2389,2393],{"type":32,"tag":2326,"props":2390,"children":2391},{},[2392],{"type":37,"value":2353},{"type":37,"value":2394}," Datos ruidosos (muchos outliers), no avisa antes del deployment",{"type":32,"tag":2336,"props":2396,"children":2397},{},[2398,2402],{"type":32,"tag":2326,"props":2399,"children":2400},{},[2401],{"type":37,"value":2363},{"type":37,"value":2403}," Monitoreo en vivo — \"¿este nuevo deployment rompió rendimiento?\"",{"type":32,"tag":33,"props":2405,"children":2406},{},[2407],{"type":37,"value":2408},"Un sistema robusto usa ambos. Si Lighthouse presupuesto falla, deployment se bloquea. Si pasa, RUM valida números reales en 2 horas. Si RUM muestra regresión, haces rollback.",{"type":32,"tag":33,"props":2410,"children":2411},{},[2412],{"type":37,"value":2413},"Ejemplo: agregar un nuevo selector de variantes en storefront Shopify. Lighthouse CI mostró 380ms TBT (presupuesto: 200ms). PR rechazado. El dev implementó code-split + lazy-load, Lighthouse mostró 150ms TBT, merge aprobado. 4 horas post-producción, RUM mostró INP p75 subiendo de 120ms a 145ms — aceptable (presupuesto 200ms). Deployment se mantuvo.",{"type":32,"tag":40,"props":2415,"children":2417},{"id":2416},"integrar-alarmas-de-regresión-en-el-pipeline-de-deployment",[2418],{"type":37,"value":2419},"Integrar Alarmas de Regresión en el Pipeline de Deployment",{"type":32,"tag":33,"props":2421,"children":2422},{},[2423],{"type":37,"value":2424},"Una alarma RUM desconectada del deployment pierde contexto. Sabes que \"LCP empeoró\" pero no cuál deployment lo causó. Necesitas inyectar metadata del deployment en cada evento RUM.",{"type":32,"tag":33,"props":2426,"children":2427},{},[2428,2430,2436],{"type":37,"value":2429},"Vercel\u002FNetlify tiene variable de entorno ",{"type":32,"tag":67,"props":2431,"children":2433},{"className":2432},[],[2434],{"type":37,"value":2435},"VERCEL_GIT_COMMIT_SHA",{"type":37,"value":2437},". La inyectas en frontend, agregándola a cada evento RUM:",{"type":32,"tag":75,"props":2439,"children":2441},{"code":2440,"language":1202,"meta":16,"className":1203,"style":16},"\u002F\u002F nuxt.config.ts\nexport default defineNuxtConfig({\n runtimeConfig: {\n public: {\n deploymentId: process.env.VERCEL_GIT_COMMIT_SHA || 'local',\n deploymentTime: Date.now()\n }\n }\n});\n\n\u002F\u002F analytics\u002Fweb-vitals.ts\nfunction sendToAnalytics(metric: Metric) {\n const config = useRuntimeConfig();\n const body = JSON.stringify({\n ...metric,\n deploymentId: config.public.deploymentId,\n deploymentTime: config.public.deploymentTime\n });\n navigator.sendBeacon('\u002Fapi\u002Fvitals', body);\n}\n",[2442],{"type":32,"tag":67,"props":2443,"children":2444},{"__ignoreMap":16},[2445,2453,2475,2483,2491,2517,2533,2540,2547,2555,2562,2569,2600,2626,2657,2670,2678,2686,2693,2717],{"type":32,"tag":85,"props":2446,"children":2447},{"class":87,"line":88},[2448],{"type":32,"tag":85,"props":2449,"children":2450},{"style":92},[2451],{"type":37,"value":2452},"\u002F\u002F nuxt.config.ts\n",{"type":32,"tag":85,"props":2454,"children":2455},{"class":87,"line":98},[2456,2461,2466,2471],{"type":32,"tag":85,"props":2457,"children":2458},{"style":990},[2459],{"type":37,"value":2460},"export",{"type":32,"tag":85,"props":2462,"children":2463},{"style":990},[2464],{"type":37,"value":2465}," default",{"type":32,"tag":85,"props":2467,"children":2468},{"style":1263},[2469],{"type":37,"value":2470}," defineNuxtConfig",{"type":32,"tag":85,"props":2472,"children":2473},{"style":102},[2474],{"type":37,"value":1330},{"type":32,"tag":85,"props":2476,"children":2477},{"class":87,"line":108},[2478],{"type":32,"tag":85,"props":2479,"children":2480},{"style":102},[2481],{"type":37,"value":2482}," runtimeConfig: {\n",{"type":32,"tag":85,"props":2484,"children":2485},{"class":87,"line":123},[2486],{"type":32,"tag":85,"props":2487,"children":2488},{"style":102},[2489],{"type":37,"value":2490}," public: {\n",{"type":32,"tag":85,"props":2492,"children":2493},{"class":87,"line":136},[2494,2499,2503,2508,2513],{"type":32,"tag":85,"props":2495,"children":2496},{"style":102},[2497],{"type":37,"value":2498}," deploymentId: process.env.",{"type":32,"tag":85,"props":2500,"children":2501},{"style":112},[2502],{"type":37,"value":2435},{"type":32,"tag":85,"props":2504,"children":2505},{"style":990},[2506],{"type":37,"value":2507}," ||",{"type":32,"tag":85,"props":2509,"children":2510},{"style":150},[2511],{"type":37,"value":2512}," 'local'",{"type":32,"tag":85,"props":2514,"children":2515},{"style":102},[2516],{"type":37,"value":158},{"type":32,"tag":85,"props":2518,"children":2519},{"class":87,"line":161},[2520,2525,2529],{"type":32,"tag":85,"props":2521,"children":2522},{"style":102},[2523],{"type":37,"value":2524}," deploymentTime: Date.",{"type":32,"tag":85,"props":2526,"children":2527},{"style":1263},[2528],{"type":37,"value":1407},{"type":32,"tag":85,"props":2530,"children":2531},{"style":102},[2532],{"type":37,"value":1412},{"type":32,"tag":85,"props":2534,"children":2535},{"class":87,"line":174},[2536],{"type":32,"tag":85,"props":2537,"children":2538},{"style":102},[2539],{"type":37,"value":556},{"type":32,"tag":85,"props":2541,"children":2542},{"class":87,"line":26},[2543],{"type":32,"tag":85,"props":2544,"children":2545},{"style":102},[2546],{"type":37,"value":565},{"type":32,"tag":85,"props":2548,"children":2549},{"class":87,"line":254},[2550],{"type":32,"tag":85,"props":2551,"children":2552},{"style":102},[2553],{"type":37,"value":2554},"});\n",{"type":32,"tag":85,"props":2556,"children":2557},{"class":87,"line":292},[2558],{"type":32,"tag":85,"props":2559,"children":2560},{"emptyLinePlaceholder":1249},[2561],{"type":37,"value":1252},{"type":32,"tag":85,"props":2563,"children":2564},{"class":87,"line":330},[2565],{"type":32,"tag":85,"props":2566,"children":2567},{"style":92},[2568],{"type":37,"value":1215},{"type":32,"tag":85,"props":2570,"children":2571},{"class":87,"line":369},[2572,2576,2580,2584,2588,2592,2596],{"type":32,"tag":85,"props":2573,"children":2574},{"style":990},[2575],{"type":37,"value":1260},{"type":32,"tag":85,"props":2577,"children":2578},{"style":1263},[2579],{"type":37,"value":1266},{"type":32,"tag":85,"props":2581,"children":2582},{"style":102},[2583],{"type":37,"value":1271},{"type":32,"tag":85,"props":2585,"children":2586},{"style":1274},[2587],{"type":37,"value":1277},{"type":32,"tag":85,"props":2589,"children":2590},{"style":990},[2591],{"type":37,"value":1282},{"type":32,"tag":85,"props":2593,"children":2594},{"style":1263},[2595],{"type":37,"value":1287},{"type":32,"tag":85,"props":2597,"children":2598},{"style":102},[2599],{"type":37,"value":1292},{"type":32,"tag":85,"props":2601,"children":2602},{"class":87,"line":378},[2603,2607,2612,2616,2621],{"type":32,"tag":85,"props":2604,"children":2605},{"style":990},[2606],{"type":37,"value":1300},{"type":32,"tag":85,"props":2608,"children":2609},{"style":112},[2610],{"type":37,"value":2611}," config",{"type":32,"tag":85,"props":2613,"children":2614},{"style":990},[2615],{"type":37,"value":1310},{"type":32,"tag":85,"props":2617,"children":2618},{"style":1263},[2619],{"type":37,"value":2620}," useRuntimeConfig",{"type":32,"tag":85,"props":2622,"children":2623},{"style":102},[2624],{"type":37,"value":2625},"();\n",{"type":32,"tag":85,"props":2627,"children":2628},{"class":87,"line":387},[2629,2633,2637,2641,2645,2649,2653],{"type":32,"tag":85,"props":2630,"children":2631},{"style":990},[2632],{"type":37,"value":1300},{"type":32,"tag":85,"props":2634,"children":2635},{"style":112},[2636],{"type":37,"value":1305},{"type":32,"tag":85,"props":2638,"children":2639},{"style":990},[2640],{"type":37,"value":1310},{"type":32,"tag":85,"props":2642,"children":2643},{"style":112},[2644],{"type":37,"value":1315},{"type":32,"tag":85,"props":2646,"children":2647},{"style":102},[2648],{"type":37,"value":1320},{"type":32,"tag":85,"props":2650,"children":2651},{"style":1263},[2652],{"type":37,"value":1325},{"type":32,"tag":85,"props":2654,"children":2655},{"style":102},[2656],{"type":37,"value":1330},{"type":32,"tag":85,"props":2658,"children":2659},{"class":87,"line":400},[2660,2665],{"type":32,"tag":85,"props":2661,"children":2662},{"style":990},[2663],{"type":37,"value":2664}," ...",{"type":32,"tag":85,"props":2666,"children":2667},{"style":102},[2668],{"type":37,"value":2669},"metric,\n",{"type":32,"tag":85,"props":2671,"children":2672},{"class":87,"line":422},[2673],{"type":32,"tag":85,"props":2674,"children":2675},{"style":102},[2676],{"type":37,"value":2677}," deploymentId: config.public.deploymentId,\n",{"type":32,"tag":85,"props":2679,"children":2680},{"class":87,"line":445},[2681],{"type":32,"tag":85,"props":2682,"children":2683},{"style":102},[2684],{"type":37,"value":2685}," deploymentTime: config.public.deploymentTime\n",{"type":32,"tag":85,"props":2687,"children":2688},{"class":87,"line":458},[2689],{"type":32,"tag":85,"props":2690,"children":2691},{"style":102},[2692],{"type":37,"value":1420},{"type":32,"tag":85,"props":2694,"children":2695},{"class":87,"line":471},[2696,2701,2705,2709,2713],{"type":32,"tag":85,"props":2697,"children":2698},{"style":102},[2699],{"type":37,"value":2700}," navigator.",{"type":32,"tag":85,"props":2702,"children":2703},{"style":1263},[2704],{"type":37,"value":1461},{"type":32,"tag":85,"props":2706,"children":2707},{"style":102},[2708],{"type":37,"value":1271},{"type":32,"tag":85,"props":2710,"children":2711},{"style":150},[2712],{"type":37,"value":1470},{"type":32,"tag":85,"props":2714,"children":2715},{"style":102},[2716],{"type":37,"value":1475},{"type":32,"tag":85,"props":2718,"children":2719},{"class":87,"line":493},[2720],{"type":32,"tag":85,"props":2721,"children":2722},{"style":102},[2723],{"type":37,"value":574},{"type":32,"tag":33,"props":2725,"children":2726},{},[2727],{"type":37,"value":2728},"En BigQuery, consultas así:",{"type":32,"tag":75,"props":2730,"children":2732},{"code":2731,"language":1769,"meta":16,"className":1770,"style":16},"SELECT\n deployment_id,\n FROM_UNIXTIME(deployment_time \u002F 1000) AS deployed_at,\n APPROX_QUANTILES(lcp_value, 100)[OFFSET(75)] AS lcp_p75,\n COUNT(*) AS sample_size\nFROM `project.dataset.web_vitals`\nWHERE timestamp >= TIMESTAMP_SUB(CURRENT_TIMESTAMP(), INTERVAL 24 HOUR)\nGROUP BY deployment_id, deployment_time\nORDER BY deployed_at DESC\n",[2733],{"type":32,"tag":67,"props":2734,"children":2735},{"__ignoreMap":16},[2736,2743,2751,2781,2805,2835,2846,2886,2899],{"type":32,"tag":85,"props":2737,"children":2738},{"class":87,"line":88},[2739],{"type":32,"tag":85,"props":2740,"children":2741},{"style":990},[2742],{"type":37,"value":2081},{"type":32,"tag":85,"props":2744,"children":2745},{"class":87,"line":98},[2746],{"type":32,"tag":85,"props":2747,"children":2748},{"style":102},[2749],{"type":37,"value":2750}," deployment_id,\n",{"type":32,"tag":85,"props":2752,"children":2753},{"class":87,"line":108},[2754,2759,2763,2768,2772,2776],{"type":32,"tag":85,"props":2755,"children":2756},{"style":102},[2757],{"type":37,"value":2758}," FROM_UNIXTIME(deployment_time ",{"type":32,"tag":85,"props":2760,"children":2761},{"style":990},[2762],{"type":37,"value":2172},{"type":32,"tag":85,"props":2764,"children":2765},{"style":112},[2766],{"type":37,"value":2767}," 1000",{"type":32,"tag":85,"props":2769,"children":2770},{"style":102},[2771],{"type":37,"value":2167},{"type":32,"tag":85,"props":2773,"children":2774},{"style":990},[2775],{"type":37,"value":1800},{"type":32,"tag":85,"props":2777,"children":2778},{"style":102},[2779],{"type":37,"value":2780}," deployed_at,\n",{"type":32,"tag":85,"props":2782,"children":2783},{"class":87,"line":123},[2784,2789,2793,2797,2801],{"type":32,"tag":85,"props":2785,"children":2786},{"style":102},[2787],{"type":37,"value":2788}," APPROX_QUANTILES(lcp_value, ",{"type":32,"tag":85,"props":2790,"children":2791},{"style":112},[2792],{"type":37,"value":1826},{"type":32,"tag":85,"props":2794,"children":2795},{"style":102},[2796],{"type":37,"value":1831},{"type":32,"tag":85,"props":2798,"children":2799},{"style":990},[2800],{"type":37,"value":1800},{"type":32,"tag":85,"props":2802,"children":2803},{"style":102},[2804],{"type":37,"value":1840},{"type":32,"tag":85,"props":2806,"children":2807},{"class":87,"line":136},[2808,2813,2817,2822,2826,2830],{"type":32,"tag":85,"props":2809,"children":2810},{"style":112},[2811],{"type":37,"value":2812}," COUNT",{"type":32,"tag":85,"props":2814,"children":2815},{"style":102},[2816],{"type":37,"value":1271},{"type":32,"tag":85,"props":2818,"children":2819},{"style":990},[2820],{"type":37,"value":2821},"*",{"type":32,"tag":85,"props":2823,"children":2824},{"style":102},[2825],{"type":37,"value":2167},{"type":32,"tag":85,"props":2827,"children":2828},{"style":990},[2829],{"type":37,"value":1800},{"type":32,"tag":85,"props":2831,"children":2832},{"style":102},[2833],{"type":37,"value":2834}," sample_size\n",{"type":32,"tag":85,"props":2836,"children":2837},{"class":87,"line":161},[2838,2842],{"type":32,"tag":85,"props":2839,"children":2840},{"style":990},[2841],{"type":37,"value":2212},{"type":32,"tag":85,"props":2843,"children":2844},{"style":150},[2845],{"type":37,"value":1878},{"type":32,"tag":85,"props":2847,"children":2848},{"class":87,"line":174},[2849,2853,2857,2861,2865,2869,2873,2878,2882],{"type":32,"tag":85,"props":2850,"children":2851},{"style":990},[2852],{"type":37,"value":2225},{"type":32,"tag":85,"props":2854,"children":2855},{"style":990},[2856],{"type":37,"value":1891},{"type":32,"tag":85,"props":2858,"children":2859},{"style":990},[2860],{"type":37,"value":1896},{"type":32,"tag":85,"props":2862,"children":2863},{"style":102},[2864],{"type":37,"value":1901},{"type":32,"tag":85,"props":2866,"children":2867},{"style":112},[2868],{"type":37,"value":1906},{"type":32,"tag":85,"props":2870,"children":2871},{"style":102},[2872],{"type":37,"value":1911},{"type":32,"tag":85,"props":2874,"children":2875},{"style":112},[2876],{"type":37,"value":2877},"24",{"type":32,"tag":85,"props":2879,"children":2880},{"style":990},[2881],{"type":37,"value":1921},{"type":32,"tag":85,"props":2883,"children":2884},{"style":102},[2885],{"type":37,"value":1926},{"type":32,"tag":85,"props":2887,"children":2888},{"class":87,"line":26},[2889,2894],{"type":32,"tag":85,"props":2890,"children":2891},{"style":990},[2892],{"type":37,"value":2893},"GROUP BY",{"type":32,"tag":85,"props":2895,"children":2896},{"style":102},[2897],{"type":37,"value":2898}," deployment_id, deployment_time\n",{"type":32,"tag":85,"props":2900,"children":2901},{"class":87,"line":254},[2902,2907,2912],{"type":32,"tag":85,"props":2903,"children":2904},{"style":990},[2905],{"type":37,"value":2906},"ORDER BY",{"type":32,"tag":85,"props":2908,"children":2909},{"style":102},[2910],{"type":37,"value":2911}," deployed_at ",{"type":32,"tag":85,"props":2913,"children":2914},{"style":990},[2915],{"type":37,"value":2916},"DESC\n",{"type":32,"tag":33,"props":2918,"children":2919},{},[2920],{"type":37,"value":2921},"Resultado:",{"type":32,"tag":1619,"props":2923,"children":2924},{},[2925,2950],{"type":32,"tag":1623,"props":2926,"children":2927},{},[2928],{"type":32,"tag":1627,"props":2929,"children":2930},{},[2931,2936,2941,2945],{"type":32,"tag":1631,"props":2932,"children":2933},{},[2934],{"type":37,"value":2935},"deployment_id",{"type":32,"tag":1631,"props":2937,"children":2938},{},[2939],{"type":37,"value":2940},"deployed_at",{"type":32,"tag":1631,"props":2942,"children":2943},{},[2944],{"type":37,"value":2098},{"type":32,"tag":1631,"props":2946,"children":2947},{},[2948],{"type":37,"value":2949},"sample_size",{"type":32,"tag":1657,"props":2951,"children":2952},{},[2953,2976],{"type":32,"tag":1627,"props":2954,"children":2955},{},[2956,2961,2966,2971],{"type":32,"tag":1664,"props":2957,"children":2958},{},[2959],{"type":37,"value":2960},"a3f2b19",{"type":32,"tag":1664,"props":2962,"children":2963},{},[2964],{"type":37,"value":2965},"2026-07-30 14:22:00",{"type":32,"tag":1664,"props":2967,"children":2968},{},[2969],{"type":37,"value":2970},"3.1s",{"type":32,"tag":1664,"props":2972,"children":2973},{},[2974],{"type":37,"value":2975},"2,340",{"type":32,"tag":1627,"props":2977,"children":2978},{},[2979,2984,2989,2994],{"type":32,"tag":1664,"props":2980,"children":2981},{},[2982],{"type":37,"value":2983},"c8d4e21",{"type":32,"tag":1664,"props":2985,"children":2986},{},[2987],{"type":37,"value":2988},"2026-07-30 09:15:00",{"type":32,"tag":1664,"props":2990,"children":2991},{},[2992],{"type":37,"value":2993},"1.9s",{"type":32,"tag":1664,"props":2995,"children":2996},{},[2997],{"type":37,"value":2998},"4,120",{"type":32,"tag":33,"props":3000,"children":3001},{},[3002],{"type":37,"value":3003},"Deployment de 14:22 causó salto de LCP de 1.9s",{"type":32,"tag":3005,"props":3006,"children":3007},"style",{},[3008],{"type":37,"value":3009},"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":108,"depth":108,"links":3011},[3012,3013,3014,3017,3018],{"id":42,"depth":98,"text":45},{"id":596,"depth":98,"text":599},{"id":1185,"depth":98,"text":1188,"children":3015},[3016],{"id":1757,"depth":108,"text":1760},{"id":2313,"depth":98,"text":2316},{"id":2416,"depth":98,"text":2419},"markdown","content:es:tech:presupuestos-rendimiento-web-conectar-decision.md","content","es\u002Ftech\u002Fpresupuestos-rendimiento-web-conectar-decision.md","es\u002Ftech\u002Fpresupuestos-rendimiento-web-conectar-decision","md",1785967481511]