revise February 2022 performance budget articles

2026-07-31 13:31:37 +03:00
parent f7f88fb2a5
commit a4b475a308
7 changed files with 1148 additions and 1 deletions
@@ -0,0 +1,75 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 720" role="img" aria-labelledby="title desc">
+  <title id="title">Диагностический маршрут для budget comparison</title>
+  <desc id="desc">Схема начинается с проверки route, scenario и declared conditions. При несовпадении comparison останавливается. При совпадении сначала проверяются именованные компоненты, затем aggregate. scriptTicks 34 при allowed 30 ведёт к focused action, хотя total 93 при allowed 98 остаётся aggregate pass.</desc>
+  <defs>
+    <style>
+      .bg { fill: #f8fafc; }
+      .title { fill: #102a43; font: 700 25px Arial, sans-serif; }
+      .subtitle { fill: #486581; font: 15px Arial, sans-serif; }
+      .label { fill: #102a43; font: 700 16px Arial, sans-serif; }
+      .small { fill: #334e68; font: 14px Arial, sans-serif; }
+      .tiny { fill: #486581; font: 13px Arial, sans-serif; }
+      .card { fill: #ffffff; stroke: #bcccdc; stroke-width: 1.5; }
+      .pass { fill: #f0fff4; stroke: #68d391; stroke-width: 1.5; }
+      .fail { fill: #fff5f5; stroke: #fc8181; stroke-width: 1.5; }
+      .stop { fill: #fffaf0; stroke: #dd6b20; stroke-width: 1.5; }
+      .arrow { stroke: #486581; stroke-width: 2.2; fill: none; marker-end: url(#arrow); }
+      .red-arrow { stroke: #c53030; stroke-width: 2.2; fill: none; marker-end: url(#red-arrow); }
+    </style>
+    <marker id="arrow" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse"><path d="M 0 0 L 10 5 L 0 10 z" fill="#486581"/></marker>
+    <marker id="red-arrow" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse"><path d="M 0 0 L 10 5 L 0 10 z" fill="#c53030"/></marker>
+  </defs>
+  <rect class="bg" width="480" height="720" rx="22"/>
+  <text class="title" x="30" y="44">Диагностика: ограничить вывод</text>
+  <text class="subtitle" x="30" y="70">Budget comparison — не глобальная оценка скорости.</text>
+
+  <g transform="translate(30 96)">
+    <rect class="card" width="420" height="70" rx="12"/>
+    <text class="label" x="18" y="27">1. Measurement contract</text>
+    <text class="small" x="18" y="50">route + scenario + conditions match?</text>
+  </g>
+  <path class="arrow" d="M 240 166 L 240 194"/>
+  <text class="tiny" x="252" y="184">yes</text>
+  <path class="arrow" d="M 110 166 L 110 204 L 52 204 L 52 232"/>
+  <text class="tiny" x="60" y="197">no</text>
+  <g transform="translate(30 236)">
+    <rect class="stop" width="158" height="86" rx="12"/>
+    <text class="label" x="14" y="27">Stop compare</text>
+    <text class="small" x="14" y="49">not-comparable</text>
+    <text class="tiny" x="14" y="69">restore one contract</text>
+  </g>
+  <g transform="translate(218 198)">
+    <rect class="card" width="232" height="86" rx="12"/>
+    <text class="label" x="16" y="27">2. Named checks</text>
+    <text class="small" x="16" y="49">actual / (limit + tolerance)</text>
+    <text class="tiny" x="16" y="69">every component remains visible</text>
+  </g>
+  <path class="arrow" d="M 334 284 L 334 314"/>
+  <g transform="translate(218 318)">
+    <rect class="fail" width="232" height="82" rx="12"/>
+    <text class="label" x="16" y="26">scriptTicks FAIL</text>
+    <text class="small" x="16" y="48">34 is greater than allowed 30</text>
+    <text class="tiny" x="16" y="68">named component only</text>
+  </g>
+  <path class="red-arrow" d="M 334 400 L 334 432"/>
+  <g transform="translate(218 436)">
+    <rect class="pass" width="232" height="68" rx="12"/>
+    <text class="label" x="16" y="26">3. Aggregate PASS</text>
+    <text class="small" x="16" y="48">93 is within allowed 98</text>
+  </g>
+  <text class="tiny" x="42" y="459">context only:</text>
+  <text class="tiny" x="42" y="477">cannot cancel</text>
+  <text class="tiny" x="42" y="495">the red branch</text>
+  <path class="red-arrow" d="M 334 504 L 334 536"/>
+  <g transform="translate(30 540)">
+    <rect class="fail" width="420" height="72" rx="12"/>
+    <text class="label" x="18" y="27">4. Focused action</text>
+    <text class="small" x="18" y="50">inspect script input and one route boundary</text>
+  </g>
+  <path class="arrow" d="M 240 612 L 240 632"/>
+  <g transform="translate(30 636)">
+    <rect class="stop" width="420" height="58" rx="12"/>
+    <text class="small" x="18" y="24">Allowed claim: one named rule failed under declared conditions.</text>
+    <text class="tiny" x="18" y="43">Not allowed: global speed, browser trace, real-user or SLA verdict.</text>
+  </g>
+</svg>