1
0
mirror of https://github.com/vlang/v.git synced 2023-08-10 21:13:21 +03:00
v/examples/js_dom_draw_bechmark_chart/chart/templates/controller/get/all/task.html
2022-09-07 01:55:32 +03:00

111 lines
3.2 KiB
HTML

<body class="main">
<style>
table,
th,
td {
border: 1px solid black;
}
</style>
<title>Is V orm still fast? ${v_version}</title>
<div style="display: flex; align-items: center">
<h2
style="
font-family: Menlo, Monospace, 'Courier New';
margin-left: 30px;
margin-top: 30px;
"
>
Is V orm still fast?
</h2>
<img src="./../../../../favicon.ico" height="35px" />
<h5 style="font-family: Menlo, Monospace, 'Courier New'; color: #3b7bbf">
${v_version}
</h5>
</div>
<div style="display: flex; flex-direction: row; flex-wrap: wrap">
@for orm_stmt_kind in orm_stmt_kinds
<!-- <div style="display: flex; flex-direction: column; "> -->
<div
style="
border-radius: 15px;
padding: 15px;
margin: 15px;
box-shadow: 0px 2px 10px 1px grey;
"
>
<div style="display: flex; flex-direction: column; max-width: 850px">
<h2 style="font-family: Arial, Helvetica, sans-serif">
${orm_stmt_kind} benchmark
</h2>
<div
style="
display: flex;
flex-direction: row;
justify-content: space-between;
"
>
<div
style="
display: flex;
flex-direction: column-reverse;
justify-content: space-between;
text-align: center;
width: 100%;
height: 480;
margin-right: 20px;
background-image: linear-gradient(red, yellow, green, #3b7bbf);
"
>
@for number in 0..11
<div style="font-family: Arial, Helvetica, sans-serif">
${int(number*(f64(max_benchmark[orm_stmt_kind])/10))} ns
</div>
@end
</div>
<canvas
id="canvas_${orm_stmt_kind}_id"
inserts_from_framework="@{from_framework[orm_stmt_kind]}"
max_benchmark="@{max_benchmark[orm_stmt_kind]}"
style="border: 1px solid grey"
width="720"
height="480"
></canvas>
</div>
<table style="margin-top: 10px">
<tr>
<th>Benchmark name</th>
<th>max.</th>
<th>10% max.</th>
<th>min.</th>
<th>10% min.</th>
</tr>
@for idx, name in attribute_names[orm_stmt_kind]
<tr style="font-family:arial; color: ${chart_colors[idx]};">
<td style="padding-right: 5px" id="benchmark_name" +idx>@name</td>
<td style="padding-left: 5px; padding-right: 5px">
@{table[orm_stmt_kind][name]["max."]}
</td>
<td style="padding-left: 5px; padding-right: 5px">
@{table[orm_stmt_kind][name]["10% max."]}
</td>
<td style="padding-left: 5px; padding-right: 5px">
@{table[orm_stmt_kind][name]["min."]}
</td>
<td style="padding-left: 5px; padding-right: 5px">
@{table[orm_stmt_kind][name]["10% min."]}
</td>
</tr>
@end
</table>
</div>
<!-- </div> -->
</div>
@end
</div>
<script type="text/javascript" src="draw.js"></script>
</body>