Comment JoyCheck lit ta manette

JoyCheck est un testeur de manette basé sur le navigateur qui lit ta manette via la W3C Gamepad API, sans installation et sans que rien ne soit envoyé à un serveur.

6 types d’entrées · 4 sections · 10 min de lecture

JoyCheck lit ta manette avec la W3C Gamepad API[1], une interface native au navigateur qui expose chaque bouton, chaque axe analogique et chaque gâchette sous forme de valeurs numériques mises à jour 60 fois par seconde. Le navigateur gère la poignée de main USB ou Bluetooth ; JoyCheck interroge navigator.getGamepads() à chaque frame d’animation et affiche l’état en direct sans envoyer de données à aucun serveur.

Mis à jour le 2026-05-27 par Taimoor Bamazai, fondateur d’Elites Algorithm Limited (une société de technologie enregistrée à Dublin, en Irlande) et l’ingénieur derrière JoyCheck.

Le flux de données en direct a trois propriétés qui méritent d’être nommées :

• Natif au navigateur. W3C Gamepad API standard. Aucun binaire natif, aucune installation de pilote. Fonctionne dans tous les navigateurs Chromium modernes, Firefox et Safari 16+.
• Interrogation à 60 jusqu’à 144 Hz. JoyCheck lit navigator.getGamepads() à chaque frame d’animation, au même rythme que le navigateur redessine l’écran, en phase avec le Hz de ton affichage.
• Zéro donnée envoyée. Chaque entrée est traitée dans le processus de ton navigateur. Aucun XHR, aucun fetch, aucune analytique sur le widget. Vérifiable dans DevTools.

Que veut dire « lire » une manette de jeu ?

JoyCheck lit six classes d’entrée depuis ta manette, et chacune correspond à un champ précis de la Gamepad API.

• Boutons (gamepad.buttons[]). Chaque bouton est un objet GamepadButton qui signale son état pressé et, là où c’est pris en charge, une valeur analogique.
• Joysticks analogiques (gamepad.axes[0..3]). Le tableau axes est un tableau de flottants à plat. Sous le mapping standard du W3C, il contient les positions X/Y des joysticks gauche et droit.
• Gâchettes (gamepad.buttons[6,7].value). Les gâchettes vivent dans le tableau buttons et sont traitées comme des boutons dotés d’une valeur analogique sous le mapping standard.
• Pavé tactile (gamepad.touchEvents[]). Le DualShock 4 et la DualSense exposent les coordonnées du pavé tactile comme une extension de la Gamepad API. La résolution rapportée du pavé est d’environ 1920×1080, et jusqu’à deux points de contact simultanés sont suivis.
• Gyroscope et IMU (gamepad.imu, proposé). La DualSense, les Joy-Con et le Switch Pro exposent tous des données IMU à six axes.
• Vibration (gamepad.vibrationActuator.playEffect()). L’interface vibrationActuator sur un objet Gamepad expose une méthode playEffect() qui prend une durée et une intensité pour chaque moteur, sur les manettes standards qui signalent des actionneurs haptiques.

Comment la W3C Gamepad API fonctionne-t-elle réellement ?

La Gamepad API est une interface de navigateur standard du W3C qui expose les manettes de jeu connectées à JavaScript. Elle est présente dans tous les navigateurs modernes depuis Chrome 21 (2012), Firefox 29 (2014), Edge 12 (2015) et Safari 14.1 (2021), voir Can I Use pour la matrice de prise en charge actuelle.[2]

Le navigateur gère la poignée de main USB ou Bluetooth HID sous-jacente. Ton système d’exploitation associe la manette ; le navigateur la voit via les couches de pilotes au niveau du système (XInput sous Windows, IOHIDDevice sous macOS, evdev sous Linux) ; la page appelle navigator.getGamepads() et reçoit un tableau instantané d’objets Gamepad.

Chaque objet Gamepad expose un ensemble de champs :

• id : un identifiant sous forme de chaîne (par ex. “DualSense Wireless Controller (STANDARD GAMEPAD Vendor: 054c Product: 0ce6)”)
• axes[] : un tableau de flottants des positions des axes analogiques (joysticks, généralement quatre entrées : X/Y gauche + X/Y droit)
• buttons[] : un tableau d’objets GamepadButton, chacun avec les propriétés pressed, value et touched
• timestamp : heure de la dernière mise à jour en millisecondes
• mapping : “standard” si la manette correspond à la disposition standard du gamepad W3C ; "" sinon
• vibrationActuator : une interface de retour haptique (là où c’est pris en charge)

L’API exige un geste de l’utilisateur (un appui sur un bouton) avant d’exposer les manettes connectées. C’est l’exigence du geste : une fonctionnalité de confidentialité qui empêche les pages de faire du fingerprinting de ta manette en arrière-plan. JoyCheck affiche « Appuie sur un bouton pour commencer » jusqu’à ce que le geste se déclenche.

Pourquoi JoyCheck interroge au lieu de s’abonner à des événements

La Gamepad API est uniquement en interrogation dans la spécification. Il n’y a pas d’événement onbuttonpress auquel s’abonner : ton code demande navigator.getGamepads() et obtient un instantané de l’état courant. JoyCheck interroge avec requestAnimationFrame[5], qui déclenche le callback à la fréquence de rafraîchissement de l’écran du navigateur (généralement 60 Hz, jusqu’à 240 Hz sur les écrans à haute fréquence).

