Aller au contenu

Un connecteur pour chaque façon dont un trader arrive

Sur le web mobile, les traders KyberSwap se connectent via un deep link qui ouvre l'app MetaMask plutôt qu'un QR code, et les utilisateurs iOS arrivent directement sur l'écran d'approbation.

5 min
Un connecteur pour chaque façon dont un trader arrive

KyberSwap est une plateforme de trading décentralisée dont l'agrégateur DEX a facilité plus de 150 Md$ US de transactions pour plus de 5 millions d'utilisateurs. Lorsque son équipe a consolidé le frontend sur Wagmi v3 et Viem, elle a remplacé son code de détection de MetaMask développé sur mesure par le connecteur officiel metaMask() de MetaMask Connect. Cette étude de cas explique pourquoi KyberSwap a fait ce choix, ce qui a changé sur le web mobile, et comment l'intégration de Connect s'articule avec le rôle distinct de KyberSwap, qui fournit des taux de swap aux utilisateurs de MetaMask.

La mission de KyberSwap : le meilleur taux sur chaque trade

Le DEX Aggregator de KyberSwap est une solution de trading décentralisée conçue pour offrir les meilleurs taux et une exécution fiable sur chaque trade. Il repose sur Smart Settlement, un algorithme de routage intelligent conçu pour maximiser le montant reçu et minimiser le slippage en accédant à une liquidité profonde sur plusieurs chaînes. Autour de ce cœur, on trouve les ordres limites, les swaps crosschain sur 23 réseaux et Kyber Earn pour les opportunités de rendement.

Une plateforme centrée sur la qualité d'exécution a une exigence simple pour sa porte d'entrée : connecter un wallet ne devrait demander aucun effort de réflexion.

Le code de wallet développé sur mesure, une facture de maintenance

L'ancienne configuration de KyberSwap combinait Wagmi v2, ethers.js et une couche de connecteur injecté ad hoc, avec du code personnalisé pour détecter MetaMask et s'y connecter. En passant à Wagmi v3 et Viem, l'équipe a choisi d'abandonner ce code au profit du connecteur officiel de MetaMask Connect.

Trois éléments ont motivé cette décision. Un seul connecteur couvre désormais à la fois l'extension de navigateur sur desktop et le flux de deep link et de relais sur le web mobile. Il y a moins de code de détection de wallet personnalisé à maintenir. Et rester sur la voie prise en charge par MetaMask permet à KyberSwap de rester aligné à mesure que l'EIP-6963 et le MetaMask Wallet Protocol (MWP) deviennent la référence pour que les wallets et les dapps se découvrent mutuellement.

Avant

Avec MetaMask Connect

Wagmi v2, ethers.js et une configuration de connecteur injecté ad hoc

Wagmi v3 et Viem avec le connecteur officiel metaMask()

Code de détection et de connexion à MetaMask développé sur mesure, à maintenir

Détection et connexion gérées par le connecteur

Le web mobile reposait sur un QR code WalletConnect

Connexion native par deep link à l'application MetaMask via le relais MWP

Code personnalisé pour suivre les standards de découverte de wallets

Alignement avec l'EIP-6963 et le MWP grâce à la voie prise en charge par MetaMask

Réussir la transition vers le mobile

Sur le web mobile, le QR code n'est pas pratique : l'utilisateur est déjà sur son téléphone. MetaMask Connect offre à KyberSwap un flux de connexion par deep link qui ouvre l'application MetaMask via le relais MWP, ce qui permet à un trader sur mobile de se connecter sans rien scanner.

KyberSwap a porté une attention particulière à la transition sur iOS. L'objectif était que les utilisateurs arrivent directement sur l'écran d'approbation de MetaMask, sans étape supplémentaire entre le moment où ils appuient sur « Connecter » et celui où ils approuvent. Résultat : l'expérience de connexion est la même, que le trader arrive depuis l'extension desktop ou l'application mobile.

La stack

Couche

Composants

Trading

KyberSwap DEX Aggregator, Smart Settlement, ordres limites, swaps crosschain (23 réseaux), Kyber Earn

Frontend

Wagmi v3, Viem

Connexion du wallet

