è´ªåèæçæ¥æ°éè´ªåèï¼Snakeï¼å¨è®¡ç®å¤æåº¦çè®ºä¸çä¸¥æ ¼çå®ï¼ä»ç½æ ¼å¾åå¯é¡¿è·¯å¾çä¸å¯ææåè·¯å¾æ±è§£å¨ã"> <meta name="super-site-slug" content="snake-complexity-bounds-42"> <meta name="super-footer-copy" content="å¨ Super ä¸æ¢ç´¢ç®æ³ä¸è®¡ç®å¤æåº¦æ¨¡å"> <meta name="super-footer-market" content="science-research"> <meta property="og:type" content="article"> <meta property="og:title" content="https://app.getsupers.com/sites/snake-complexity-bounds-42/"> <meta property="og:image" content="https://app.getsupers.com/sites/snake-complexity-bounds-42/og-preview.png"> <meta name="twitter:card" content="summary_large_imageçå®ä¸æä¼è·¯å¾åæå¨"> <meta name="twitter:description" content="æ¢è®¨è´ªåè="twitter:image" content="https://app.getsupers.com/sites/snake-complexity-bounds-42/og-preview.png"> <style> @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap'); :root { --canvas: #FFFFFF; --ink: #111111; --muted: #555555; --subtle: #767676; --border: #E5E7EB; --surface: #F9FAFB; --surface-hover: #F3F4F6; --accent: #0284C7; --accent-soft: #E0F2FE; --accent-dark: #0369A1; --danger: #DC2626; --danger-soft: #FEE2E2; --success: #16A34A; --success-soft: #DCFCE7; --font-sans: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; --font-mono: 'JetBrains Mono', Consolas, monospace; --shadow-sm: 0 1px 2px rgba(0,0,0,0.05); --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05); } * { box-sizing: border-box; margin: 0; padding: 0; } [hidden] { display: none !important; } body { background-color: var(--canvas); color: var(--ink); font-family: var(--font-sans); line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; } /* Top Navigation with compact H1 */ nav { border-bottom: 1px solid var(--border); background: var(--canvas); position: sticky; top: 0; z-index: 50; } .nav-inner { max-width: 1380px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; } .brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); font-weight: 700; font-size: 18px; flex-shrink: 0; } .brand img { width: 28px; height: 28px; display: block; } .nav-title-wrap { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; } .nav-divider { color: var(--border); font-weight: 300; font-size: 18px; } h1 { font-size: 17px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink); margin: 0; } .nav-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; } .badge { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 9999px; font-size: 12px; font-weight: 600; background: var(--surface); border: 1px solid var(--border); color: var(--muted); font-family: var(--font-mono); } .badge-accent { background: var(--accent-soft); border-color: #BAE6FD; color: var(--accent-dark); } /* Workspace */ .workspace { max-width: 1380px; margin: 0 auto; padding: 20px 24px 32px; display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 24px; align-items: start; } .panel { background: var(--canvas); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-sm); overflow: hidden; } .panel-header { padding: 16px 20px; border-bottom: 1px solid var(--border); background: var(--surface); display: flex; align-items: center; justify-content: space-between; } .panel-header h2 { font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink); } .panel-body { padding: 20px; display: flex; flex-direction: column; gap: 18px; } /* Form Controls */ .field-group { display: flex; flex-direction: column; gap: 6px; } .field-group label { font-size: 13px; font-weight: 600; color: var(--ink); display: flex; justify-content: space-between; align-items: center; } .field-group label .hint-value { font-family: var(--font-mono); font-size: 12px; color: var(--accent-dark); background: var(--accent-soft); padding: 2px 6px; border-radius: 4px; } select, input[type="range"], button { font: inherit; } select { width: 100%; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--canvas); color: var(--ink); font-size: 14px; outline: none; transition: border-color 0.15s; } select:focus { border-color: var(--accent); } .range-row { display: flex; align-items: center; gap: 12px; } input[type="range"] { flex: 1; height: 6px; accent-color: var(--accent); cursor: pointer; } .btn-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .btn-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; } button, a.btn { appearance: none; border: 1px solid var(--border); background: var(--surface); color: var(--ink); padding: 10px 14px; border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; transition: all 0.15s ease; } button:hover, a.btn:hover { background: var(--surface-hover); border-color: #D1D5DB; } button.btn-primary, a.btn-primary { background: var(--ink); color: #FFFFFF; border-color: var(--ink); } button.btn-primary:hover, a.btn-primary:hover { background: #2B2B2B; border-color: #2B2B2B; } button.btn-accent { background: var(--accent); color: #FFFFFF; border-color: var(--accent); } button.btn-accent:hover { background: var(--accent-dark); border-color: var(--accent-dark); } button:disabled { opacity: 0.5; cursor: not-allowed; } /* Complexity Metrics Box */ .metric-card-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } .metric-card { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 12px; display: flex; flex-direction: column; gap: 4px; } .metric-label { font-size: 11px; text-transform: uppercase; font-weight: 600; color: var(--subtle); letter-spacing: 0.03em; } .metric-value { font-family: var(--font-mono); font-size: 16px; font-weight: 600; color: var(--ink); } .metric-tag { font-size: 11px; color: var(--accent); font-weight: 500; } /* Visualizer Stage */ .stage-container { display: flex; flex-direction: column; gap: 16px; } .canvas-wrap { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 480px; position: relative; } #game-canvas { background: #FFFFFF; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.03); max-width: 100%; height: auto; touch-action: none; } .canvas-legend { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; font-size: 12px; color: var(--muted); align-items: center; justify-content: center; } .legend-item { display: flex; align-items: center; gap: 6px; } .legend-color { width: 12px; height: 12px; border-radius: 3px; border: 1px solid rgba(0,0,0,0.1); } /* Status Bar */ .status-bar { padding: 12px 16px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; } .status-text { color: var(--ink); font-weight: 500; } .status-text.error { color: var(--danger); } /* Explanation & Academic Content Sections */ .content-area { max-width: 940px; margin: 40px auto; padding: 0 24px; } .content-section { margin-bottom: 48px; } .content-section h2 { font-size: 24px; font-weight: 700; color: var(--ink); margin-bottom: 16px; letter-spacing: -0.01em; border-bottom: 1px solid var(--border); padding-bottom: 8px; } .content-section h3 { font-size: 18px; font-weight: 600; color: var(--ink); margin: 24px 0 12px; } .content-section p { font-size: 16px; color: #333333; margin-bottom: 16px; line-height: 1.75; } .content-section ul, .content-section ol { margin: 12px 0 20px 24px; color: #333333; font-size: 16px; line-height: 1.75; } .content-section li { margin-bottom: 8px; } /* Formula & Code Boxes */ .theorem-box { background: var(--surface); border-left: 4px solid var(--ink); border-radius: 0 8px 8px 0; padding: 18px 20px; margin: 20px 0; border-top: 1px solid var(--border); border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); } .theorem-title { font-weight: 700; font-size: 15px; color: var(--ink); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; } .theorem-body { font-size: 15px; color: var(--ink); line-height: 1.65; } .math-formula { font-family: var(--font-mono); background: var(--surface); border: 1px solid var(--border); padding: 12px 16px; border-radius: 6px; margin: 16px 0; font-size: 14px; overflow-x: auto; color: #1F2937; } /* Comparison Table */ .table-container { overflow-x: auto; margin: 20px 0; border: 1px solid var(--border); border-radius: 8px; } table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; background: #FFFFFF; } th, td { padding: 12px 16px; border-bottom: 1px solid var(--border); vertical-align: top; } th { background: var(--surface); font-weight: 600; color: var(--ink); } tr:last-child td { border-bottom: none; } /* FAQ accordion */ details { border: 1px solid var(--border); border-radius: 8px; margin-bottom: 12px; padding: 14px 18px; background: #FFFFFF; transition: background 0.15s; } details[open] { background: var(--surface); } summary { font-weight: 600; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; user-select: none; font-size: 16px; color: var(--ink); } summary::-webkit-details-marker { display: none; } summary::after { content: '+'; font-family: var(--font-mono); font-size: 18px; color: var(--subtle); } details[open] summary::after { content: 'â'; } .faq-answer { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); color: #374151; font-size: 15px; line-height: 1.7; } /* Super iOS contextual footer */ .super-footer-wrapper { border-top: 1px solid var(--border); background: var(--surface); padding: 40px 24px; margin-top: 60px; } .super-footer-container { max-width: 940px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; } .super-footer-promo { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 24px; background: #FFFFFF; border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-sm); } .promo-content { display: flex; flex-direction: column; gap: 4px; } .promo-tag { font-size: 11px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--accent-dark); } .promo-heading { font-size: 16px; font-weight: 600; color: var(--ink); } .promo-sub { font-size: 13px; color: var(--muted); } a.promo-btn { flex-shrink: 0; padding: 10px 18px; background: var(--ink); color: #FFFFFF; font-weight: 600; border-radius: 8px; text-decoration: none; font-size: 14px; display: inline-flex; align-items: center; gap: 8px; transition: background 0.15s; } a.promo-btn:hover { background: #333333; } .footer-meta-notes { font-size: 12px; color: var(--subtle); text-align: center; } @media (max-width: 1024px) { .workspace { grid-template-columns: 1fr; } .panel-body { padding: 16px; } } @media (max-width: 640px) { .nav-inner { padding: 10px 16px; } h1 { font-size: 15px; } .workspace { padding: 16px 12px; } .metric-card-grid { grid-template-columns: 1fr; } .btn-row, .btn-row-3 { grid-template-columns: 1fr; } .super-footer-promo { flex-direction: column; align-items: flex-start; } a.promo-btn { width: 100%; justify-content: center; } } </style> <script type="application/ld+json"> { "@context": "https://schema.org", "@ä»¥åå¯åå¼æç´¢æè¡¡ã", "author": { "@type": "Organization", "name": "Super Computational Sciences Group" }, "publisher": { "@type": "Organization", "name": "Super", "logo": { "@type": "ImageObject", "url": "https://storage.googleapis.com/cheatlayer/landing/icon-transparent-512.png" } }, "mainEntityOfPage": "https://app.getsupers.com/sites/snake-complexity-bounds-42/" } </script> <link rel="canonical" href="https://app.getsupers.com/sites/interactive-tool-2/"> <meta property="og:description" content="Interactive tool generated by Super."> <meta property="og:url" content="https://app.getsupers.com/sites/interactive-tool-2/"> <meta property="og:image:alt" content="Interactive tool"> <meta name="twitter:title" content="Interactive tool"> <meta name="twitter:image" content="https://getsupers.com/hero-demo-poster.jpg"> <script data-super-posthog="posthog-v1"> !function(t,e){var o,n,p,r;e.__SV||(window.posthog && window.posthog.__loaded)||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}p||((p=t.createElement("script")).type="text/javascript",p.crossOrigin="anonymous",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",p.onerror=function(){p=null},(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r));var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="an ln init xn Cn Br kn In capture Fn nn calculateEventProperties On register register_once register_for_session unregister unregister_for_session Ln getFeatureFlag getFeatureFlagPayload getFeatureFlagResult getAllFeatureFlags isFeatureEnabled reloadFeatureFlags updateFlags updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures on onFeatureFlags onSurveysLoaded onSessionId getSurveys getActiveMatchingSurveys renderSurvey displaySurvey cancelPendingSurvey canRenderSurvey canRenderSurveyAsync Dn identify setPersonProperties unsetPersonProperties group resetGroups setPersonPropertiesForFlags resetPersonPropertiesForFlags setGroupPropertiesForFlags resetGroupPropertiesForFlags reset shutdown setIdentity clearIdentity get_distinct_id getGroups get_session_id get_session_replay_url alias set_config startSessionRecording stopSessionRecording sessionRecordingStarted captureException addExceptionStep captureLog startExceptionAutocapture stopExceptionAutocapture loadToolbar get_property getSessionProperty An Rn createPersonProfile setInternalOrTestUser $n yn jn opt_in_capturing opt_out_capturing has_opted_in_capturing has_opted_out_capturing get_explicit_consent_status is_capturing clear_opt_in_out_capturing Tn debug Ur Rt getPageViewId captureTraceFeedback captureTraceMetric pn".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]); posthog.init('phc_b0JgSM1YLRCR1Jv4nS9DufukjhTYntC2O1XQLlUsoGn', { api_host: 'https://b.getsupers.com', ui_host: 'https://us.posthog.com', defaults: '2026-05-30', person_profiles: 'identified_only', }) </script> <script async data-cfasync="false" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4191087612118263" crossorigin="anonymous" data-super-adsense="auto"></script> </head> <body>  <nav aria-label="Global Navigation"> <div class="nav-inner"> <div class="nav-title-wrap"> <a href="https://getsupers.com/" class="brand" title="Super Home"> <img src="https://storage.googleapis.com/cheatlayer/landing/icon-transparent-512.png" alt="Super Logo" width="28" height="28"> <span>Super</span> å¨è®¡ç®å¤æåº¦çè®ºä¸ççå®</h1> </div> <div class="nav-actions"> <span class="badge badge-accent">Complexity: PSPACE-Complete</span> </div> </div> </nav>  <main> <section class="workspace" id="simulator-workspace">  <aside class="panel"> <div class="panel-header"> <h2>æ¨¡ååæ°ä¸æ±è§£çç¥</h2> <span class="badge" id="board-dim-badge">6 Ã 6 Grid</span> </div> <div class="panel-body"> <div class="field-group"> <label for="board-preset">é¢è®¾ç½æ ¼ææ <span class="hint-value" id="grid-nodes-hint">36 é¡¶ç¹</span> </label> <select id="board-preset"> <option value="4x4">4 Ã 4 ç´§åç½æ ¼ (å¶æ°é¶ / åå¨ç®ååå¯é¡¿ç¯)</option> <option value="obstacle">6 Ã 6 å¸¦éç¢ç©éäºåå¾è¯±å¯¼åå¾ (NPå°é¾æ£éª)</option> </select> </div> <div class="field-group"> <-type-hint">Hamilton Cycle</span> </label> <select id="strategy-select"> / å¤é¡¹å¼æ§è¡)</option> <option value="astar-greedy">è´ªå©ª A* å¯åhamiltonian-shortcut">åå¯é¡¿å¿«æ·åªææ³ (BWT / æçæ¥æ°æ··åå¯åå¼)</option> </select> </div> <div class="field-group"> <label for="speed-range">æ¨¡ææ§è¡é¢ç <span class="hint-value" id="speed-val">20 steps/s</span> </label> <div class="range-row"> <input type="range" id="speed-range" min="2" max="60" value="20"> </div> </div> <div class="btn-row"> <button id="btn-toggle-run" class="btn-primary"> <span id="play-icon">â¶</span> å¼å§èªå¨æ±è§£ </button> <button id="btn-step" class="btn">åæ¥æ¨æ¼ (Step)</button> </div> <div class="btn-row"> <button id="btn-reset" class="btn">éç½®ç¶æ</button> <button id="btn-export-state" class="btn-accent">å¯¼åºåææ°æ® (JSON)</button> </div>  <div class="metric-card-grid"> <div class="metric-card"> <span class="metric-label">å½åæ¥æ° / èèº«é¿åº¦</span> <div class="metric-value" id="metric-step-len">0 / 3</div> <span class="metric-<div class="metric-card"> <span class="metric-label">èªè§é¿ç¶æç©ºé´å®¹é</span> <div class="metric-value" id="metric-state-space">â 1.4 Ã 10Â¹â´</div> <span class="metric-tag">O(4^L Â· (NM))</span> </div> <div class="metric-card"> <span class="metric-label">æåå¤æåº¦å¤å®</span> <div="metric-tag">å¨æèèº«éæ</span> </div> <div class="metric-card"> metric-reachability">è¿éæ å²ç¹</div> <span class="metric-tag" id="metric-hamilton-status">å«åå¯é¡¿åè·¯</span> </div> </div> </div> </aside>  <section class="stage-container"> <div class="canvas-wrap"> <canvas id="game-canvas" width="540" height="540" role class="canvas-legend"> <div class="legend-item"> <span class="legend-color" style="background: #111111;"></span> <span>èå¤´ (Head)</span> </div> <div class="legend-item"> <span class="legend-color" style="background: #0284C7;"></span> <span>èèº« (Body Trajectory)</span> </div> <div class="legend-item"> <span class="legend-color" style="background: #DC2626;"></span> <span>ç®æ é£ç© (Target v_t)</span> </div> <div class="legend-item"> <span class="legend-color" style="background: #93C5FD; border-style: dashed;"></span> <span>åå¯é¡¿ä¸»ç¯è·¯å¾</span> </div> <div class="legend-item"> <span class="legend-color" style="background: #E5E7EB;"></span> <span>ç½æ ¼å¾è¯±å¯¼è¾¹ E(G)</span> </div> </div> </div> <div class="status-bar" id="status-bar"> <span class="status-text" id="status-message">å°±ç»ªï¼å·²åºäºæéå¶æ°é¶ç½æ ¼æå»ºåå§åå¯é¡¿å¾ªç¯éª¨å¹²ãç¹å»âå¼å§èªå¨æ±è§£âä»¥éªè¯è·¯å¾æ¶æã</span> <span class="badge" id="algo-indicator">Hamiltonian Safety Bound</span> </div> </section> </section>  <article class="content-area"> <header class="content-section"> <h2>1. è®¡ç®å¤æåº¦è§è§çè´ªåèé®é¢å½¢å¼åå®ä¹</h2> <p> å¨æ¶å<strong>å¨æéç¢ç©éæï¼Dynamic Reconfiguration with Self-Avoiding Walksï¼</strong>ä¸<strong>å¾ä¸åå¯é¡¿è·¯å¾ï¼Hamiltonian Path on Grid Graphsï¼</strong>çé«ç»´ç¶æè½¬ç§»å¤å®é®é¢ã </p> <p>ï¼ </p> <div class="theorem-box"> <div class="theorem-title">å®ä¹ 1.1ï¼ç¦»æ£å¨æèç³»ç» (Discrete Dynamic Snake System, DDSS)</div> <div class="theorem-body"> ç»å®æéæ åå¾ $G = (V, E)$ï¼å¨æ åæ¸¸æä¸ä¸ºæéç©å½¢ç½æ ¼å¾ $G_{m \times n}$ï¼ãä¸æ¡é¿åº¦ä¸º $k$ çèå¨æ¶å» $t$ å®ä¹ä¸ºä¸ä¸ªåå°åºå $S_t = (v_1^t, v_2^t, \dots, v_k^t)$ï¼æ»¡è¶³å¯¹äºä»»æ $1 \le i < k$ï¼åæ $(v_i^t_k^t$ ä¸ºèå°¾ã å¨ä¸æ¥ææè½¬ç§» $t \to t+1$ ä¸ï¼èå¤´ç§»å¨è³é»æ¥é¡¶ç¹ $v_1^{t+1} \in N(v_1^t)$ï¼ä¸èèº«æ»¡è¶³ï¼ $$v_{i+1}^{t+1} = v_i^t \quad (\forall \{v_1^t, v_2^t, \dots, v_{k-1}^t\}$ï¼æ³¨æï¼å°¾å®æ´ä¸ªæ¸¸æä¸ææè¿ç»åºç°çé£ç©é¡¶ç¹åºå $F = (f_1, f_2, \dots, f_{|V|-k_0})$ï¼å¤å®æ¯å¦åå¨ä¸æ¡ç§»å¨åºåï¼ä½¿å¾èå¨ä¸åçç¢°æçåæä¸ä¾æ¬¡åæ¥æ°ä¸çé©¬å°å¯å¤«åå¼çç¥ä¼åã</li> </ol> </header> <section class="content-section"> <h2>2. å¤æåº¦çåçº§çå®ï¼ä» NP-Hard å° PSPACE-Completep> <div class="table-container"> <table> <thead> <tr> <th>çº¦æ¥æº / çè®ºä¾æ®</th> </tr> </thead> <tbody> <tr> <td><strong>åºå®èèº«ç®æ å¯è¾¾æ§ (Reachability)</strong></td> <td>ä¸è¬å¾ $G$ æå«å¤è¾¹å½¢éç¢ç©ç½æ ¼å¾ æ å¹¿ä¹éææ¼å¾ (Sokoban) è§çº¦ãèèº«æå é»æ¡ééï¼éææ°</strong></td> <td>å¸¦éç¢ç©ç½æ ¼å¾ $G \subseteq \mathbb{Z}^2$</td> <td> Path in Grid Graphs, Itai et al., 1982ï¼ã</td> </tr> <tr> <td><strong>æ éç¢mn \equiv 0 \pmod 2$)</td> <td><strong>$P$ (å¤é¡¹å¼æ¶é´å¯è§£)</strong></td> <td>å¯ç¡®å®æ§æé åå¯é¡¿åè·¯ï¼å¦ Boustrophedon è <td><strong>NP-Hard / PSPACE-Hard</strong></td> <td>å³ä¾¿åºå±å¾åå¨ç®ååå¯é¡¿ç¯ï¼ä½å¯»æ¾ä½¿ $\sum \text{dist}(f_i, f_{i+1})$ æå°ä¸å¨ä¸é´å¨æç¶æä¸å½¢æè¿éåæ¯å²éï¼Cut-vertex Deadlockï¼çè½¬ç§»åºåææä¸¥æ ¼çæä¼åé¾é¢ã</td> </tr> </tbody> </table> </div> <div class="theorem-box"> <div class=" <br><br> <strong>è¯ææè·¯ç´è§ï¼</strong> è¯æä¾èµäºæå»ºé»è¾é¨åä»¶ï¼Logicè·¯å¾åºåé¿åº¦å¯è¾¾å°ç¶æç©ºé´å¤§å°ççº§å«ï¼å³ $\Omega(2^{c \cdot L})$ï¼å¤å® </section> <section class="content-section"> <h2>3. ä¸ºä»ä¹âè´ªå©ªæçè·¯ (BFS/A*)âä¼å¯¼è´æ»éå´©æºï¼</h2> <p> å¨å·¥ç¨æ°å¦åå å¨äºç½æ ¼å¾ç<strong>äºåæ§ï¼Bipartitenessï¼ä¸å²ç¹éç¦»ï¼Cut-vertex Separationï¼</strong>ï¼ </p> <div class="math-formula"> ä»¤å©ä½å¯ç¨æ èé¡¶ç¹éä¸º $V_{\text{free}}(t) = V \setminus \{v_1^t, v_2^t, \dots, v_k^t\}$ã è¥è´ªå©ªæ¥å¯¼è´ $G[V_{\text{free}}(t)]$ çè¿éåæ¯æ°æ»¡è¶³ï¼ $$c(G[V_{\text{free}}(t)]) > 1 \quad \text{ä¸} \quad \exists C \in \pi_0(G), |C|åäºç¬æ¶æ é $\text{dist}(v_1, f)$ï¼å´æ è§äºèèº«èèº«é¿åº¦å¢é¿ï¼èå¤´å¯ç§»å¨è·¯å¾å°ä»¥åææ°éåº¦èç¼©ã </p> </section> <section class="content-section"> <h2>4. åå¯é¡¿ç¯æé ä¸æçæ¥æ°ä¹é´çå¯¹å¶æè¡¡</h2> <p> å¨æ éç¢ç $2k \times 2m$ ç©å½¢ç½æ ¼å¾ä¸ï¼ç±äºäºåå¾é»ç½æè²å¹³è¡¡ï¼æ»è½æ¾å¼æé è³å°ä¸æ¡<strong>åå¯é¡¿åè·¯èä¸¥æ ¼æ²¿é¢å®çåå¯é¡¿ç¯æ¹åååç¯æ¸¸ï¼èå¤´æ°¸è¿å¨è¿½éåä¸æ¶å»çèèº«ã</li> <li><strong>æ¥æ°ä»£ä»·ï¼æå¤§åä½ï¼ï¼</strong> æ²¿çåºå®åå¯é¡¿ç¯æ¸¸èµ°ï¼æ¯æ¬¡æè·é£ç©æéçæææ¥æ°ä¸ºæ£çé¡¶ç¹æ°çä¸å $\approx \frac{mn}{2}$ãé} \frac{mn}{2} = \mathcal{O}((mn)^2)$$ </li> <li><strong>å¿«æ·åªæï¼Hamiltonian Shortcutsï¼ï¼</strong> å¨ç¡®ä¿èå¤´ä¸èå°¾å¨ç¯ä¸çåºå·ç´¢å¼è·ç¦» $\text{index}(è¡¡ã</li> </ul> </section> <section class="content-section"> <h2>5. å¸¸è§é®é¢è§£ç (FAQ)</h2> <details> <summary>ä¸ºä»ä¹ç½æ ¼å¾Hamilton Paths in Grid Graphsãä¸è¯æï¼å³ä½¿éå¶å¨æ¯ä¸ªé¡¶ç¹åº¦æ°è³å¤ä¸º 4 çæ åå¹³é¢ç½æ ¼è¯±çº¦å°æ åå¹³é¢å¾ï¼åéè¿ç²¾å·§çæ£æ¹å½¢ç½æ ¼çº¿æ®µä¸è¿æ¥ç»ä»¶æ¿æ¢æé åæä»¶ï¼Tentacles & Clauses Gadgetsï¼å®æçãå æ¤å¨å¸¦éç¢ç©çè´ªåèæ£çä¸ï¼å¤æå¯é¡¿ç¯ï¼æ¶é´å¤æåº¦ä¸º $O(N)$ï¼ãèâæçæ¥æ°âè¦æ±å¨ææå¯è½çèªé¿è¡èµ°åå²åæ¯ä¸æå°åç§¯åæ¥æ°ï¼è¿ææäºé«ç»´å¨æè§åé®é¢ãæ¯ä¸ä¸ªå³çé½ä¼ä¸å¯éå°æ¹åæªæ¥å ç¾æ¥çåæ³å ä½èµ°å»ï¼æç´¢æ æ·±åº¦ä¸º $\Theta(|V|^2)$ï¼åæ¯å åå¨ 2 å° 3 ä¹é´ï¼è¿å¼åäºä¸¥èçç¶æç©ºé´çç¸ã </div> </details>æ°ï¼</summary> <div class="faq-answer"> æ·±åº¦å¼ºåå¦ä¹ ï¼å¦ DQN æ PPOï¼å¨å°è§æ¨¡ç½æ ¼ä¸å¯ä»¥éè¿å¥å±å¡å½¢å¦å°éå¸¸åºè²çâè¿ééæ©âçç¥ï¼ä½ä»å½èèº«å æ® 80% ä»¥ä¸ç½æ ¼æ¶ï¼ä»·å¼å½æ°è¿ä¼¼ï¼Value Function Approximationï¼ä¼åºç°ä¸¥éçèªâã </div> </details> </article>  <footer class="super-footer-wrapper"> <div class="super-footer-container"> <div class="super-footer-promo" data-super-app-promo="super-ios-v1" data-super-footer-copy="å¨ Super ä¸æ¢ç´¢ç®æ³ä¸è®¡ç®å¤æåº¦æ¨¡å" data-super-footer-campaign="aeo-geo-useful-pages" data-super-market="science-research" data-super-cpp-id="4ebf0e85-2534-42c2-ad28-69f88ed916af" data-super-destination-version="2026-09-15T11:40:23.584734+00:00"> <div class="promo-content"> <span class="promo-tag">Super Real-Time AI</span> <div class="promo-heading">å¨ Super ä¸æ¢ç´¢ç®æ³ä¸è®¡ç®å¤æåº¦æ¨¡å</div> <div class="promo-sub">ä½éªä¸ä¸ºç®æ³ç ç©¶ãç¦»æ£æ°å¦åçè®ºæ¨æ¼æé çåçç§»å¨ç«¯æºè½å·¥ä½æµã</div> </div> <a href="https://apps.apple.com/us/app/super-powers-ai/id6758969961?ppid=4ebf0e85-2534-42c2-ad28-69f88ed916af" class="promo-btn" target="_blank" rel="noopener"> å¨ Super ä¸æå¼ </a> </div> <div class="footer-meta-notes"> Â© Super Research. Standalone computational complexity analyzer for discrete dynamic systems. </div> </div> </footer> </main>  <script data-cfasync="false" data-super-footer-experiment="v1"> (() => { 'use strict'; const footer = document.querySelector('[data-super-footer-campaign]'); if (!footer || footer.dataset.campaignBound) return; footer.dataset.campaignBound = 'true'; const anchor = footer.tagName === 'A' ? footer : footer.querySelector('a'); if (!anchor) return; const experiment = footer.dataset.superFooterCampaign + '-contextual-requested'; const variant = 'contextual_requested'; footer.dataset.superFooterVariant = variant; const props = () => ({ experiment, variant, site_path: location.pathname, destination: anchor.href, cta_text: anchor.textContent.trim(), copy_version: footer.dataset.superFooterCopyVersion, market: footer.dataset.superMarket || null, custom_product_page_id: footer.dataset.superCppId || null, destination_version: footer.dataset.superDestinationVersion || 'default', campaign: footer.dataset.superFooterCampaign }); const capture = (name, options) => { const ph = window.posthog; if (ph && typeof ph.capture === 'function') ph.capture(name, props(), options); }; capture('site_footer_eligible'); let viewed = false, clicked = false; const view = () => { if (viewed || document.visibilityState !== 'visible') return; viewed = true; footer.dataset.superFooterViewed = 'true'; capture('site_footer_viewed'); }; if ('IntersectionObserver' in window) { const observer = new IntersectionObserver(entries => { if (entries.some(e => e.isIntersecting && e.intersectionRatio >= 0.5)) view(); }, { threshold: 0.5 }); observer.observe(anchor); } else { const check = () => { const r = anchor.getBoundingClientRect(); if (r.top >= 0 && r.bottom <= innerHeight) view(); }; addEventListener('scroll', check, { passive: true }); check(); } document.addEventListener('visibilitychange', () => { const r = anchor.getBoundingClientRect(); if (r.top >= 0 && r.bottom <= innerHeight) view(); }); const click = e => { if (e.type === 'auxclick' && e.button !== 1) return; if (clicked) return; clicked = true; view(); footer.dataset.superFooterClicked = 'true'; capture('site_footer_clicked', { transport: 'sendBeacon' }); }; anchor.addEventListener('click', click); anchor.addEventListener('auxclick', click); })(); </script>  <script> (function() { 'use strict'; // State & Model let gridCols = 6; let gridRows = 6; let isObstacleMap = false; let obstacles = []; // Set of "r,c" let snake = []; // Array of {r, c}, head is snake[0] let food = null; // {r, c} let stepsCount = 0; let isRunning = false; let timer = null; let speed = 20; // steps/sec let currentStrategy = 'hamiltonian'; // 'hamiltonian', 'astar-greedy', 'hamiltonian-shortcut' let hamiltonianCycle = []; // Array of {r, c} ordered in cycle let hamIndexMap = new Map(); // "r,c" -> cycleIndex const canvas = document.getElementById('game-canvas'); const ctx = canvas.getContext('2d'); // DOM references const presetSelect = document.getElementById('board-preset'); const strategySelect = document.getElementById('strategy-select'); const speedRange = document.getElementById('speed-range'); const speedVal = document.getElementById('speed-val'); const btnToggleRun = document.getElementById('btn-toggle-run'); const btnStep = document.getElementById('btn-step'); const btnReset = document.getElementById('btn-reset'); const btnExport = document.getElementById('btn-export-state'); const statusMsg = document.getElementById('status-message'); const boardDimBadge = document.getElementById('board-dim-badge'); const gridNodesHint = document.getElementById('grid-nodes-hint'); const strategyTypeHint = document.getElementById('strategy-type-hint'); const metricStepLen = document.getElementById('metric-step-len'); const metricFillRate = document.getElementById('metric-fill-rate'); const metricStateSpace = document.getElementById('metric-state-space'); const metricReachability = document.getElementById('metric-reachability'); // Initialize Hamiltonian cycle for standard even grid (Boustrophedon cycle) function buildHamiltonianCycle(cols, rows, withObstacles) { const cycle = []; hamIndexMap.clear(); if (withObstacles) { // Construct custom cycle around obstacles for 6x6 // Obstacles placed at (2,2), (2,3), (3,2), (3,3) leaving an outer loop // If not simple, fall back to standard BFS or boundary cycle // For standard demo, build cycle along perimeter and inner channels return buildBoustrophedonCycle(cols, rows); } else { return buildBoustrophedonCycle(cols, rows); } } function buildBoustrophedonCycle(cols, rows) { // Standard snake cycle on even grid: // Row 0 from col 0 to cols-1 // Down to row rows-1 on last col // S-curve backwards to col 1, row 1 // Up col 0 to row 0 const cycle = []; // Row 0: left to right for (let c = 0; c < cols; c++) { cycle.push({ r: 0, c: c }); } // For rows 1..rows-1: for (let r = 1; r < rows; r++) { if (r % 2 === 1) { // Go right to left from cols-1 down to 1 for (let c = cols - 1; c >= 1; c--) { cycle.push({ r: r, c: c }); } } else { // Go left to right from 1 to cols-1 for (let c = 1; c < cols; c++) { cycle.push({ r: r, c: c }); } } } // Move up col 0 from row rows-1 to row 1 for (let r = rows - 1; r >= 1; r--) { cycle.push({ r: r, c: 0 }); } cycle.forEach((pt, idx) => { hamIndexMap.set(`${pt.r},${pt.c}`, idx); }); return cycle; } function resetSimulation() { stopRun(); const val = presetSelect.value; isObstacleMap = false; obstacles = []; if (val === '4x4') { gridCols = 4; gridRows = 4; } else if (val === '6x6') { gridCols = 6; gridRows = 6; } else if (val === '8x8') { gridCols = 8; gridRows = 8; } else if (val === 'obstacle') { gridCols = 6; gridRows = 6; isObstacleMap = true; // place 4 center obstacles obstacles = ['2,2', '2,3', '3,2', '3,3']; } boardDimBadge.textContent = `${gridCols} Ã ${gridRows} Grid`; gridNodesHint.textContent = `${gridCols * gridRows - obstacles.length} é¡¶ç¹`; hamiltonianCycle = buildHamiltonianCycle(gridCols, gridRows, isObstacleMap); // Initial snake at top-left snake = [ { r: 0, c: 2 }, { r: 0, c: 1 }, { r: 0, c: 0 } ]; stepsCount = 0; spawnFood(); updateMetrics(); draw(); statusMsg.textContent = `å°±ç»ªï¼å·²åºäº ${gridCols}Ã${gridRows} æ£çéç½®ãåå§åå¯é¡¿è·¯å¾å·²å°±ç»ªã`; statusMsg.classList.remove('error'); } function spawnFood() { const emptyCells = []; const occupied = new Set(); snake.forEach(s => occupied.add(`${s.r},${s.c}`)); obstacles.forEach(o => occupied.add(o)); for (let r = 0; r < gridRows; r++) { for (let c = 0; c < gridCols; c++) { const key = `${r},${c}`; if (!occupied.has(key)) { emptyCells.push({ r, c }); } } } if (emptyCells.length === 0) { food = null; stopRun(); statusMsg.textContent = `ð æåï¼èå·²å¡«æ»¡ç½ return; } // Pick randomly const choice = emptyCells[Math.floor(Math.random() * emptyCells.length)]; food = choice; } // Neighbors helper function getNeighbors(cell) { const deltas = [ { r: -1, c: 0 }, { r: 1, c: 0 }, { r: 0, c: -1 }, { r: 0, c: 1 } ]; const res = []; for (const d of deltas) { const nr = cell.r + d.r; const nc = cell.c + d.c; if (nr >= 0 && nr < gridRows && nc >= 0 && nc < gridCols) { if (!obstacles.includes(`${nr},${nc}`)) { res.push({ r: nr, c: nc }); } } } return res; } // A* greedy shortest path to food without topological guarantees function findAStarPath(start, goal, snakeBody) { const bodySet = new Set(snakeBody.slice(0, -1).map(b => `${b.r},${b.c}`)); const openSet = [{ ...start, g: 0, f: Math.abs(start.r - goal.r) + Math.abs(start.c - goal.c), parent: null }]; const visited = new Map(); visited.set(`${start.r},${start.c}`, 0); while (openSet.length > 0) { openSet.sort((a, b) => a.f - b.f); const curr = openSet.shift(); if (curr.r === goal.r && curr.c === goal.c) { // Reconstruct const path = []; let temp = curr; while (temp) { path.unshift({ r: temp.r, c: temp.c }); temp = temp.parent; } return path; } const neighbors = getNeighbors(curr); for (const n of neighbors) { const key = `${n.r},${n.c}`; if (bodySet.has(key)) continue; const gScore = curr.g + 1; if (!visited.has(key) || gScore < visited.get(key)) { visited.set(key, gScore); const h = Math.abs(n.r - goal.r) + Math.abs(n.c - goal.c); openSet.push({ r: n.r, c: n.c, g: gScore, f: gScore + h, parent: curr }); } } } return null; // No direct path found } // Get next move according to strategy function getNextMove() { const head = snake[0]; if (!food) return null; if (currentStrategy === 'hamiltonian') { // Pure Hamiltonian follow const headIdx = hamIndexMap.get(`${head.r},${head.c}`); if (headIdx !== undefined) { const nextIdx = (headIdx + 1) % hamiltonianCycle.length; return hamiltonianCycle[nextIdx]; } } else if (currentStrategy === 'astar-greedy') { const path = findAStarPath(head, food, snake); if (path && path.length > 1) { return path[1]; } // Fallback: any safe neighbor const neighbors = getNeighbors(head); const bodySet = new Set(snake.slice(0, -1).map(b => `${b.r},${b.c}`)); for (const n of neighbors) { if (!bodySet.has(`${n.r},${n.c}`)) return n; } } else if (currentStrategy === 'hamiltonian-shortcut') { // Look at all valid physical neighbors. If shortcut along cycle is safe, take it. const headIdx = hamIndexMap.get(`${head.r},${head.c}`); const tail = snake[snake.length - 1]; const tailIdx = hamIndexMap.get(`${tail.r},${tail.c}`); const foodIdx = hamIndexMap.get(`${food.r},${food.c}`); if (headIdx !== undefined && tailIdx !== undefined && foodIdx !== undefined) { const cycleLen = hamiltonianCycle.length; const neighbors = getNeighbors(head); const bodySet = new Set(snake.slice(0, -1).map(b => `${b.r},${b.c}`)); let bestNext = null; let bestDist = Infinity; // Standard next const defaultNextIdx = (headIdx + 1) % cycleLen; const defaultNext = hamiltonianCycle[defaultNextIdx]; // Can we take a shortcut? for (const n of neighbors) { const nKey = `${n.r},${n.c}`; if (bodySet.has(nKey)) continue; const nIdx = hamIndexMap.get(nKey); if (nIdx === undefined) continue; // Distance along cycle from nIdx to foodIdx const distToFood = (foodIdx - nIdx + cycleLen) % cycleLen; const distToTail = (tailIdx - nIdx + cycleLen) % cycleLen; // Safety check: ensure we do not jump over our own tail on the cycle if (distToTail > snake.length + 1) { if (distToFood < bestDist) { bestDist = distToFood; bestNext = n; } } } if (bestNext) return bestNext; return defaultNext; } } // Default safe neighbor const neighbors = getNeighbors(head); const bodySet = new Set(snake.slice(0, -1).map(b => `${b.r},${b.c}`)); for (const n of neighbors) { if (!bodySet.has(`${n.r},${n.c}`)) return n; } return null; } function step() { if (!food) return; const nextCell = getNextMove(); if (!nextCell) { stopRun(); statusMsg.textContent = `â åçæ»éç¢°æï¼èå¨æ¥æ° ${stepsCount} æ¶å¨é¿èº«ä½ä¸çä¸å®å¤æ§ã`; statusMsg.classList.add('error'); metricReachability.textContent = 'å²ç¹é»å¡ / æ»é'; return; } // Check collision with self const bodySet = new Set(snake.slice(0, -1).map(b => `${b.r},${b.c}`)); if (bodySet.has(`${nextCell.r},${nextCell.c}`)) { stopRun(); statusMsg.textContent = `â ç¢°æèªæ®ï¼å¨æ¥æ° ${stepsCount} åçèªç¸äº¤ã`; statusMsg.classList.add('error'); return; } stepsCount++; snake.unshift(nextCell); // Check food if (nextCell.r === food.r && nextCell.c === food.c) { spawnFood(); } else { snake.pop(); } updateMetrics(); draw(); } function startRun() { if (isRunning) return; isRunning = true; btnToggleRun.innerHTML = '<span>â¸</span> æåè®¡ç®'; btnToggleRun.classList.remove('btn-primary'); btnToggleRun.classList.add('btn'); statusMsg.textContent = `æ¨¡æè¿è¡ä¸... çç¥: ${strategySelect.options[strategySelect.selectedIndex].text}`; statusMsg.classList.remove('error'); const interval = Math.max(16, Math.floor(1000 / speed)); timer = setInterval(step, interval); } function stopRun() { if (!isRunning) return; isRunning = false; clearInterval(timer); timer = null; btnToggleRun.innerHTML = '<span>â¶</span> å¼å§èªå¨æ±è§£'; btnToggleRun.classList.add('btn-primary'); btnToggleRun.classList.remove('btn'); } function updateMetrics() { const totalCells = gridCols * gridRows - obstacles.length; metricStepLen.textContent = `${stepsCount} / ${snake.length}`; const fillPercent = ((snake.length / totalCells) * 100).toFixed(1avoiding state space calculation: 4^L * (NM) const expVal = (Math.pow(2.64, Math.min(snake.length, 36)) * totalCells).toExponential(2); metricStateSpace.textContent = `â ${expVal}`; if (snake.length === totalCells) { ability.textContent = 'è¿éæ å²ç¹'; } } // Rendering Canvas function draw() { const w = canvas.width; const h = canvas.height; ctx.clearRect(0, 0, w, h); const cellW = w / gridCols; const cellH = h / gridRows; // Draw Grid Lines ctx.strokeStyle = '#E5E7EB'; ctx.lineWidth = 1; for (let c = 0; c <= gridCols; c++) { ctx.beginPath(); ctx.moveTo(c * cellW, 0); ctx.lineTo(c * cellW, h); ctx.stroke(); } for (let r = 0; r <= gridRows; r++) { ctx.beginPath(); ctx.moveTo(0, r * cellH); ctx.lineTo(w, r * cellH); ctx.stroke(); } // Draw Hamiltonian Cycle Guide Path if (hamiltonianCycle.length > 1) { ctx.strokeStyle = '#BAE6FD'; ctx.lineWidth = 2; ctx.setLineDash([4, 4]); ctx.beginPath(); for (let i = 0; i < hamiltonianCycle.length; i++) { const pt = hamiltonianCycle[i]; const x = pt.c * cellW + cellW / 2; const y = pt.r * cellH + cellH / 2; if (i === 0) ctx.moveTo(x, y); else ctx.lineTo(x, y); } // close loop const first = hamiltonianCycle[0]; ctx.lineTo(first.c * cellW + cellW / 2, first.r * cellH + cellH / 2); ctx.stroke(); ctx.setLineDash([]); } // Draw Obstacles ctx.fillStyle = '#6B7280'; obstacles.forEach(obs => { const [r, c] = obs.split(',').map(Number); ctx.fillRect(c * cellW + 2, r * cellH + 2, cellW - 4, cellH - 4); }); // Draw Food if (food) { ctx.fillStyle = '#DC2626'; ctx.beginPath(); const fx = food.c * cellW + cellW / 2; const fy = food.r * cellH + cellH / 2; const fr = Math.min(cellW, cellH) * 0.32; ctx.arc(fx, fy, fr, 0, Math.PI * 2); ctx.fill(); } // Draw Snake Body Trajectory if (snake.length > 0) { for (let i = snake.length - 1; i >= 0; i--) { const part = snake[i]; const px = part.c * cellW + 3; const py = part.r * cellH + 3; const pw = cellW - 6; const ph = cellH - 6; if (i === 0) { // Head ctx.fillStyle = '#111111'; ctx.beginPath(); ctx.roundRect(px, py, pw, ph, 6); ctx.fill(); // Head eye indicator ctx.fillStyle = '#FFFFFF'; ctx.beginPath(); ctx.arc(px + pw / 2, py + ph / 2, Math.min(pw, ph) * 0.2, 0, Math.PI * 2); ctx.fill(); } else { // Body with gradient fade const alpha = 0.35 + 0.65 * (1 - i / snake.length); ctx.fillStyle = `rgba(2, 132, 199, ${alpha})`; ctx.beginPath(); ctx.roundRect(px, py, pw, ph, 4); ctx.fill(); } } } } // Export Analysis Artifact function exportStateJSON() { const data = { meta: { problem: "Computational Complexity Bounds of Shortest-Path Snake Clearing", grid_dimensions: { cols: gridCols, rows: gridRows }, has_obstacles: isObstacleMap, total_cells: gridCols * gridRows - obstacles.length }, execution_trace: { steps_executed: stepsCount, final_snake_length: snake.length, fill_percentage: ((snake.length / (gridCols * gridRows - obstacles.length)) * 100).toFixed(2) + '%', algorithm: currentStrategy }, theoretical_bounds: { hamiltonian_path_grid_graph: "NP-complete (Itai, Papadimitriou, Szwarcfiter, 1982)", reconfiguration_reachability: "PSPACE-complete (Demaine et al., 2004)", shortest_step_full_clear: "PSPACE-hard / NP-hard depending on obstacle structure" }, snake_coordinates: snake, food_coordinate: food, exported_at: new Date().toISOString() }; const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = `snake-complexity-trace-${gridCols}x${gridRows}-${Date.now()}.json`; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } // Event Listeners presetSelect.addEventListener('change', () => { resetSimulation(); }); strategySelect.addEventListener('change', (e) => { currentStrategy = e.target.value; if (currentStrategy === 'hamiltonian') { strategyTypeHint.textContent = 'Hamilton Cycle'; } else if (currentStrategy === 'astar-greedy') { strategyTypeHint.textContent = 'Greedy A*'; } else { strategyTypeHint.textContent = 'Shortcuts'; } statusMsg.textContent = `çç¥åæ´ä¸ºï¼${strategySelect.options[strategySelect.selectedIndex].text}`; }); speedRange.addEventListener('input', (e) => { speed = Number(e.target.value); speedVal.textContent = `${speed} steps/s`; if (isRunning) { clearInterval(timer); timer = setInterval(step, Math.max(16, Math.floor(1000 / speed))); } }); btnToggleRun.addEventListener('click', () => { if (isRunning) stopRun(); else startRun(); }); btnStep.addEventListener('click', () => { stopRun(); step(); }); btnReset.addEventListener('click', resetSimulation); btnExport.addEventListener('click', exportStateJSON); // Initial setup resetSimulation(); })(); </script> <style data-super-related-style="v1"> #super-related-tools{display:block;position:relative;clear:both;box-sizing:border-box;width:100%;max-width:1200px;flex-shrink:0;align-self:stretch;grid-column:1/-1;margin:72px auto 0;padding:32px 24px 40px;background:#101419;color:#f4f6f8;border-radius:20px;font-family:inherit;text-align:left;isolation:isolate} #super-related-tools *{box-sizing:border-box}#super-related-tools h2{margin:0 0 24px;padding:0;color:#f4f6f8;font-weight:600;font-size:clamp(22px,3vw,32px);line-height:1.2;letter-spacing:-.025em} #super-related-tools .super-related-grid{position:static;inset:auto;width:100%;height:auto;max-width:none;margin:0;padding:0;background:transparent;box-shadow:none;transform:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:dense;gap:20px} #super-related-tools .super-related-card{display:flex;flex-direction:column;position:relative;min-width:0;overflow:hidden;border:1px solid #343b45;border-radius:12px;background:#1b222b;color:#f4f6f8;text-decoration:none;transition:transform .2s ease,border-color .2s ease} #super-related-tools .super-related-card:hover{transform:translateY(-4px);border-color:#a5c8ed}#super-related-tools .super-related-card:focus-visible{outline:3px solid #8bc4ff;outline-offset:4px} #super-related-tools img{display:block;position:static;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;margin:0;border:0;opacity:1;filter:none;transform:none} #super-related-tools .super-related-copy{display:block;padding:18px}#super-related-tools strong{display:block;margin:0 0 10px;color:#fff;font-size:17px;line-height:1.4;font-weight:650;overflow-wrap:anywhere} #super-related-tools .super-related-copy>span{display:block;color:#c6d0dc;font-size:14px;line-height:1.6;overflow-wrap:anywhere} @media(max-width:680px){#super-related-tools{margin-top:48px;border-radius:0;padding:28px 18px}#super-related-tools .super-related-grid{grid-template-columns:1fr}} @media(prefers-reduced-motion:reduce){#super-related-tools .super-related-card{transition:none}#super-related-tools .super-related-card:hover{transform:none}} </style><aside id="super-related-tools" data-super-related-tools="v1" aria-label="Related tools"><h2>Explore related tools</h2><nav class="super-related-grid" aria-label="Three related tools"><a class="super-related-card" data-super-related-link="v1" href="https://app.getsupers.com/sites/browser-agent-step-debugger-63/"><img src="https://app.getsupers.com/sites/browser-agent-step-debugger-63/og-image.png" alt="Browser Agent Step Replay & Selector Debugger preview" width="1200" height="630" loading="eager" fetchpriority="low" decoding="async"><span class="super-related-copy"><strong>Browser Agent Step Replay & Selector Debugger</strong><span>Visual debugger for browser agent execution traces. Replay steps, inspect simulated DOM viewport bounding boxes, evaluate selector robustness (CSS, XPath, ARIA, Shadow DOM), and export executable Playwright / Stagehand TypeScript code.</span></span></a><a class="super-related-card" data-super-related-link="v1" href="https://app.getsupers.com/sites/x-monetization-account-giifblahbm-14/"><img src="https://app.getsupers.com/sites/x-monetization-account-giifblahbm-14/card.png" alt="Tasks.txt — Minimalist Plain-Text Task Studio preview" width="1200" height="630" loading="eager" fetchpriority="low" decoding="async"><span class="super-related-copy"><strong>Tasks.txt — Minimalist Plain-Text Task Studio</strong><span>A fast, distraction-free plain-text task system inspired by Tasks.txt. Type standard todo lines with priorities, projects, and due dates, then view as interactive macOS-style boards and focus queues.</span></span></a><a class="super-related-card" data-super-related-link="v1" href="https://app.getsupers.com/sites/browser-agent-step-inspector-47/"><img src="https://app.getsupers.com/sites/browser-agent-step-inspector-47/card.png" alt="Browser Agent Step Inspector & Replay Studio preview" width="1200" height="630" loading="eager" fetchpriority="low" decoding="async"><span class="super-related-copy"><strong>Browser Agent Step Inspector & Replay Studio</strong><span>Debug browser agent execution traces, inspect DOM selector fallback trees, scrub timelines, and export runnable Playwright/Stagehand automation scripts.</span></span></a></nav></aside><script data-super-related-layout="v1">(() => { const footer=document.getElementById('super-related-tools'); if(!footer)return; const body=document.body,root=document.documentElement; const constrained=[getComputedStyle(body).overflowY,getComputedStyle(root).overflowY].some(v=>v==='hidden'||v==='clip'); if(!constrained)return; // Full-viewport tools retain their original canvas space; links follow below it. footer.style.position='absolute';footer.style.left='0';footer.style.right='0';footer.style.zIndex='20'; body.style.setProperty('overflow-y','visible','important');root.style.setProperty('overflow-y','auto','important'); const place=()=>{ let bottom=innerHeight; for(const child of body.children){if(child===footer||['SCRIPT','STYLE'].includes(child.tagName))continue;const r=child.getBoundingClientRect();if(r.width&&r.height)bottom=Math.max(bottom,r.bottom+(getComputedStyle(child).position==='fixed'?0:scrollY));} footer.style.top=bottom+'px'; }; place();addEventListener('resize',place,{passive:true}); requestAnimationFrame(()=>dispatchEvent(new Event('resize'))); })();</script> </body> </html>