Skip to content

Commit 90f16a3

Browse files
rhamlettrhamlett
committed
documentation and visual updates
1 parent 3218788 commit 90f16a3

3 files changed

Lines changed: 211 additions & 100 deletions

File tree

‎src/main/resources/static/azure-deployment.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -592,12 +592,12 @@ <h3>Assign Contributor Role</h3>
592592
<section id="github-secrets" class="card">
593593
<h2><span class="step-number">5</span> Configure GitHub Secrets</h2>
594594

595-
<h3>Fork or Clone the Repository</h3>
595+
<h3>Clone the Repository</h3>
596596
<ol>
597-
<li><strong>Fork the Repository</strong>
597+
<li><strong>Clone the Repository</strong>
598598
<ul>
599599
<li>Go to the Performance Problem Simulator repository for your stack</li>
600-
<li>Click <strong>Fork</strong> to create your own copy</li>
600+
<li>Click <strong>Code</strong> and clone to create your own copy</li>
601601
</ul>
602602
</li>
603603
</ol>

‎src/main/resources/static/css/styles.css‎

Lines changed: 18 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -400,71 +400,52 @@ header nav {
400400
Connection Status
401401
-------------------------------------------------------------------------- */
402402
#connection-status {
403-
padding: 0.3rem 0.6rem;
404-
border-radius: 20px;
405-
font-size: 0.75rem;
406-
font-weight: 500;
407403
display: flex;
408404
align-items: center;
409-
gap: 0.4rem;
410-
background: transparent;
411-
border: 1px solid rgba(255,255,255,0.4);
412-
}
413-
414-
.status-connected {
415-
background: transparent;
405+
gap: 0.5rem;
406+
font-size: 0.875rem;
416407
color: white;
417408
}
418409

419410
.status-connected::before {
420411
content: "";
421-
width: 8px;
422-
height: 8px;
412+
width: 12px;
413+
height: 12px;
423414
border-radius: 50%;
424-
background: #5CB85C;
415+
background: #2ecc40;
416+
box-shadow: 0 0 8px #2ecc40;
425417
display: inline-block;
426-
}
427-
428-
.status-disconnected {
429-
background: transparent;
430-
color: white;
418+
transition: background 150ms ease;
431419
}
432420

433421
.status-disconnected::before {
434422
content: "";
435-
width: 8px;
436-
height: 8px;
423+
width: 12px;
424+
height: 12px;
437425
border-radius: 50%;
438-
background: #ff6b6b;
426+
background: #d13438;
439427
display: inline-block;
440-
}
441-
442-
.status-idle {
443-
background: transparent;
444-
color: white;
428+
transition: background 150ms ease;
445429
}
446430

447431
.status-idle::before {
448432
content: "";
449-
width: 8px;
450-
height: 8px;
433+
width: 12px;
434+
height: 12px;
451435
border-radius: 50%;
452-
background: #888;
436+
background: #8a8886;
453437
display: inline-block;
454-
}
455-
456-
.status-reconnecting {
457-
background: transparent;
458-
color: white;
438+
transition: background 150ms ease;
459439
}
460440

461441
.status-reconnecting::before {
462442
content: "";
463-
width: 8px;
464-
height: 8px;
443+
width: 12px;
444+
height: 12px;
465445
border-radius: 50%;
466446
background: #ffb900;
467447
display: inline-block;
448+
transition: background 150ms ease;
468449
}
469450

