diff --git a/Tools/GPU-Occupancy-Calculator/README.md b/Tools/GPU-Occupancy-Calculator/README.md
index a2527b8050..ccd2789912 100644
--- a/Tools/GPU-Occupancy-Calculator/README.md
+++ b/Tools/GPU-Occupancy-Calculator/README.md
@@ -7,26 +7,20 @@ for GPU/HPC application development.
## Tool Details
-* Allows user to pick a GPU SKU, input Global Size of HPC application,
- Work-Group(WG) size, Sub-Group size, Shared Local Memory(SLM) size and barrier
- usage.
-* Computes Sub-Slice/Dual Sub-Slice (SS/DSS) Theoretical Occupancy based
- on the inputs.
-* Generates charts for Impact of varying Work-Group size and
- Impact of varying Shared Local Memory size.
-* Generates a list of all valid
- Work-Group sizes that can be used and corresponding Occupancy.
-* Generates a list of optimal configuration values for WG, SG and SLM limit that
- will get 100% Occupancy.
+The Intel GPU Occupancy tool will compute the theoretical GPU Occupancy for Intel GPU devices based on GPU Kernel code parameters. The Occupancy value will determine whether the GPU is efficiently utilizing all the GPU hardware resources. The tool will also generate graphs that will help optimize GPU Occupancy.
+
+* Allows user to select a GPU, input Global Size of HPC application,
+ Work-Group(WG) size, Sub-Group(SG) size and Shared Local Memory(SLM) size.
+* Computes Theoretical Occupancy based on the inputs.
+* Generates charts for Impact of varying Work-Group size, Impact of varying Shared Local Memory size and GPU Occupancy graph for the workload.
## Usage
* Open Page: [oneapi-src.github.io/oneAPI-samples/Tools/GPU-Occupancy-Calculator/](https://oneapi-src.github.io/oneAPI-samples/Tools/GPU-Occupancy-Calculator/)
-* Select a GPU from the dropdown and change "EU Count" if necessary OR select
+* Select a GPU from the dropdown and change "XVE Count" if necessary OR select
the option to enter PCI ID for GPU.
-* The tool will load some default values for Global Size, WG size, SG size,
- SLM size and will compute Occupancy and generate graphs.
-* Change the values of GPU target, Global size, WG size, SG size, SLM size or
- Barrier usage based on your HPC application to calculate Occupancy and tune application.
+* The tool will load some default values for Global Size, Work-Group size, Sub-Group size,
+ Local Memory size and will compute Occupancy and generate graphs.
+* Change the values of Global size, Work-Group size, Sub-Group size or Local Memory size based on your HPC application to calculate Occupancy and tune application.
### Custom GPU Configuration:
@@ -36,7 +30,7 @@ An example of a custom configuration and corresponding description are listed be
Example of Intel GPU Occupancy Calculator with Custom GPU configuration:
-`https://oneapi-src.github.io/oneAPI-samples/Tools/GPU-Occupancy-Calculator/?gpu=8;8;512;64;true;[32,16];128;128;[0,1,2,4,8,16,24,32,48,64,96,128];1024;64;32;My_GPU`
+`https://oneapi-src.github.io/oneAPI-samples/Tools/GPU-Occupancy-Calculator/?gpu=8;8;512;64;true;[32,16];128;128;[0,1,2,4,8,16,24,32,48,64,96,128];1024;64;64;My_GPU`
URL Parameters details are as follows:
```
@@ -51,7 +45,7 @@ URL Parameters details are as follows:
TG_SLM_Sizes = [0,1,2,4,8,16,24,32,48,64,96,128]
Max_Work_Group_Size = 1024
Max_Num_Of_Workgroups = 64
- Max_Num_Of_Barrier_Registers = 32
+ Max_Num_Of_Barrier_Registers = 64
Custom_GPU_Name (Optional) = My_GPU
```
## License
diff --git a/Tools/GPU-Occupancy-Calculator/index.html b/Tools/GPU-Occupancy-Calculator/index.html
index 2b3242e096..9b469a8422 100644
--- a/Tools/GPU-Occupancy-Calculator/index.html
+++ b/Tools/GPU-Occupancy-Calculator/index.html
@@ -15,14 +15,19 @@
.line{float:left; }
.section_chart {float:left}
.section {display:none;float:left;font-size: 10px;margin:20px;border-bottom:2px solid rgba(0,0,0,0.2); background-color: #fff}
- #occ_cal{display:block;}
- .title, .title2{text-align:center;color:#555;padding:15px; font-size:12px; font-weight:bold;letter-spacing: 1px}
+ #occ_cal, #help{display:block;}
+ #help{float_:left;}
+ .text{margin:auto;background-color:#fff;padding:10px 20px;color:#777; font-size:13px;letter-spacing: 1px;line-height: 22px;}
+ .title, .title2{text-align:center;color:#555;padding:15px; font-size:12px; font-weight:bold;letter-spacing: 1px}
.title{text-transform: uppercase;border-bottom:2px solid rgba(0,0,0,0.2)}
.info{color:#777; font-size:11px;letter-spacing: 1px}
.targets{padding:0 10px 10px;background-color: #eee; border-radius: 5px}
+ .kernel{padding:10px;background-color: #def; border-radius: 5px}
+ .inputs {margin:20px 0 0}
.pci_id {display:none;}
.box {margin:auto;max-width:320px;padding:15px;}
- .row {margin-top:20px}
+ .row {margin:5px 0 15px}
+ .row {border-top:1px solid #ccc}
.input {border-color: #777; padding:5px; border-radius: 5px; border-width: 1px;margin:10px 0; width:100%;font-size:18px;}
.input_small {font-size: 11px}
.radio {padding:10px 0;}
@@ -30,8 +35,22 @@
.button, .button_light {text-align:center;line-height:34px;border-color: #0071c4;color:#fff;background-color:#0071c4; border-radius: 5px; border-width: 1px;margin:10px 0; width:100%;font-size:18px;cursor:pointer;}
.left {float:left; width:170px;}
.help {color: #0071c4; border:2px solid #0071c4;border-radius: 100%;float:left; width:20px;height:20px;line-height: 20px;font-size: 11px;font-weight:bold;margin:15px 10px 0 0; text-align:center;text-decoration:none;}
+ .def {font-family:Courier; font-size:14px}
+ #help {padding-bottom:20px}
+ #help h3 {color:#555; font-weight:bold;font-size:16px;}
+ #help b {color:#555;}
+ code {color:#555;background-color:#eee;padding:3px 0; border-radius:4px}
+ .tooltip code {color:#eee;background-color:#444;}
+ .more_details{cursor:pointer;text-decoration:underline;color:#0071c4;font-weight:bold;font-size:16px}
+ ol>li{margin-bottom:12px}
+ ul>li{margin-top:6px}
+ .help_small {cursor:pointer;color: #0071c4; border:2px solid #0071c4;border-radius: 100%;display:inline-block;width:12px;height:12px;line-height: 12px;font-size: 8px;font-weight:bold; text-align:center;text-decoration:none;margin:4px 10px}
+ .tooltip {visibility: hidden;width: 200px;background-color: #000000dd;color: #fff;border-radius: 6px;padding: 5px 10px;position: absolute;z-index: 1;}
+ .tta{color:#fff}
+ .tooltiphover{cursor:pointer;}
+ .tooltiphover:hover .tooltip {visibility: visible;cursor:pointer}
.notes {padding:20px 5px 5px;color:#777;}
- .button_light {border-color: #444;color:#fff;background-color:#777; width:80px; float: right;}
+ .button_light {border-color: #444;color:#fff;background-color:#777; width:80px; float: right;}
.result{margin-top:20px; background-color:#cec;font-size: 12px; line-height: 24px; padding:10px;border-radius:5px}
.result td {background-color: transparent;font-size: 12px}
.result td b {font-size: 20px}
@@ -39,12 +58,12 @@
td{padding:3px 8px;background-color:#fff;}
thead{font-weight:bold;padding: 10px;}
thead td{background-color:#f8f8f8;padding:8px;}
- #chart_box_wg, #chart_box_slm {background-color: #cec;float:none;padding:10px;}
- #chartjs_wg, #chartjs_slm{max-width:700px;max-height:400px;margin:auto;background-color:#fff;letter-spacing: 0}
+ #chart_box_wg, #chart_box_slm, #chart_box_gpu {background-color: #cec;float:none;padding:10px;}
+ #chartjs_wg, #chartjs_slm, #chartjs_gpu{max-width:700px;max-height:340px;margin:auto;background-color:#fff;letter-spacing: 0}
#output_wg, #output_opt_config, #chart_box_wg, #chart_box_slm {display:none;background-color: #cec}
#output_wg .output, #output_opt_config .output{width:320px;max-height:300px;overflow:auto;}
.output td{font-size:11px;}
- input.slider {float:left;width:240px;}
+ input.slider {float:left;width:220px;}
div.slider {float:right;padding:5px;margin:10px 0;;font-size:18px;}
@media screen and (max-width:660px){
@@ -59,6 +78,14 @@
.section {margin:20px 0;width:345;}
}
+