/** * WPDO Post Stress Test — admin tab JS (v2.11.4) * * Mirrors wpdo-stress-test.js (user side) but: * - Talks to /wpdo/v1/post-stress-test/* endpoints * - Sends post_type in start payload (user side has no entity selector) * - DOM IDs prefixed wpdo-pst-* to coexist on the same admin page * - Renders a smaller benchmark report (3 probes per post_type vs 6 for user) * * @since 2.11.4 */ ( function () { 'use strict'; const cfg = window.wpdoPostStressTest; if ( ! cfg || ! cfg.restUrl ) { return; } if ( ! document.querySelector( '.wpdo-post-stress-test-tab' ) ) { return; } const $ = ( sel ) => document.querySelector( sel ); const restUrl = cfg.restUrl.replace( /\/$/, '' ); const headers = { 'Content-Type': 'application/json', 'X-WP-Nonce': cfg.nonce }; let pollTimer = null; // ── API helpers ───────────────────────────────────────────────────────── async function apiCall( path, method = 'GET', body = null ) { const opts = { method, headers, credentials: 'same-origin' }; if ( body ) { opts.body = JSON.stringify( body ); } const resp = await fetch( restUrl + path, opts ); const text = await resp.text(); try { return { ok: resp.ok, status: resp.status, data: text ? JSON.parse( text ) : null }; } catch ( e ) { return { ok: false, status: resp.status, data: { error: text } }; } } // ── Rendering ─────────────────────────────────────────────────────────── function fmt( n ) { if ( n === null || n === undefined ) { return '—'; } return Number( n ).toLocaleString(); } function setText( sel, text ) { const el = $( sel ); if ( el ) { el.textContent = String( text ); } } function esc( s ) { if ( s === null || s === undefined ) { return ''; } return String( s ).replace( /[&<>"']/g, ( c ) => ( { '&': '&', '<': '<', '>': '>', '"': '"', "'": ''', }[ c ] ) ); } function renderProgress( state ) { const isRunning = state.status === 'running' || state.status === 'benchmarking'; const card = $( '#wpdo-pst-progress-card' ); if ( card ) { card.style.display = ( isRunning || state.status === 'completed' || state.status === 'failed' || state.status === 'cancelled' ) ? '' : 'none'; } setText( '#wpdo-pst-pg-status', state.status || 'idle' ); setText( '#wpdo-pst-pg-post-type', state.post_type || '' ); setText( '#wpdo-pst-pg-mode', state.mode || '' ); setText( '#wpdo-pst-pg-pct', ( state.pct || 0 ) + '%' ); setText( '#wpdo-pst-pg-processed', fmt( state.processed || 0 ) ); setText( '#wpdo-pst-pg-target', fmt( state.target || 0 ) ); setText( '#wpdo-pst-pg-rate', state.rate_per_sec || 0 ); setText( '#wpdo-pst-pg-elapsed', state.elapsed_sec || 0 ); setText( '#wpdo-pst-pg-eta', state.eta_sec || 0 ); setText( '#wpdo-pst-pg-batches', state.batches_done || 0 ); setText( '#wpdo-pst-pg-mem', ( ( state.peak_memory || 0 ) / 1048576 ).toFixed( 1 ) ); const bar = $( '#wpdo-pst-pg-bar' ); if ( bar ) { bar.style.width = ( state.pct || 0 ) + '%'; } const count = state.test_post_count || 0; setText( '#wpdo-pst-count', fmt( count ) ); setText( '#wpdo-pst-count-mirror', fmt( count ) ); const startBtn = $( '#wpdo-pst-start' ); const cancelBtn = $( '#wpdo-pst-cancel' ); const cleanupBtn = $( '#wpdo-pst-cleanup' ); const benchBtn = $( '#wpdo-pst-rerun-bench' ); if ( startBtn ) { startBtn.disabled = isRunning; } if ( cancelBtn ) { cancelBtn.disabled = ! isRunning; } if ( cleanupBtn ) { cleanupBtn.disabled = isRunning || count === 0; } if ( benchBtn ) { benchBtn.disabled = isRunning || count === 0; } } function renderBenchmark( bench ) { if ( ! bench ) { return; } const card = $( '#wpdo-pst-bench-card' ); const content = $( '#wpdo-pst-bench-content' ); if ( ! card || ! content ) { return; } card.style.display = ''; const w = bench.write || {}; const dbSizes = bench.db_sizes || []; const q = bench.query || {}; // Friendly labels for the per-post_type query probes const labels = { point_stock_status: 'Point lookup (_stock_status)', point_status: 'Point lookup (hp_status)', point_verified: 'Point lookup (hp_verified)', point_alt_present: 'Point lookup (alt 文字)', point_type: 'Point lookup (_menu_item_type)', point_thumbnail: 'Point lookup (_thumbnail_id)', range_price_above: 'Range scan (price > 100)', range_budget_above: 'Range scan (budget > 100)', range_rate_above: 'Range scan (hourly_rate > 50)', range_id_above: 'Range scan (post_id 排序)', eav_baseline: 'EAV baseline (wp_postmeta 直查)', }; let html = ''; // Write metrics html += '

▍ 寫入指標

'; html += ''; html += ``; html += ``; html += ``; html += ``; html += ``; html += ``; html += ``; html += ``; html += '
模式${ esc( w.mode ) }
Post Type${ esc( w.post_type ) }
完成 / 目標${ fmt( w.processed ) } / ${ fmt( w.target ) }
總耗時${ fmt( w.elapsed_sec ) } 秒
平均速率${ fmt( w.rate_per_sec ) } posts/sec
批次數${ fmt( w.batches_done ) }
批次最快/平均/最慢${ fmt( w.batch_min_ms ) } / ${ fmt( w.batch_avg_ms ) } / ${ fmt( w.batch_max_ms ) } ms
PHP Peak Memory${ fmt( w.peak_memory_mb ) } MB
'; // DB sizes (wp_posts + wp_postmeta + flat table for this run) html += '

▍ DB 容量(post 相關表)

'; html += ''; html += ''; html += ''; dbSizes.forEach( ( r ) => { html += ``; html += ``; html += ``; } ); html += '
TableRowsData MBIndex MBTotal MBAvg bytes/row
${ esc( r.table ) }${ fmt( r.rows ) }${ r.data_mb ?? '—' }${ r.index_mb ?? '—' }${ r.total_mb ?? '—' }${ fmt( r.avg_bytes ) }
'; // Query perf — 3 probes per post_type, with EAV baseline last for visual comparison html += '

▍ 查詢效能

'; html += ''; html += ''; html += ''; const baselineMs = q.eav_baseline?.duration_ms ?? null; Object.keys( q ).forEach( ( key ) => { const v = q[ key ]; if ( ! v || typeof v.duration_ms !== 'number' ) { return; } const label = labels[ key ] || key; let speedup = ''; if ( baselineMs !== null && key !== 'eav_baseline' && v.duration_ms > 0 ) { const ratio = baselineMs / v.duration_ms; if ( ratio >= 1 ) { speedup = ` (${ ratio.toFixed( 2 ) }× faster)`; } } html += ``; } ); html += '
測試項目耗時 (ms)
${ esc( label ) }${ speedup }${ v.duration_ms }
'; html += '

EAV baseline 走 wp_postmeta,flat probes 走專屬 group 表。倍率即此規模下反 EAV 的查詢加速。

'; content.innerHTML = html; } // ── Polling ───────────────────────────────────────────────────────────── async function poll() { const r = await apiCall( '/post-stress-test/status' ); if ( ! r.ok || ! r.data ) { return; } renderProgress( r.data ); if ( r.data.benchmark ) { renderBenchmark( r.data.benchmark ); } if ( r.data.status !== 'running' && r.data.status !== 'benchmarking' ) { stopPolling(); } } function startPolling() { stopPolling(); poll(); pollTimer = setInterval( poll, 2000 ); } function stopPolling() { if ( pollTimer ) { clearInterval( pollTimer ); pollTimer = null; } } // ── Event handlers ────────────────────────────────────────────────────── async function handleStart() { const postType = $( '#wpdo-pst-post-type' ).value; const target = parseInt( $( '#wpdo-pst-target' ).value, 10 ); const batch = parseInt( $( '#wpdo-pst-batch' ).value, 10 ); const mode = document.querySelector( 'input[name="wpdo-pst-mode"]:checked' ).value; if ( ! postType ) { alert( '請選擇 post_type' ); return; } if ( ! target || target < 1 ) { alert( '請輸入有效的 post 數量' ); return; } // Realistic 模式每 post 100-300ms,batch 太大會撞 nginx 60s timeout 之前的 8s deadline if ( mode === 'realistic' && batch > 30 ) { if ( ! confirm( `Realistic 模式每個 post 約需 100-300 ms,batch_size=${ batch } 可能超過後端 8s deadline 上限。建議使用 batch=10-20。要繼續嗎?` ) ) { return; } } // Soft warn for combinations that won't demonstrate反 EAV 優化效果 const postMode = String( cfg.postMode || 'disabled' ); if ( mode === 'fast' && postMode === 'aeav_only' ) { if ( ! confirm( `⚠️ Fast 模式直接 $wpdb->insert 繞過 Hook Bus,即使 post mode=aeav_only 也會寫滿 wp_postmeta(fixture 用途,非優化驗證)。\n\n如果你想驗證反 EAV 優化效果(wp_postmeta 應為 0),請改用 🐢 Realistic 模式。\n\n仍以 Fast 模式繼續嗎?` ) ) { return; } } else if ( mode === 'realistic' && postMode !== 'aeav_only' ) { if ( ! confirm( `⚠️ 目前 post mode = ${ postMode },此模式下 Realistic 寫入仍會雙寫 wp_postmeta(不會展示優化效果,ratio 不變)。\n\n要看 wp_postmeta 完全短路(0 寫入)需要先把 mode 升到 aeav_only(設定 tab)。\n\n仍以 ${ postMode } 模式繼續測試嗎?` ) ) { return; } } const big = target >= 5000; const msg = `即將以 ${ mode } 模式建立 ${ target.toLocaleString() } 筆 ${ postType } 測試 post${ big ? '(規模較大,可能耗時數分鐘)' : '' }。\n\n所有 post 的 post_title 會以 WPDO_STRESS_TEST_ 開頭,可一鍵清除。\n\n確定要開始嗎?`; if ( ! confirm( msg ) ) { return; } const r = await apiCall( '/post-stress-test/start', 'POST', { post_type: postType, target, mode, batch_size: batch, } ); if ( ! r.ok ) { alert( '啟動失敗:' + ( r.data?.error || r.status ) ); return; } // 啟動後立即顯示進度卡片 const card = $( '#wpdo-pst-progress-card' ); if ( card ) { card.style.display = ''; } // Hide the previous benchmark card (a fresh run will replace it) const benchCard = $( '#wpdo-pst-bench-card' ); if ( benchCard ) { benchCard.style.display = 'none'; } setText( '#wpdo-pst-pg-status', 'running' ); setText( '#wpdo-pst-pg-post-type', postType ); setText( '#wpdo-pst-pg-mode', mode ); setText( '#wpdo-pst-pg-target', target.toLocaleString() ); startPolling(); } async function handleCancel() { if ( ! confirm( '確定要取消當前測試?已建立的 post 不會被刪除。' ) ) { return; } const cancelBtn = $( '#wpdo-pst-cancel' ); if ( cancelBtn ) { cancelBtn.disabled = true; cancelBtn.textContent = '⏹ 取消中…'; } setText( '#wpdo-pst-pg-status', 'cancelling' ); const r = await apiCall( '/post-stress-test/cancel', 'POST' ); if ( ! r.ok ) { alert( '取消失敗:' + ( r.data?.error || r.status ) ); if ( cancelBtn ) { cancelBtn.disabled = false; cancelBtn.textContent = '⏹ 取消'; } return; } // realistic 模式 in-flight batch 可能還要 ~1 秒才會真正中止 poll(); if ( cancelBtn ) { cancelBtn.textContent = '⏹ 取消'; } } async function handleCleanup() { if ( ! confirm( '確定要清除所有 stress test posts?\n\n此動作會:\n- DELETE 所有 post_title 前綴 WPDO_STRESS_TEST_ 的 post\n- DELETE 對應 wp_postmeta\n- DELETE 7 張 wp_wpdo_post_* flat tables 中對應 post_id 的列\n\n不可復原!' ) ) { return; } const r = await apiCall( '/post-stress-test/cleanup', 'DELETE' ); if ( ! r.ok ) { alert( '清除失敗:' + ( r.data?.error || r.status ) ); return; } alert( `已清除 ${ r.data.deleted } 筆測試 post。` ); const card = $( '#wpdo-pst-progress-card' ); const benchCard = $( '#wpdo-pst-bench-card' ); if ( card ) card.style.display = 'none'; if ( benchCard ) benchCard.style.display = 'none'; poll(); } async function handleRerunBench() { const btn = $( '#wpdo-pst-rerun-bench' ); if ( btn ) { btn.disabled = true; btn.textContent = '⏳ 執行中...'; } const r = await apiCall( '/post-stress-test/benchmark', 'POST' ); if ( btn ) { btn.disabled = false; btn.textContent = '📊 重跑 Benchmark(不新增資料)'; } if ( ! r.ok ) { alert( 'Benchmark 失敗:' + ( r.data?.error || r.status ) ); return; } renderBenchmark( r.data.benchmark ); } // ── Init ──────────────────────────────────────────────────────────────── document.addEventListener( 'DOMContentLoaded', () => { const startBtn = $( '#wpdo-pst-start' ); const cancelBtn = $( '#wpdo-pst-cancel' ); const cleanupBtn = $( '#wpdo-pst-cleanup' ); const benchBtn = $( '#wpdo-pst-rerun-bench' ); if ( startBtn ) startBtn.addEventListener( 'click', handleStart ); if ( cancelBtn ) cancelBtn.addEventListener( 'click', handleCancel ); if ( cleanupBtn ) cleanupBtn.addEventListener( 'click', handleCleanup ); if ( benchBtn ) benchBtn.addEventListener( 'click', handleRerunBench ); // 初始 poll:若 status==running 自動接手 polling;若 completed 渲染 benchmark poll().then( () => { const status = ( $( '#wpdo-pst-pg-status' )?.textContent || '' ).trim(); if ( status === 'running' || status === 'benchmarking' ) { startPolling(); } } ); } ); } )();