blob: ee06ddb0bda4d8210332791f678d0f172ec0f26f [file] [log] [blame]
<!DOCTYPE html>
<html lang="en">
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-112407000-2"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'UA-112407000-2');
</script>
<!-- Google Tag Manager -->
<script>
(function (w, d, s, l, i) {
w[l] = w[l] || [];
w[l].push({
'gtm.start': new Date().getTime(),
event: 'gtm.js'
});
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s),
dl = l != 'dataLayer' ? '&l=' + l : '';
j.async = true;
j.src =
'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-KS8HHSF');
</script>
<!-- End Google Tag Manager -->
<head>
<base href="/codewind/" />
<title>Monitoring your applications with the performance dashboard | Codewind</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Monitoring your applications with the performance dashboard">
<meta name="keywords" content="guide, help, performance, dashboard, monitoring, applications, VS Code, Codewind, Eclipse, graph, graphs, load, test, load test, test comparison"/>
<link rel="icon" type="image/png" sizes="16x16" href="images/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
<link href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:300,400,600&display=swap" rel="stylesheet">
<!-- Bootstrap CSS CDN -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
<link rel="stylesheet" href="css/styles.css">
<link rel="stylesheet" href="css/docs.css">
</head>
<body data-spy="scroll" data-target="#toc">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KS8HHSF"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<div class="main">
<!-- Bootstrap NavBar -->
<nav class="navbar navbar-expand-lg navbar-light cw-banner fixed-top">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="">
<img src="images/header-logo.svg" class="cw-header-logo" alt="">
</a>
<div class="collapse navbar-collapse justify-content-end cw-navbar-padding" id="navbarNavDropdown">
<ul class="navbar-nav cw-navbar-nav">
<li class="nav-item cw-navbar-item cw-header-link">
<a class="nav-link cw-nav-link" href="docindex.html">Docs</a>
</li>
<!-- li class="nav-item cw-navbar-item" id="download-li">
<button onClick="window.location.href='https://microclimate.dev/download/codewind';" type="button" class="btn cw-download-button">Download</button>
<a href="https://microclimate.dev/download/codewind" class="nav-link cw-nav-link cw-download-link" href="#">Download</a>
</li> -->
<li class="nav-item cw-navbar-item" id="github-stars-button">
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/eclipse/codewind" data-size="large"
data-show-count="true" aria-label="Star eclipse/codewind on GitHub">Star</a>
</li>
<!-- Smaller devices menu END -->
</ul>
</div>
</nav>
<!-- NavBar END -->
<!-- Bootstrap row -->
<div class="row" id="body-row">
<!-- Sidebar -->
<div id="sidebar-container" class="bg-light">
<!-- Bootstrap List Group -->
<ul class="list-group sticky-top bg-light cw-sticky-offset">
<!-- Separator with title -->
<li class="list-group-item cw-sidebar-separator-title cw-text-gray d-flex bg-light align-items-center menu-collapsed">
<small class="badge badge-success cw-margin-auto">DOCUMENTS</small>
</li>
<!-- /END Separator -->
<!-- Hard coded TOC -->
<a href="#install_on_cloud" data-toggle="collapse" aria-expanded="false" class="bg-light list-group-item list-group-item-action flex-column align-items-start collapsed">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Installing and Using Codewind on Cloud</span>
<span class="submenu-icon ml-auto"></span>
</div>
</a>
<div id="install_on_cloud" class="cw-sidebar-div cw-sidebar-submenu collapse" style="">
<a href="installoncloud.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Installing and Using Codewind on Kubernetes</span>
</div>
</a>
<a href="supportingmultipleusers.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Support for multiple users</span>
</div>
</a>
<a href="viewkibanalogs.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Viewing logs using Kibana in IBM Cloud Private</span>
</div>
</a>
</div>
<a href="installlocally.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Installing Codewind locally</span>
</div>
</a>
<a href="#codewind_for_eclipse" data-toggle="collapse" aria-expanded="false" class="bg-light list-group-item list-group-item-action flex-column align-items-start collapsed">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Codewind for Eclipse</span>
<span class="submenu-icon ml-auto"></span>
</div>
</a>
<div id="codewind_for_eclipse" class="cw-sidebar-div cw-sidebar-submenu collapse" style="">
<a href="mdteclipseoverview.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Overview</span>
</div>
</a>
<a href="mdteclipsegettingstarted.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Installation and Getting Started</span>
</div>
</a>
<a href="mdteclipsemanagingprojects.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Managing Codewind projects</span>
</div>
</a>
<a href="mdteclipsebuildproject.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Building Codewind projects</span>
</div>
</a>
<a href="mdteclipsedebugproject.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Debugging Codewind projects</span>
</div>
</a>
<a href="mdteclipsetroubleshooting.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Troubleshooting</span>
</div>
</a>
<a href="mdteclipseuninstall.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Uninstalling</span>
</div>
</a>
</div>
<a href="#codewind_for_vscode" data-toggle="collapse" aria-expanded="false" class="bg-light list-group-item list-group-item-action flex-column align-items-start collapsed">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Codewind for VS Code</span>
<span class="submenu-icon ml-auto"></span>
</div>
</a>
<div id="codewind_for_vscode" class="cw-sidebar-div cw-sidebar-submenu collapse" style="">
<a href="mdt-vsc-overview.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Overview</span>
</div>
</a>
<a href="mdt-vsc-getting-started.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Getting started</span>
</div>
</a>
<a href="mdt-vsc-tutorial.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Tutorial</span>
</div>
</a>
<a href="mdt-vsc-commands-overview.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Commands overview</span>
</div>
</a>
<a href="mdt-vsc-commands-project.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Project commands</span>
</div>
</a>
<a href="mdt-vsc-commands-restart-and-debug.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Restart and debug commands</span>
</div>
</a>
<a href="mdt-vsc-troubleshooting.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Troubleshooting</span>
</div>
</a>
<a href="mdt-vsc-uninstall.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Uninstalling</span>
</div>
</a>
</div>
<a href="#configuring_codewind" data-toggle="collapse" aria-expanded="false" class="bg-light list-group-item list-group-item-action flex-column align-items-start collapsed">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Configuring Codewind</span>
<span class="submenu-icon ml-auto"></span>
</div>
</a>
<div id="configuring_codewind" class="cw-sidebar-div cw-sidebar-submenu collapse" style="">
<a href="usingadifferenttemplate"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Using a template repository of your own</span>
</div>
</a>
</div>
<a href="guide_performance.html"
class="cw-current-page bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Guide: Monitoring applications with the performance dashboard</span>
</div>
</a>
<a href="uninstall.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Uninstalling Codewind</span>
</div>
</a>
<a href="troubleshooting.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Troubleshooting</span>
</div>
</a>
<a href="limitations.html"
class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Limitations</span>
</div>
</a>
<!-- END hard coded TOC -->
<!-- Separator without title -->
<li class="list-group-item cw-sidebar-separator-title bg-light cw-text-gray d-flex align-items-center menu-collapsed">
<small class="badge badge-success cw-margin-auto">HELPFUL
LINKS</small>
</li>
<!-- /END Separator -->
<a href="https://projects.eclipse.org/proposals/eclipse-codewind" class="bg-light list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-start align-items-center">
<span class="menu-collapsed">Eclipse Codewind project page</span>
</div>
</a>
<!-- Logo -->
<li class="list-group-item cw-logo-separator bg-light d-flex justify-content-center">
<img src="images/header-logo.svg">
</li>
</ul>
<!-- List Group END-->
</div>
<!-- sidebar-container END -->
<!-- MAIN -->
<div id="content-container" class="py-5 px-5">
<div role="main"><h2 id="monitoring-applications-with-the-performance-dashboard">Monitoring applications with the performance dashboard</h2>
<p>Learn how to improve application performance with the performance dashboard.</p>
<h2 id="what-youll-learn">What you’ll learn</h2>
<p>You will learn how to add and enable monitoring to your application. Then, you can run an application and use the performance dashboard data to determine whether the application is working harder than it should. By determining which applications are running harder than necessary, the performance dashboard can help you find slower applications and detect memory leaks.</p>
<h2 id="prerequisites">Prerequisites</h2>
<ul>
<li>VS Code or Eclipse</li>
<li>A Codewind installation</li>
</ul>
<h2 id="accessing-the-performance-dashboard">Accessing the performance dashboard</h2>
<ol>
<li>From your IDE, go to the Codewind plug-in and right-click a project.</li>
<li>Then, select <strong>Open Performance Dashboard</strong>. A window appears that displays the performance dashboard.<br /></li>
</ol>
<p><img src="dist/images/performanceguide/performancedash_window.png" alt="performance dashboard" height="345px" width="691px" />. <br /></p>
<h2 id="running-a-load-test">Running a load test</h2>
<ol>
<li>Click <strong>Run Load Test</strong>. A <strong>Load test configuration</strong> window appears.</li>
<li>Add a description for the test.</li>
<li>Then, click <strong>Run</strong>. The <strong>Running</strong> counter begins counting down as load is applied to your application.</li>
<li>[Optional] If you want to cancel, click <code class="highlighter-rouge">x</code> to stop the test.</li>
<li>When the load is finished, the graph shifts and displays new plot points.</li>
</ol>
<h2 id="modifying-the-load-test">Modifying the load test</h2>
<ol>
<li>To modify the type of load run, click <strong>Modify Parameters</strong>. The <strong>Load test configuration</strong> window appears.</li>
<li>You can change the following values:
<ul>
<li><strong>Method</strong>: Choose a GET or POST request.</li>
<li><strong>Path</strong></li>
<li><strong>Requests/second</strong>: Change the number of requests per second.</li>
<li><strong>Concurrent</strong></li>
<li><strong>Duration</strong>: Choose the duration of the test in seconds.</li>
<li><strong>JSON Body</strong>: Add custom JSON. The builds include validation, and notifications are sent if the JSON is incorrect.</li>
</ul>
</li>
</ol>
<h2 id="viewing-test-comparisons">Viewing test comparisons</h2>
<p>The <strong>Previous test</strong> and <strong>Latest test</strong> display a comparison between the most recent load test that you ran and the previous load test.</p>
<p>You can edit the test descriptions by clicking the pencil icons and saving your text. The description then appears in the <strong>Test history</strong> list. Click the pencil or the text to edit the description in the <strong>Test history</strong> list.</p>
<h2 id="reading-line-graphs">Reading line graphs</h2>
<ul>
<li>The response time, <strong>Response (ms)</strong>, is selected by default.</li>
<li>The graph shows the last entry that you selected in the list of counter types, such as <strong>Hits</strong>, <strong>CPU (%)</strong>, and <strong>Memory (MB)</strong>.</li>
<li>Hover over a point in the graph to see individual values for the counters. The tooltip displays <strong>CPU (%)</strong>, <strong>Memory</strong>, <strong>HTTP Response</strong>, and <strong>HTTP Hits</strong>.</li>
<li>A maximum of fifteen minutes of data is shown across all graphs. If the monitored application is producing large amounts of data, the dashboard automatically starts to aggregate the data. The longest time is the value that is plotted.</li>
<li>If you have five or more snapshots, the zoom bar appears by default. To use the zoom bar, swipe over a section of the graph by using your computer touch pad or use the handles in the zoom bar itself. To remove the handles, click a blank space in the zoom bar.<br /></li>
</ul>
<h3 id="diagnosing-problems">Diagnosing problems</h3>
<p>Use the performance dashboard to identify common performance problems:</p>
<ul>
<li>Slow HTTP response times on some or all routes</li>
<li>Lower than expected throughput in the application</li>
<li>Spikes in demand that cause slowdown</li>
<li>Higher than expected CPU usage for the level of throughput or load</li>
<li>High or growing memory usage that indicates a potential memory leak</li>
<li>Where time is being spent in your application</li>
</ul>
</div>
</div>
</div>
<!-- Main Col END -->
<!-- footer row -->
<footer>
<div class="row" id="footer-div">
<div class="col-lg-3 col-md-3 footer-col text-center">
<div>
<div>
<a href="https://twitter.com/EclipseCodewind"><img src="images/twitter-logo.svg" class="cw-logo" /></a>
</div>
<div>@EclipseCodewind</div>
</div>
</div>
<div class="col-lg-3 col-md-3 footer-col text-center">
<div>
<div>
<a href="https://github.com/eclipse/codewind"><img src="images/github-logo.svg"
class="cw-logo" /></a>
</div>
<div>@Codewind</div>
</div>
</div>
<div class="col-lg-3 col-md-3 footer-col text-center">
<div>
<div>
<a href="mailto:codewind-dev@eclipse.org"><img src="images/email-icon.svg" class="cw-logo" /></a>
</div>
<div>@Codewind</div>
</div>
</div>
<div class="col-lg-3 col-md-3 footer-col text-center">
<div class="cw-logo-mm" >
<div class="cw-logo-mm" >
<a href="mailto:codewind-dev@eclipse.org"><img src="images/mattermost-logo.png" class="cw-logo-mm" /></a>
</div>
</div>
</div>
</div>
</footer>
<!-- footer row END --> <!-- Jquery -->
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
<!-- Font Awesome JS -->
<script defer src="https://use.fontawesome.com/releases/v5.0.13/js/solid.js"
integrity="sha384-tzzSw1/Vo+0N5UhStP3bvwWPq+uvzCMfrN1fEFe+xBmv1C/AtVX5K0uZtmcHitFZ" crossorigin="anonymous">
</script>
<script defer src="https://use.fontawesome.com/releases/v5.0.13/js/fontawesome.js"
integrity="sha384-6OIrr52G08NpOFSZdxxz1xdNSndlD4vdcf/q2myIUVO0VsqaGHJsB0RaBE01VTOY" crossorigin="anonymous">
</script>
<!-- Place this tag in your head or just before your close body tag. -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
<script src="js/jquery.matchHeight-min.js"></script>
<script src="js/index.js"></script>
<script src="js/docs.js"></script>
</div>
</body>
</html>