Interroger à la fréquence de rafraîchissement est la bonne cadence parce que :

• Le système d’exploitation met à jour l’état de la manette à peu près à ce rythme (l’USB HID interroge à 1 kHz ; le navigateur sous-échantillonne)
• Le rendu se fait à la fréquence de rafraîchissement, donc toute interrogation supplémentaire produirait des frames dupliqués sans différence visuelle
• Cela maintient l’usage du CPU au minimum : le callback d’interrogation est un seul appel de fonction par frame

Interroger plus vite (via setInterval ou setTimeout) gaspille le CPU et produit des instantanés dupliqués. Interroger plus lentement (par ex. à 30 Hz) rate les appuis de boutons rapides sur les écrans à haute fréquence. requestAnimationFrame correspond à l’affichage, qui correspond à ce que tu vois réellement.

Pourquoi JoyCheck est-il zéro donnée et comment puis-je le vérifier ?

Nous le disons trois fois parce que c’est important :

1. JoyCheck ne transmet aucune donnée de manette à aucun serveur, jamais.

2. La Gamepad API s’exécute entièrement à l’intérieur du processus de ton navigateur. L’état de la manette ne quitte jamais la page.

3. Affiche la source du widget : chaque appel à l’API se résout en un callback requestAnimationFrame qui met à jour uniquement des nœuds du DOM. Il n’y a pas d’appels fetch(), pas de XMLHttpRequest, pas de WebSocket qui transportent l’état de la manette.

Tu peux le vérifier toi-même en moins d’une minute : ouvre JoyCheck dans n’importe quel navigateur, ouvre DevTools (F12), clique sur l’onglet Réseau, efface le journal et fais fonctionner le widget pendant 30 secondes. L’onglet Réseau reste vide pour les requêtes d’état de la manette. Déclaration complète sur la page de confidentialité.

Pourquoi utiliser un testeur de navigateur plutôt qu’une application de bureau ?

Trois raisons :

Aucune friction d’installation. La Gamepad API est désormais assez fiable pour que demander aux utilisateurs de télécharger et d’exécuter un binaire soit une taxe inutile. Un chargement de page est plus rapide qu’un installateur ; un navigateur est plus universel qu’une distribution .exe réservée à Windows.

Multiplateforme sans surcoût. La même page fonctionne sur Windows, macOS, Linux et ChromeOS sans builds par plateforme. Un testeur de navigateur ne se livre qu’une fois.

Auditable en 30 secondes. L’activité réseau et le stockage d’une page web sont inspectables avec les DevTools du navigateur par n’importe quel utilisateur, à tout moment. L’activité réseau d’une application de bureau nécessite tcpdump, Wireshark ou lsof et des permissions root. L’histoire de l’audit compte.

« Après des années de travail de diagnostic matériel sur des périphériques PC et des manettes de jeu, les testeurs basés sur le navigateur ont détecté environ les deux tiers des défauts qu’un utilitaire de diagnostic de bureau n’aurait jamais fait apparaître. Le navigateur lit ce que la manette signale physiquement, ce qui est une couche de vérité différente de ce que n’importe quel pilote basé sur un installateur expose. »

Taimoor Bamazai, fondateur, Elites Algorithm Limited

Quelles sont les limites connues de JoyCheck ?

Liste honnête, ce que JoyCheck ne fait pas :

• Aucun accès HID brut. Lire le descripteur USB HID brut nécessiterait WebHID, une spécification W3C distincte à la prise en charge moins cohérente selon les navigateurs (Chrome et Edge uniquement, aujourd’hui).

• Manettes antérieures à la Gamepad API. Les manettes DirectInput uniquement, d’avant l’existence de XInput, n’apparaissent pas dans le navigateur. Elles auraient besoin de WebHID plus une couche de traduction.

• La prise en charge de la vibration varie selon le navigateur. Firefox est à la traîne de Chrome sur vibrationActuator ; Safari a une prise en charge limitée. JoyCheck signale la limitation avec élégance.

• La pression des gâchettes sur les manettes Xbox dépend de la couche pilote. Certains appairages Bluetooth signalent des gâchettes binaires (juste on/off, sans plage analogique). Une connexion USB filaire corrige généralement cela.

Pour les chemins de diagnostic spécifiques à une plateforme au-delà de ce que le navigateur peut voir, le guide dédié couvre les schémas de défaut qui nécessitent une intervention côté matériel.

Pour des guides de diagnostic spécifiques à une manette qui utilisent cette même couche de lecture basée sur le navigateur, le guide d’appairage de la manette Switch Pro, le guide de calibration de la DualSense et le guide de calibration de la manette PS4 couvrent les particularités d’appairage propres à chaque plateforme que la Gamepad API seule ne peut pas résoudre.

Observations sur le taux d’interrogation de JoyCheck (mesuré en 2026-05)

Les navigateurs plafonnent la lecture de la Gamepad API à la cadence de requestAnimationFrame. Dans notre analyse, nous avons mesuré les mêmes manettes dans des conditions d’affichage identiques. Toutes les lectures : session Chrome 120 fraîche, connexion USB sauf indication contraire, fenêtre glissante de 5 secondes.

Mesuré par l’échantillonneur intégré au navigateur de JoyCheck. Les écrans 144 Hz relèvent le plafond proportionnellement ; les lectures sont normalisées sur une base de 60 Hz pour une comparaison inter-navigateurs.