470451
/* --------------------------------------------------------------------------

‎src/main/resources/static/docs.html‎

Lines changed: 190 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -272,65 +272,6 @@ <h3>Purpose</h3>
272272
</div>
273273
</section>
274274

275-
<section id="architecture" class="card">
276-
<h2>Architecture</h2>
277-
<p>The application runs as a Spring Boot 3.3 application with embedded Tomcat, STOMP over WebSocket for real-time metrics, and in-memory state. A dedicated probe service measures request latency by probing the app through Azure's frontend.</p>
278-
279-
<h3>Key Components</h3>
280-
<ul>
281-
<li><strong>Spring Boot Application</strong> — Embedded Tomcat server with REST controllers and WebSocket support</li>
282-
<li><strong>Probe Service</strong> — Background scheduled task that measures request latency by sending HTTP probes through the Azure frontend</li>
283-
<li><strong>Simulation Services</strong> — CPU stress, memory pressure, and thread blocking simulations run in dedicated thread pools to avoid starving the servlet threads</li>
284-
<li><strong>WebSocket Broker</strong> — STOMP messaging via SockJS for real-time dashboard updates (metrics, events, simulation status)</li>
285-
</ul>
286-
287-
<h3>Source Structure</h3>
288-
<pre><code>src/main/java/com/microsoft/azure/samples/perfsimjava/
289-
├── PerfSimJavaApplication.java # Main entry point
290-
│
291-
├── config/ # Configuration
292-
│ ├── AppConfig.java # Application settings
293-
│ ├── OpenApiConfig.java # Swagger/OpenAPI setup
294-
│ └── WebSocketConfig.java # STOMP/WebSocket setup
295-
│
296-
├── controller/ # REST API endpoints
297-
│ ├── AdminController.java # Status and event log
298-
│ ├── CpuController.java # CPU stress simulation
299-
│ ├── CrashController.java # Crash simulations
300-
│ ├── HealthController.java # Health probes and config
301-
│ ├── MemoryController.java # Memory pressure simulation
302-
│ ├── MetricsController.java # System metrics API
303-
│ └── ThreadStarvationController.java
304-
│
305-
├── service/ # Business logic
306-
│ ├── CpuStressService.java # Thread pool for CPU work
307-
│ ├── CrashService.java # Crash triggers
308-
│ ├── EventLogService.java # Event broadcasting
309-
│ ├── IdleService.java # Idle timeout management
310-
│ ├── MemoryPressureService.java # Memory allocation
311-
│ ├── MetricsService.java # JMX metrics collection
312-
│ ├── ProbeService.java # Latency measurement
313-
│ └── ThreadStarvationService.java # Servlet thread blocking
314-
│
315-
├── model/ # Data models and DTOs
316-
│ ├── Simulation.java
317-
│ ├── SystemMetrics.java
318-
│ └── dto/ # Request/response DTOs
319-
│
320-
└── resources/
321-
├── application.properties # Spring configuration
322-
└── static/ # Dashboard files
323-
├── index.html # Main dashboard
324-
├── docs.html # Documentation
325-
├── azure-diagnostics.html # Azure diagnostics guide
326-
├── azure-deployment.html # Deployment guide
327-
├── css/styles.css
328-
└── js/
329-
├── charts.js # Real-time Chart.js charts
330-
├── dashboard.js # UI interactions & controls
331-
└── socket-client.js # STOMP/SockJS client</code></pre>
332-
</section>
333-
334275
<section id="cpu-simulation" class="card">
335276
<h2>CPU Stress Simulation</h2>
336277

@@ -604,14 +545,201 @@ <h4>💥 Out of Memory (OOM)</h4>
604545
<li>Heap dump collection configuration</li>
605546
</ul>
606547
</section>
548+
549+
<section id="optional-config" class="card">
550+
<h2>Optional Configuration</h2>
551+
<p>You can customize the application behavior using Azure App Service environment variables.</p>
552+
553+
<h3>Health Probe Rate</h3>
554+
<p>Control how often the server sends health probes to measure request latency. All probes are routed through the Azure frontend to capture realistic end-to-end latency.</p>
555+
556+
<h4>Environment Variable</h4>
557+
<table>
558+
<thead>
559+
<tr>
560+
<th>Variable Name</th>
561+
<th>Description</th>
562+
<th>Default</th>
563+
</tr>
564+
</thead>
565+
<tbody>
566+
<tr>
567+
<td><code>HEALTH_PROBE_RATE</code></td>
568+
<td>Probe interval in milliseconds. Minimum 100ms.</td>
569+
<td><code>200</code></td>
570+
</tr>
571+
</tbody>
572+
</table>
573+
574+
<h4>Setting via Azure CLI</h4>
575+
<pre><code># Slow down probes if CLR profiler shows overlapping requests
576+
az webapp config appsettings set --name $APP_NAME --resource-group $RESOURCE_GROUP \
577+
--settings HEALTH_PROBE_RATE=400</code></pre>
578+
579+
<h3>Idle Timeout</h3>
580+
<p>When the application is idle (no dashboard connections or load test requests), health probes are automatically suspended to reduce unnecessary network traffic to Azure's frontend and Application Insights telemetry.</p>
581+
582+
<h4>Environment Variable</h4>
583+
<table>
584+
<thead>
585+
<tr>
586+
<th>Variable Name</th>
587+
<th>Description</th>
588+
<th>Default</th>
589+
</tr>
590+
</thead>
591+
<tbody>
592+
<tr>
593+
<td><code>IDLE_TIMEOUT_MINUTES</code></td>
594+
<td>Minutes of inactivity before suspending health probes. Activity resumes automatically when the dashboard is opened or any request is received.</td>
595+
<td><code>20</code></td>
596+
</tr>
597+
</tbody>
598+
</table>
599+
600+
<h4>Setting via Azure CLI</h4>
601+
<pre><code># Extend idle timeout to 30 minutes
602+
az webapp config appsettings set --name $APP_NAME --resource-group $RESOURCE_GROUP \
603+
--settings IDLE_TIMEOUT_MINUTES=30</code></pre>
604+
605+
<h3>Custom Page Footer</h3>
606+
<p>Set a custom footer message that appears on all pages. The footer supports HTML, allowing you to include links.</p>
607+
608+
<h4>Environment Variable</h4>
609+
<table>
610+
<thead>
611+
<tr>
612+
<th>Variable Name</th>
613+
<th>Description</th>
614+
</tr>
615+
</thead>
616+
<tbody>
617+
<tr>
618+
<td><code>PAGE_FOOTER</code></td>
619+
<td>HTML content for the footer's second line. If not set, only the app description and build info are shown.</td>
620+
</tr>
621+
</tbody>
622+
</table>
623+
624+
<h4>Example Value</h4>
625+
<pre><code>Created by &lt;a href="https://yoursite.com"&gt;Your Team&lt;/a&gt; for training purposes</code></pre>
626+
627+
<h4>Setting via Azure CLI</h4>
628+
<pre><code># Set the footer via Azure CLI
629+
az webapp config appsettings set --name $APP_NAME --resource-group $RESOURCE_GROUP \
630+
--settings 'PAGE_FOOTER=Created by &lt;a href="https://yoursite.com"&gt;Your Team&lt;/a&gt; for training purposes'</code></pre>
631+
632+
<h4>Setting via Azure Portal</h4>
633+
<ol>
634+
<li>Navigate to your App Service in the Azure Portal</li>
635+
<li>Go to <strong>Settings</strong> → <strong>Environment variables</strong></li>
636+
<li>Click <strong>+ Add</strong></li>
637+
<li>Set Name: <code>PAGE_FOOTER</code></li>
638+
<li>Set Value: Your HTML footer content</li>
639+
<li>Click <strong>Apply</strong>, then <strong>Confirm</strong></li>
640+
</ol>
641+
642+
<h3>GitHub Repository Link</h3>
643+
<p>By default, the GitHub Repository link in the sidebar menu is hidden. Set both environment variables below to display a link to your GitHub repository in the navigation menu.</p>
644+
645+
<h4>Environment Variables</h4>
646+
<table>
647+
<thead>
648+
<tr>
649+
<th>Variable Name</th>
650+
<th>Description</th>
651+
</tr>
652+
</thead>
653+
<tbody>
654+
<tr>
655+
<td><code>GITHUB_USER_NAME</code></td>
656+
<td>The GitHub username or organization that owns the repository.</td>
657+
</tr>
658+
<tr>
659+
<td><code>GITHUB_REPO_NAME</code></td>
660+
<td>The name of the GitHub repository.</td>
661+
</tr>
662+
</tbody>
663+
</table>
664+
665+
<h4>Example</h4>
666+
<p>To link to <code>https://github.com/myorg/myrepo</code>, set:</p>
667+
<ul>
668+
<li><code>GITHUB_USER_NAME=myorg</code></li>
669+
<li><code>GITHUB_REPO_NAME=myrepo</code></li>
670+
</ul>
671+
672+
<h4>Setting via Azure CLI</h4>
673+
<pre><code># Set the GitHub repository link
674+
az webapp config appsettings set --name $APP_NAME --resource-group $RESOURCE_GROUP \
675+
--settings GITHUB_USER_NAME=myorg GITHUB_REPO_NAME=myrepo</code></pre>
676+
</section>
677+
678+
<section id="architecture" class="card">
679+
<h2>Architecture</h2>
680+
<p>The application runs as a Spring Boot 3.3 application with embedded Tomcat, STOMP over WebSocket for real-time metrics, and in-memory state. A dedicated probe service measures request latency by probing the app through Azure's frontend.</p>
681+
682+
<h3>Key Components</h3>
683+
<ul>
684+
<li><strong>Spring Boot Application</strong> — Embedded Tomcat server with REST controllers and WebSocket support</li>
685+
<li><strong>Probe Service</strong> — Background scheduled task that measures request latency by sending HTTP probes through the Azure frontend</li>
686+
<li><strong>Simulation Services</strong> — CPU stress, memory pressure, and thread blocking simulations run in dedicated thread pools to avoid starving the servlet threads</li>
687+
<li><strong>WebSocket Broker</strong> — STOMP messaging via SockJS for real-time dashboard updates (metrics, events, simulation status)</li>
688+
</ul>
689+
690+
<h3>Source Structure</h3>
691+
<pre><code>src/main/java/com/microsoft/azure/samples/perfsimjava/
692+
├── PerfSimJavaApplication.java # Main entry point
693+
│
694+
├── config/ # Configuration
695+
│ ├── AppConfig.java # Application settings
696+
│ ├── OpenApiConfig.java # Swagger/OpenAPI setup
697+
│ └── WebSocketConfig.java # STOMP/WebSocket setup
698+
│
699+
├── controller/ # REST API endpoints
700+
│ ├── AdminController.java # Status and event log
701+
│ ├── CpuController.java # CPU stress simulation
702+
│ ├── CrashController.java # Crash simulations
703+
│ ├── HealthController.java # Health probes and config
704+
│ ├── MemoryController.java # Memory pressure simulation
705+
│ ├── MetricsController.java # System metrics API
706+
│ └── ThreadStarvationController.java
707+
│
708+
├── service/ # Business logic
709+
│ ├── CpuStressService.java # Thread pool for CPU work
710+
│ ├── CrashService.java # Crash triggers
711+
│ ├── EventLogService.java # Event broadcasting
712+
│ ├── IdleService.java # Idle timeout management
713+
│ ├── MemoryPressureService.java # Memory allocation
714+
│ ├── MetricsService.java # JMX metrics collection
715+
│ ├── ProbeService.java # Latency measurement
716+
│ └── ThreadStarvationService.java # Servlet thread blocking
717+
│
718+
├── model/ # Data models and DTOs
719+
│ ├── Simulation.java
720+
│ ├── SystemMetrics.java
721+
│ └── dto/ # Request/response DTOs
722+
│
723+
└── resources/
724+
├── application.properties # Spring configuration
725+
└── static/ # Dashboard files
726+
├── index.html # Main dashboard
727+
├── docs.html # Documentation
728+
├── azure-diagnostics.html # Azure diagnostics guide
729+
├── azure-deployment.html # Deployment guide
730+
├── css/styles.css
731+
└── js/
732+
├── charts.js # Real-time Chart.js charts
733+
├── dashboard.js # UI interactions & controls
734+
└── socket-client.js # STOMP/SockJS client</code></pre>
735+
</section>
607736
</main>
608737

609738
<!-- Right-side Table of Contents -->
610739
<aside class="doc-toc">
611740
<div class="doc-toc-inner">
612741
<h2>ON THIS PAGE</h2>
613742
<a href="#overview" class="doc-toc-link active"><span class="toc-icon">📄</span> Overview</a>
614-
<a href="#architecture" class="doc-toc-link"><span class="toc-icon">🏗️</span> Architecture</a>
615743

616744
<div class="doc-toc-section-label toc-section-simulations">
617745
<span class="toc-section-icon">🎮</span> SIMULATIONS
@@ -622,6 +750,8 @@ <h2>ON THIS PAGE</h2>
622750
<a href="#connection-pool" class="doc-toc-link"><span class="toc-icon">🔌</span> Connection Pool</a>
623751
<a href="#failed-requests" class="doc-toc-link"><span class="toc-icon">❌</span> Failed Requests</a>
624752
<a href="#crash-simulation" class="doc-toc-link"><span class="toc-icon">💥</span> Crash Simulation</a>
753+
<a href="#optional-config" class="doc-toc-link"><span class="toc-icon">⚙️</span> Optional Config</a>
754+
<a href="#architecture" class="doc-toc-link"><span class="toc-icon">🏗️</span> Architecture</a>
625755
</div>
626756
</aside>
627757
</div>

0 commit comments

Comments
 (0)