ReactのuseEffectバグがランダムな触覚フィードバックを引き起こし、アプリのリテンション率を急落させた経緯

問題：ユーザーが報告したランダムな振動

ある開発者は4ヶ月間にわたり、アプリが「ランダムに振動する」または「理由もなく振動し続ける」という複数のユーザーからのメールを受け取りました。当初はユーザーの誤解として片付けられていましたが、これらの報告は正確なバグ報告であることが判明しました。この問題は重大な定着率の問題を引き起こしていました：カテゴリのベンチマークである35%と比較して、7日間の定着率は18%にまで低下しました。

デバッグの課題

このバグは再現が困難でした。なぜなら、触覚フィードバックはデバイスによって感じ方が異なるからです。Pixelのようなフラッグシップスマートフォンでは、モーターは精密で繊細ですが、Moto GシリーズやRedmi Noteのようなミッドレンジデバイスでは、モーターはより強力で目立ちます。開発者はテスト中に自分のPixelデバイスでは何も感じることができませんでした。

使用されたデバッグツール：

• Reactotron：再レンダリングを追跡し、問題のあるコンポーネントを特定するため
• BrowserStack：リモートデバイステスト用（ただし、触覚フィードバックはライブセッションを通じて転送されません）
• Drizz：実際の物理デバイス上でアプリを実行し、リアルタイムで発火する触覚トリガーとともに再レンダリング頻度を表示

根本原因

問題は、ReactのuseEffectフック内に触覚呼び出しがあったことです。依存配列には、メモ化される代わりに、すべてのレンダリングで再作成されるオブジェクト参照が含まれていました。これにより、常に再レンダリングされる画面で、すべての単一の再レンダリングが触覚フィードバックを発火させていました。

修正：オブジェクトをuseMemoでラップし、再レンダリングを減らして触覚ループを停止させました。

影響と回復

このバグは4ヶ月間、ユーザーに静かに影響を与えていました。問題を修正した後、7日間の定着率は18%から29%に、その後6週間で回復しました。

重要な洞察

Mixpanel、Amplitude、カスタムイベントトラッキングを設定していたにもかかわらず、最も正確なバグ報告はユーザーからのプレーンテキストのメールから得られました。開発者は次のように述べています：「スタックトレースはありません。デバイス情報もありません。再現手順もありません。ただ『あなたのアプリがランダムに振動する』というだけで、彼らは私の分析スタック全体が4ヶ月間で教えてくれたどんなことよりも正しかったのです。」