MetaMask Connect (connect-evm), connecteur metaMask()

Découverte et transport

EIP-6963, relais MetaMask Wallet Protocol

Wallet

Extension de navigateur MetaMask (desktop), application mobile MetaMask

Impact à ce jour

Depuis l'adoption de MetaMask Connect, KyberSwap indique que la connexion est fiable pour les utilisateurs, que le déploiement s'est déroulé sans accroc dès le premier jour et qu'aucune plainte ni aucun problème n'a été signalé.

Selon KyberSwap, le résultat côté utilisateur est que se connecter et trader ne forment plus qu'une seule étape. Un trader se connecte via MetaMask et passe directement à un swap au meilleur taux, sans rien entre les deux. MetaMask Connect gère la porte d'entrée de ce parcours, et Smart Settlement s'occupe du reste.

Deux intégrations, une seule relation

L'intégration de Connect n'est que la moitié de la relation entre KyberSwap et MetaMask. L'autre moitié va dans le sens inverse : l'API KyberSwap Aggregator fournit aux utilisateurs de MetaMask des taux de swap et une exécution sur plusieurs chaînes. MetaMask Connect amène les utilisateurs de MetaMask vers KyberSwap, et l'API Aggregator amène le routage de KyberSwap dans MetaMask.

« MetaMask est un partenaire précieux sur deux fronts. MetaMask Connect a simplifié la façon dont les traders se connectent à KyberSwap, en leur offrant une expérience fiable et cohérente, qu'ils utilisent l'extension ou l'application mobile. En parallèle, l'API KyberSwap Aggregator offre aux utilisateurs de MetaMask les meilleurs taux de swap disponibles et une exécution optimale sur plusieurs chaînes. C'est un partenariat fondé sur le principe qui nous tient le plus à cœur : rendre le trading DeFi plus simple, plus fluide et plus efficace pour tous. » — Ken Tran, Business Development Manager, KyberSwap

Les conseils de KyberSwap aux builders

Appuyez-vous sur la documentation officielle. Elle garantit que votre intégration reste conforme au standard et rend la transition plus fluide que si vous partiez d'anciens exemples ou d'un câblage personnalisé.

Intégrez la migration de la connexion au wallet dans un nettoyage plus large de votre stack. KyberSwap a remplacé son code MetaMask en passant à Wagmi v3 et Viem : le changement de connecteur n'était donc qu'un volet d'une consolidation planifiée, et non un projet à part.

Testez le passage au mobile de bout en bout. Ce qui compte pour les utilisateurs, c'est l'endroit où ils arrivent après avoir appuyé sur « Connecter ». KyberSwap a vérifié que les utilisateurs iOS accèdent directement à l'écran d'approbation de MetaMask.

Confrontez-la à votre propre architecture. La migration s'est bien déroulée avec la configuration de KyberSwap, mais la stack de chaque équipe est différente, et la bonne décision dépend des besoins de votre produit.

Développez avec MetaMask Connect : une seule intégration qui fonctionne pour tous les utilisateurs, quelle que soit leur façon de se connecter.

Traduit par IA. Peut contenir des erreurs. Veuillez toujours vérifier les informations.

Évaluer la traduction

Cet article a été rédigé par :

  • MetaMask

    MetaMask, anciennement Consensys Software Inc, est la plus grande plateforme financière self-custodial au monde, offrant aux utilisateurs un espace unique pour détenir, dépenser, épargner et faire fructifier leur argent, aussi bien en crypto qu'en actifs traditionnels. La société développe la plateforme grand public au sein de laquelle tout cela se concrétise, en réunissant paiements, épargne, investissement et actifs numériques dans une expérience fluide et unifiée. Issu du wallet self-custodial le plus utilisé au monde, MetaMask donne aux utilisateurs un contrôle direct sur leur argent et leurs actifs, avec une présence dans environ 190 pays. MetaMask joue un rôle fondateur dans la croissance d'Ethereum depuis 2016. Aujourd'hui, MetaMask occupe une place centrale dans l'économie blockchain, en construisant le système d'exploitation de l'Open Money et en donnant aux individus un contrôle total sur leur vie financière.

    Lire tous les articles