claude-haiku-4-5 @ medium · CC

CCmedium

config: claude-haiku-4-5-eff-medium--cli--claude-code--dev
batch: 2026-07-19--unified
transport: claude-code-cli-headless
protocol: cli · plan
served model: claude-haiku-4-5
采集于: 2026年7月18日 11:54 · N=2

该 model 的全部 effort 与 arm →

variant

live

slot 0 · P-q · sandboxed iframe

claude-haiku-4-5 @medium · CC P-q slot 0 截图

截图是 similarity 通道测量时的原始像素。运行 live 会在 sandboxed iframe 中重新执行原始输出;渲染结果取决于你的浏览器和字体,不保证与测量像素一致。

similarity 邻居

Fidelity —— 卡片展示的数据对不对?

namematch
conditionmatch
datenot-foundno-parseable-date
max tempambiguousinsufficient-distinct-temperature-nodes
min tempambiguousinsufficient-distinct-temperature-nodes
hourlyambiguouscoverage · 0 命中 · 0 不符 · 24 未展示
request sidematch0 处违规

extractor fidelity-extractor-v1+Berlin-2026-07-15

源码 —— 原始模型输出,一字节未改

下载 card.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Weather Card</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }

        .container {
            width: 100%;
            height: calc(100vh - 40px);
            max-width: 1280px;
            max-height: 800px;
        }

        .card {
            background: white;
            border-radius: 24px;
            padding: 48px;
            box-shadow: 0 25px 80px rgba(0, 0, 0, 0.25);
            height: 100%;
            display: flex;
            flex-direction: column;
            gap: 40px;
        }

        .header {
            display: flex;
            justify-content: space-between;
            align-items: baseline;
        }

        .location-name {
            font-size: 36px;
            font-weight: 700;
            color: #111;
            letter-spacing: -0.5px;
        }

        .date {
            font-size: 16px;
            color: #888;
            font-weight: 400;
        }

        .main-section {
            display: flex;
            align-items: flex-start;
            gap: 48px;
            flex: 1;
        }

        .weather-display {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 24px;
        }

        .weather-icon {
            font-size: 120px;
            line-height: 1;
            filter: drop-shadow(0 4px 12px rgba(102, 126, 234, 0.3));
        }

        .condition {
            font-size: 18px;
            color: #666;
            text-align: center;
            min-height: 36px;
            display: flex;
            align-items: center;
        }

        .temperature-display {
            display: flex;
            flex-direction: column;
            gap: 32px;
            flex: 1;
        }

        .temperature-large {
            font-size: 96px;
            font-weight: 700;
            color: #111;
            line-height: 1;
            letter-spacing: -2px;
        }

        .temp-stats {
            display: flex;
            gap: 48px;
        }

        .stat {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .stat-label {
            font-size: 12px;
            color: #999;
            text-transform: uppercase;
            letter-spacing: 1.2px;
            font-weight: 600;
        }

        .stat-value {
            font-size: 32px;
            font-weight: 600;
            color: #111;
        }

        .hourly-section {
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        .hourly-title {
            font-size: 14px;
            font-weight: 600;
            color: #111;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .hourly-grid {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 6px;
            height: 180px;
            padding: 20px;
            background: linear-gradient(135deg, #f8f9fa 0%, #f0f1f5 100%);
            border-radius: 16px;
        }

        .hourly-item {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8px;
            min-width: 0;
        }

        .hourly-bar {
            width: 100%;
            background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
            border-radius: 6px 6px 0 0;
            transition: all 0.2s ease;
            cursor: pointer;
            position: relative;
        }

        .hourly-bar:hover {
            filter: brightness(0.95);
            box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
        }

        .hourly-temp {
            font-size: 12px;
            font-weight: 600;
            color: #111;
            white-space: nowrap;
            min-height: 16px;
        }

        .hourly-time {
            font-size: 10px;
            color: #aaa;
            white-space: nowrap;
        }

        .error {
            padding: 24px;
            background: linear-gradient(135deg, #ffe0e0 0%, #ffe8e8 100%);
            color: #c33;
            border-radius: 12px;
            font-size: 16px;
            border-left: 4px solid #c33;
        }

        .loading {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 16px;
            color: #666;
            font-size: 18px;
            height: 100%;
        }

        .spinner {
            width: 24px;
            height: 24px;
            border: 3px solid #ddd;
            border-top-color: #667eea;
            border-radius: 50%;
            animation: spin 1s linear infinite;
        }

        @keyframes spin {
            to { transform: rotate(360deg); }
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="card" id="card">
            <div id="content">
                <div class="loading">
                    <div class="spinner"></div>
                    Loading weather data...
                </div>
            </div>
        </div>
    </div>

    <script>
        const weatherDescriptions = {
            0: 'Clear sky', 1: 'Mainly clear', 2: 'Partly cloudy', 3: 'Overcast',
            45: 'Foggy', 48: 'Depositing rime fog',
            51: 'Light drizzle', 53: 'Moderate drizzle', 55: 'Dense drizzle',
            61: 'Slight rain', 63: 'Moderate rain', 65: 'Heavy rain',
            71: 'Slight snow', 73: 'Moderate snow', 75: 'Heavy snow', 77: 'Snow grains',
            80: 'Slight showers', 81: 'Moderate showers', 82: 'Heavy showers',
            85: 'Snow showers', 86: 'Heavy snow showers',
            95: 'Thunderstorm', 96: 'Thunderstorm with hail', 99: 'Heavy thunderstorm',
        };

        const weatherIcons = {
            0: '☀️', 1: '🌤️', 2: '⛅', 3: '☁️', 45: '🌫️', 48: '🌫️',
            51: '🌧️', 53: '🌧️', 55: '🌧️', 61: '🌧️', 63: '🌧️', 65: '⛈️',
            71: '❄️', 73: '❄️', 75: '❄️', 77: '❄️',
            80: '🌧️', 81: '🌧️', 82: '⛈️',
            85: '❄️', 86: '❄️',
            95: '⛈️', 96: '⛈️', 99: '⛈️',
        };

        async function init() {
            try {
                const params = new URLSearchParams(window.location.search);
                const lat = parseFloat(params.get('lat') || '52.52');
                const lon = parseFloat(params.get('lon') || '13.405');
                const name = params.get('name') || 'Berlin';
                const dateStr = params.get('date') || new Date().toISOString().split('T')[0];

                const today = new Date().toISOString().split('T')[0];
                const apiPath = dateStr < today ? '/api/om/archive' : '/api/om/forecast';

                const url = new URL(apiPath, window.location.origin);
                url.searchParams.set('latitude', lat);
                url.searchParams.set('longitude', lon);
                url.searchParams.set('daily', 'temperature_2m_max,temperature_2m_min,weather_code');
                url.searchParams.set('hourly', 'temperature_2m');
                url.searchParams.set('timezone', 'UTC');
                url.searchParams.set('temperature_unit', 'celsius');
                url.searchParams.set('start_date', dateStr);
                url.searchParams.set('end_date', dateStr);

                const response = await fetch(url.toString());
                if (!response.ok) throw new Error(`API error: ${response.status}`);

                const data = await response.json();
                const dateIndex = data.daily.time.indexOf(dateStr);
                if (dateIndex === -1) throw new Error('Date not found');

                const maxTemp = data.daily.temperature_2m_max[dateIndex];
                const minTemp = data.daily.temperature_2m_min[dateIndex];
                const weatherCode = data.daily.weather_code[dateIndex];

                const dateStart = new Date(dateStr + 'T00:00:00Z');
                const dateEnd = new Date(dateStr + 'T23:59:59Z');
                const hourlyData = [];

                for (let i = 0; i < data.hourly.time.length; i++) {
                    const time = new Date(data.hourly.time[i]);
                    if (time >= dateStart && time <= dateEnd) {
                        hourlyData.push({
                            time: time.toISOString().split('T')[1].slice(0, 5),
                            temp: data.hourly.temperature_2m[i]
                        });
                    }
                }

                renderCard(name, dateStr, maxTemp, minTemp, weatherCode, hourlyData);
            } catch (error) {
                renderError(error.message);
            }
        }

        function renderCard(name, dateStr, maxTemp, minTemp, weatherCode, hourlyData) {
            const contentDiv = document.getElementById('content');
            const condition = weatherDescriptions[weatherCode] || 'Unknown';
            const icon = weatherIcons[weatherCode] || '🌡️';

            const dateObj = new Date(dateStr + 'T00:00:00Z');
            const dateFormatted = dateObj.toLocaleDateString('en-US', {
                weekday: 'short',
                month: 'short',
                day: 'numeric'
            });

            const temps = hourlyData.map(h => h.temp);
            const minHourly = Math.min(...temps);
            const maxHourly = Math.max(...temps);
            const tempRange = maxHourly - minHourly || 1;

            const sampleRate = Math.max(1, Math.ceil(hourlyData.length / 24));
            let hourlyHtml = '';

            for (let i = 0; i < hourlyData.length; i += sampleRate) {
                const d = hourlyData[i];
                const heightPercent = ((d.temp - minHourly) / tempRange) * 100;
                hourlyHtml += `
                    <div class="hourly-item">
                        <div class="hourly-bar" style="height: ${Math.max(8, heightPercent)}%;"></div>
                        <div class="hourly-temp">${Math.round(d.temp)}°</div>
                        <div class="hourly-time">${d.time}</div>
                    </div>
                `;
            }

            contentDiv.innerHTML = `
                <div class="header">
                    <div>
                        <div class="location-name">${name}</div>
                        <div class="date">${dateFormatted}</div>
                    </div>
                </div>
                <div class="main-section">
                    <div class="weather-display">
                        <div class="weather-icon">${icon}</div>
                        <div class="condition">${condition}</div>
                    </div>
                    <div class="temperature-display">
                        <div class="temperature-large">${Math.round(maxTemp)}°</div>
                        <div class="temp-stats">
                            <div class="stat">
                                <div class="stat-label">High</div>
                                <div class="stat-value">${Math.round(maxTemp)}°C</div>
                            </div>
                            <div class="stat">
                                <div class="stat-label">Low</div>
                                <div class="stat-value">${Math.round(minTemp)}°C</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="hourly-section">
                    <div class="hourly-title">Hourly Temperature</div>
                    <div class="hourly-grid">
                        ${hourlyHtml}
                    </div>
                </div>
            `;
        }

        function renderError(message) {
            const contentDiv = document.getElementById('content');
            contentDiv.innerHTML = `<div class="error">Unable to load weather data: ${message}</div>`;
        }

        init();
    </script>
</body>
</html>

L1 —— 廉价的确定性描述量

bytes 总计	12,615	html / css / js	541 / 5,182 / 6,892
dom 节点	13	dom 深度	7
css 规则	30	含 js	是
brightness	237.8	contrast	42.9
colorfulness	25.8	留白	90.4%

该 slot 的 telemetry

prompt tokens	9	completion tokens	11,889
total tokens	11,898	wall	98.1 s
cost	—	request id	—

config.json581 B

{
  "N": 2,
  "auth": {
    "credential_ref": "WCB_NONE",
    "method": "oauth-login"
  },
  "billing": "plan",
  "config_id": "claude-haiku-4-5-eff-medium--cli--claude-code--dev",
  "effort": "medium",
  "family": "claude",
  "m": {
    "min": 2,
    "q": 2
  },
  "model_id": "claude-haiku-4-5",
  "protocol": "cli",
  "served_model": "claude-haiku-4-5",
  "telemetry": {
    "completion_tokens": 31323,
    "cost_usd": null,
    "prompt_tokens": 41,
    "total_tokens": 31364,
    "wall_ms": 239025
  },
  "transport": "claude-code-cli-headless",
  "vendor_sanction_ref": null
}

send-log2.5 KB

{
  "N": 2,
  "batch_id": "2026-07-17--dev-cc-haiku45",
  "config_id": "claude-haiku-4-5-eff-medium--cli--claude-code--dev",
  "positions": [
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T13:57:37.822594+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T13:56:49.038673+00:00"
        }
      ],
      "block_index": 0,
      "model_reaching_attempt_index": 0,
      "slot_index": 0,
      "terminal_state": "valid",
      "variant": "P-min"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T13:59:19.895266+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T13:57:41.813635+00:00"
        }
      ],
      "block_index": 0,
      "model_reaching_attempt_index": 0,
      "slot_index": 0,
      "terminal_state": "valid",
      "variant": "P-q"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:00:05.360889+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T13:59:23.047631+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "valid",
      "variant": "P-q"
    },
    {
      "attempts": [
        {
          "attempt_index": 0,
          "backoff_ms": null,
          "charged": true,
          "ended_at": "2026-07-17T14:00:59.144468+00:00",
          "http_status": null,
          "outcome": "valid",
          "reached_model": true,
          "reason": "ok",
          "request_id": null,
          "started_at": "2026-07-17T14:00:09.293183+00:00"
        }
      ],
      "block_index": 1,
      "model_reaching_attempt_index": 0,
      "slot_index": 1,
      "terminal_state": "valid",
      "variant": "P-min"
    }
  ],
  "retry_policy": {
    "max_unreachable_retries": 5,
    "rate_limit_backoff": {
      "max_attempts": 4,
      "max_total_ms": 60000
    }
  }
}