In der Implementierung der TouchEvents von Chrome mit Stand M37 (stabil ab 08/2014) wurde eine Änderung vorgenommen. Dadurch werden die gemeldeten Koordinaten in Gleitkommazahlen statt in Ganzzahlen geändert.
| Vorher | Nachher |
|---|---|
|
clientX: 167 clientY: 196 SeiteX: 167 SeiteY: 196 radiusX: 26 radiusY: 26 displayX: 167 displayY: 277 |
clientX: 167.33299255371094 clientY: 195.66700744628906 pageX: 167.33299255371094 pageY: 195.667007446289606 195X360.195 195.6700744628906 |
Das Ergebnis dieser Änderung sorgt für eine flüssigere Reaktion auf Gesten des Nutzers, da die Fingerposition genauer ist.
Anhand der Demo von Rick Byers können Sie sehen, welchen großen Unterschied dies machen kann, wenn Sie langsam eine 3D-Animation ziehen.
Dies wirkt sich nur auf Bildschirme mit einer Pixeldichte größer als 1 aus. Sehen wir uns ein Beispiel an, um den Grund zu verstehen.
Angenommen, Sie haben ein 3x3-Raster aus CSS-Pixeln und eine Bildschirmdichte von 3. Wir haben also ein Raster mit 9:9 physischen Pixeln und der Nutzer Gesten von oben links nach unten rechts.
Ursprünglich haben wir die Berührungsposition auf das nächste CSS-Pixel gerundet. Das bedeutete, dass in dieser Geste die folgenden Schritte nötig waren.
Zwischenschritte, die beim Bewegen des Fingers auf den physischen Pixeln zu sehen sein könnten, werden nicht erfasst.
Jetzt, wo wir zu Gleitkommazahlen gewechselt haben, kann unsere Geste wie folgt aussehen.
In den meisten Fällen sind dafür keine Änderungen an Ihrem Code erforderlich. Animationen oder Bewegungen, die Sie als Ergebnis von TouchEvents ausführen, laufen jedoch reibungsloser ab, insbesondere bei langsamen Touch-Gesten.
Es ist auch geplant, diese Verbesserung auch in Safari für Mobilgeräte einzuführen: https://bugs.webkit.org/show_bug.cgi?id=133180.