On-screen keyboard buttons

[Gardengul]

AnkiDroid 2.18.3 Memrise (Lτ) Preset […] v3.32

The on-screen keyboard buttons do not always work when pressed quickly.

https://github.com/Eltaurus-Lt/Anki-Card-Templates/assets/95347489/e7cbb1bf-f190-4d30-99d5-9c6166a08744

[Eltaurus-Lt]

I don't think there is anything to be done with the template here. It uses basic HTML buttons with onclick attributes, which work as fast as the underlying technology allows them. Any associated limitations are dictated by a phone and the web engine used.

[Eltaurus-Lt]

I've run some tests just to verify that button reaction time is not affected by anything done by the template. I stripped the template from everything redundant and arrived at the following code for the front of a card:

{{Front}}

<input id="typeans" type="text" inputmode="text">

<div class="membtn" onclick="typeKey('A')">A</div>
<div class="membtn" onclick="typeKey('B')">B</div>
<div class="membtn" onclick="typeKey('C')">C</div>

<script>
typeAns = document.getElementById('typeans');

function typeKey(keyContent) {
    setTimeout(()=>typeAns.value += keyContent,0);
}

</script>

You can replace the contents of the front side in Anki's Basic Note type, and, for convenience, add the following part to the styling tab:

.membtn {
    background: lightgray;
    padding: 2rem 3rem;
    width: min-content;
    margin: 1rem;
}

On my device, I didn't find any differences in performance between these minimal buttons and the original template. I would assume that the main factor is how touch input is processed by the web engine – when I control my phone with a mouse via dev tools both templates seem to react instantly).

Could you check the above example to see if it has the same reaction time on your device as well?