diff --git a/examples/crc32.html b/examples/crc32.html index d867f5b..949dadf 100644 --- a/examples/crc32.html +++ b/examples/crc32.html @@ -6,10 +6,84 @@

Buffer

-List - Source - WebAssembly - +List - Source - WebAssembly
+
+Note: This tests performs some timing comparison, please wait a few seconds for the results.
+

Measurement log

+

AMD Ryzen 7 3700X 8-Core, Ubuntu 20.04, Linux 5.4.0-124-generic

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TestInterpreterSetupWebAssemblyJavascript
Lynx * 65536Chromium 104.0.5112.101DevTools closed9.3512.56
Lynx * 65536Chromium 104.0.5112.101DevTools open14.7112.72
Lynx * 65536Chromium 104.0.5112.101Record page load9.4412.69
Lynx * 65536Firefox 103DevTools closed9.025.86
Lynx * 65536Firefox 103DevTools open9.015.83
Lynx * 65536Firefox 103Record page load72.415.85
Lynx * 1048576Chromium 104.0.5112.101DevTools closed149.24202.36
Lynx * 1048576Firefox 103DevTools closed145.0191.44
+ +Notes:
+- Firefox seems faster than Chromium in my setup for Javascript, WebAssembly seems about the same.
+- Having DevTools open in Chromium seems to slow down the WebAssembly by about 30%, but not when doing a recording of the page load.
+- WebAssembly in Firefox seems to slow down when doing a recording of the page load, which makes sense, but the Javascript does not.
diff --git a/examples/include.js b/examples/include.js index bd93dcf..50f9324 100644 --- a/examples/include.js +++ b/examples/include.js @@ -14,17 +14,33 @@ function alloc_bytes(app, data) return offset; } -function run_times(times, callback) +function run_times(times, callback, tweak) { let sum = 0; + let max = 0; + let min = 1000000000000000000; + let values = []; for(let idx = 0; idx < times; idx += 1) { + if( tweak ) { + tweak(); + } + const t0 = performance.now(); - callback(); + let result = callback(); const t1 = performance.now(); - sum += t1 - t0; + let time = t1 - t0; + sum += time; + values.push({'time': time, 'result': result}); + max = max < time ? time : max; + min = min > time ? time : min; + } + return { + 'min': min, + 'avg': sum / times, + 'max': max, + 'sum': sum, + 'values': values, } - console.log(sum); - return sum / times; } function test_result(is_pass, data) @@ -42,23 +58,41 @@ function test_result(is_pass, data) result_details.appendChild(result_summary); if( data.attributes ) { - let table = document.createElement('table'); - - Object.keys(data.attributes).forEach(idx => { - let td0 = document.createElement('td'); - td0.textContent = idx; - let td1 = document.createElement('td'); - td1.textContent = data.attributes[idx]; - - let tr = document.createElement('tr'); - tr.appendChild(td0); - tr.appendChild(td1); - - table.appendChild(tr); - }); - result_details.append(table); + result_table(data, result_details); } let results = document.getElementById('results'); results.appendChild(result_details); } + +function result_table(attributes, parent) +{ + let table = document.createElement('table'); + + Object.keys(attributes).forEach(idx => { + let td0 = document.createElement('td'); + td0.setAttribute('style', 'vertical-align: top;'); + td0.textContent = idx; + let td1 = document.createElement('td'); + if( typeof(attributes[idx]) == 'object' ) { + let result_details = document.createElement('details'); + + let result_summary = document.createElement('summary'); + result_summary.textContent = 'Show me'; + result_details.appendChild(result_summary); + + result_table(attributes[idx], result_details); + + td1.appendChild(result_details); + } else { + td1.textContent = attributes[idx]; + } + + let tr = document.createElement('tr'); + tr.appendChild(td0); + tr.appendChild(td1); + + table.appendChild(tr); + }); + parent.append(table); +}