@@ -978,7 +978,7 @@ button {
978
978
active : true ,
979
979
code : `let resultArray = null;
980
980
let currentIndex = 0;
981
- let chunkSize = 512 ;
981
+ let chunkSize = 256 ;
982
982
983
983
async function webnn() {
984
984
// Compute softmax() on N-D tensors (N > 2)
@@ -1012,17 +1012,18 @@ function showChunk() {
1012
1012
if (!resultArray) return;
1013
1013
const end = Math.min(currentIndex + chunkSize, resultArray.length);
1014
1014
const chunk = Array.from(resultArray.slice(currentIndex, end));
1015
- output.textContent += (currentIndex === 0 ? "" : "\n") + chunk.join(', ');
1015
+ output.textContent += (currentIndex === 0 ? "" : "") + chunk.join(', ');
1016
+
1016
1017
currentIndex = end;
1017
1018
// Hide button if all data is shown
1018
1019
if (currentIndex >= resultArray.length) {
1019
- document.getElementById("showMoreBtn ").style.display = "none";
1020
+ document.getElementById("more ").style.display = "none";
1020
1021
}
1021
1022
}
1022
1023
1023
1024
async function main() {
1024
1025
const output = document.querySelector("#output");
1025
- const btn = document.getElementById("showMoreBtn ");
1026
+ const btn = document.getElementById("more ");
1026
1027
const chunkInput = document.getElementById("chunkInput");
1027
1028
chunkSize = parseInt(chunkInput.value, 10) || 256;
1028
1029
output.textContent = "Inferencing...";
@@ -1040,18 +1041,17 @@ async function main() {
1040
1041
}
1041
1042
}
1042
1043
1043
- document.getElementById("showMoreBtn ").addEventListener("click", showChunk);
1044
+ document.getElementById("more ").addEventListener("click", showChunk);
1044
1045
document.getElementById("chunkInput").addEventListener("change", function () {
1045
1046
chunkSize = parseInt(this.value, 10) || 256;
1046
1047
currentIndex = 0;
1047
1048
document.querySelector("#output").textContent = "";
1048
1049
showChunk();
1049
1050
if (resultArray && resultArray.length > chunkSize) {
1050
- document.getElementById("showMoreBtn ").style.display = "inline-block";
1051
+ document.getElementById("more ").style.display = "inline-block";
1051
1052
}
1052
1053
});
1053
- document.addEventListener("DOMContentLoaded", main, false);
1054
- `
1054
+ document.addEventListener("DOMContentLoaded", main, false);`
1055
1055
} ,
1056
1056
'/index.html' : {
1057
1057
code : `<!DOCTYPE html>
@@ -1069,7 +1069,7 @@ document.addEventListener("DOMContentLoaded", main, false);
1069
1069
<label for="chunkInput">Chunk size:</label>
1070
1070
<input type="number" id="chunkInput" value="512" min="1" style="width:80px;">
1071
1071
<div id="output"></div>
1072
- <button id="showMore " style="display:none;">Show next chunk</button>
1072
+ <button id="more " style="display:none;">Show next chunk</button>
1073
1073
<script src="./webnn.js"></script>
1074
1074
</body>
1075
1075
@@ -1081,16 +1081,21 @@ document.addEventListener("DOMContentLoaded", main, false);
1081
1081
}
1082
1082
1083
1083
h1 {
1084
- color: #E44D26;
1085
- font-size: 0.8rem;
1084
+ font-size: 1rem;
1085
+ }
1086
+
1087
+ label {
1088
+ font-size: 0.9rem;
1086
1089
}
1087
1090
1088
1091
button {
1089
1092
margin: 0.5rem 0;
1090
- padding: 0.5rem 1rem;
1093
+ padding: 0.2rem 1rem;
1091
1094
}
1092
1095
1093
1096
#output {
1097
+ color: #333;
1098
+ padding: 0.5rem 0;
1094
1099
font-size: 0.6rem;
1095
1100
}` }
1096
1101
} ,
0 commit comments