Vous ne pouvez pas lire les journaux sur le téléphone de quelqu’un d’autre.

Six façons de casser sans que rien ne lève d’exception

Aucune de ces situations ne lève d’erreur, ne fait échouer une requête, ni ne déplace assez un temps de réponse pour déclencher une alerte. C’est ce que voient vos utilisateurs. Choisissez-en une.

Ce qu’il mesure

Chaque requête que fait l’application

Combien de temps elle a pris, ce qui est revenu, quelle taille cela faisait et combien de lignes cela portait — instrumenté au niveau de XHR, là où `fetch` et tout client HTTP au-dessus finissent.

Les plantages, à part des erreurs

Une exception non attrapée sur un serveur perd une requête. Sur un téléphone elle ferme l’application pendant que quelqu’un la tient. Ce ne sont pas des degrés d’une même mesure, ils ne sont donc pas moyennés ensemble — et `app_starts` est enregistré comme dénominateur, parce que « quatorze plantages » n’est pas un chiffre sur lequel qui que ce soit puisse agir.

Requêtes par écran, et appels par rendu

Le plugin Babel fait des composants des spans parents, ce qui transforme « dix-sept requêtes » en « cet écran fait dix-sept requêtes, et en faisait trois à la version précédente ».

Sur quel écran chaque chose s’est produite

Un traqueur de navigation nomme l’écran courant, donc un constat dit où et pas seulement quoi. React Navigation se branche avec deux props.

Des fenêtres qui survivent à la session

Passer en arrière-plan est la façon dont se terminent la plupart des sessions mobiles, et rien sur iOS ni Android ne terminera une requête pour une application qui ne tourne plus. Les fenêtres sont écrites dans le stockage avant d’être envoyées et effacées seulement sur un 2xx confirmé, donc la dernière avant que quelqu’un range son téléphone arrive au lancement suivant — sous la version qui l’a produite, pas celle installée maintenant.

Ce qu’il trouve

Chacune de ces choses est comparée à la version précédente : le constat nomme donc le changement plutôt que le jour.

Comment ça s’installe

Trois lignes, et un plugin Babel qui en fait une de plus. Metro, c’est Babel, donc la même transformation qu’utilise l’agent Node fonctionne ici sans changement — c’est elle qui apporte les requêtes par écran et le signal de boucle de rendu, et les règles statiques viennent avec.

npm install @sixty-sh/react-native

// index.js — before anything else
import { init, composeRelease } from '@sixty-sh/react-native'

init({
  key: 'sixty_pk_…',
  service: 'my-app',
  // A native version alone reports every OTA bundle you push as the
  // same release, which is the one thing a comparison cannot survive.
  release: composeRelease({ version: '1.4.2', otaUpdateId }),
})

// babel.config.js
module.exports = { plugins: ['@sixty-sh/react-native/babel'] }

Installez aussi @react-native-async-storage/async-storage et la file de sortie durable fonctionne toute seule — sans lui l’agent tourne toujours et perd les fenêtres qui étaient dues quand l’application est passée en arrière-plan. Pour les noms d’écran, passez les deux gestionnaires du traqueur de navigation à votre NavigationContainer.

Ce qu’il ne fait pas

• Pas de temps de lancement, pas d’images perdues, pas de saccades. C’est l’équivalent mobile des web vitals et cela ne peut pas être mesuré depuis JavaScript — il faut un module natif lisant CADisplayLink ou MetricKit sur iOS et JankStats sur Android. Mesurer la fréquence d’images depuis le thread JS remonterait l’opinion du thread JS à ce sujet, c’est-à-dire précisément le chiffre qui est faux quand l’application saccade.
• Les plantages natifs sont absents. Un mauvais pointeur dans un module natif n’atteint jamais JavaScript, donc ce qui est compté ici est une erreur *JavaScript* fatale.
• Les builds de production groupent bien et localisent mal. Hermes compile le bundle en bytecode, donc une image de pile arrive comme un décalage dans index.android.bundle plutôt que comme un fichier de votre dépôt. Cela reste une identité stable pour un bug — la propriété qui compte le plus — mais cela ne pointera pas vers une ligne de votre code tant que l’envoi de sourcemaps n’existera pas. Un build de développement a de vrais chemins.
• La comparaison entre versions n’est pas par cohortes, et c’est ici le plus gros point ouvert. Un déploiement serveur remplace ce qui tournait ; une version mobile non. Elle se déploie sur plusieurs jours, les anciennes versions tournent indéfiniment, et les utilisateurs qui mettent à jour en premier ont plutôt des appareils plus récents et de meilleures connexions — donc A contre B est en partie une comparaison contre une population qui se déplace.
• Il n’y a pas de proxy, donc pas de confidentialité d’IP structurelle. Le meilleur mode de l’agent navigateur ne détient aucune information d’identification et poste vers votre propre origine, ce qui fait qu’aucune requête d’un visiteur n’atteint jamais le collecteur. Une application n’a pas d’origine à elle, donc cet arrangement est simplement indisponible et cet agent porte une clé publique. Si vous exploitez déjà une API, pointez `endpoint` dessus et relayez depuis là, et la propriété est exactement restaurée.

Si vous êtes ici pour l’une de ces raisons