KyberSwap ist eine dezentrale Trading-Plattform, über deren DEX-Aggregator bereits Transaktionen im Wert von mehr als 150 Mrd. US-Dollar für über 5 Mio. Nutzer abgewickelt wurden. Als das Team das Frontend auf Wagmi v3 und Viem umgestellt hat, ersetzte es den selbst entwickelten Code zur MetaMask-Erkennung durch den offiziellen metaMask()-Connector von MetaMask Connect. Diese Fallstudie zeigt, warum sich KyberSwap für diesen Schritt entschieden hat, was sich im mobilen Web verändert hat und wie die Connect-Integration neben KyberSwaps separater Rolle steht, MetaMask-Nutzern Swap-Kurse zu liefern.
KyberSwaps Aufgabe: der beste Kurs bei jedem Trade
Der DEX Aggregator von KyberSwap ist eine dezentrale Trading-Lösung, die für beste Kurse und zuverlässige Ausführung bei jedem Trade entwickelt wurde. Er läuft auf Smart Settlement, einem intelligenten Routing-Algorithmus, der den Output maximieren und Slippage minimieren soll, indem er tiefe Liquidität über mehrere Chains hinweg erschließt. Um diesen Kern herum gibt es Limit Orders, Crosschain-Swaps über 23 Netzwerke und Kyber Earn für Renditemöglichkeiten.
Eine Plattform, die auf Ausführungsqualität ausgelegt ist, stellt an ihren Eingang eine klare Anforderung: Eine Wallet zu verbinden sollte keinerlei Nachdenken erfordern.
Selbst entwickelter Wallet-Code ist eine Wartungsrechnung
KyberSwaps bisheriges Setup kombinierte Wagmi v2 mit ethers.js und einer Ad-hoc-Schicht für Injected-Connectors, einschließlich eigenem Code zur Erkennung von MetaMask und zur Verbindung damit. Im Zuge der Umstellung auf Wagmi v3 und Viem entschied sich das Team, diesen Code zugunsten des offiziellen Connectors von MetaMask Connect aufzugeben.
Drei Dinge gaben den Ausschlag. Ein einziger Connector deckt jetzt sowohl die Browser-Extension auf dem Desktop als auch den Deep-Link- und Relay-Flow im mobilen Web ab. Es muss weniger eigener Code zur Wallet-Erkennung gewartet werden. Und mit dem von MetaMask unterstützten Weg bleibt KyberSwap auf Kurs, während EIP-6963 und das MetaMask Wallet Protocol (MWP) zum Standard werden, über den Wallets und Dapps einander finden.
Vorher | Mit MetaMask Connect |
Wagmi v2, ethers.js und ein Ad-hoc-Setup für Injected-Connectors | Wagmi v3 und Viem mit dem offiziellen metaMask()-Connector |
Selbst entwickelter Code zur MetaMask-Erkennung und -Verbindung, der gewartet werden muss | Erkennung und Verbindung werden vom Connector übernommen |
Im mobilen Web wurde ein WalletConnect-QR-Code genutzt | Native Deep-Link-Verbindung zur MetaMask-App über das MWP-Relay |
Eigener Code, um Standards zur Wallet-Erkennung nachzuverfolgen | Ausrichtung an EIP-6963 und MWP über den von MetaMask unterstützten Weg |
Die mobile Übergabe richtig umsetzen
Im mobilen Web ist ein QR-Code ein umständlicher Weg: Die Nutzer sind ja bereits auf ihrem Smartphone. MetaMask Connect gibt KyberSwap einen Deep-Link-Verbindungsflow an die Hand, der die MetaMask-App über das MWP-Relay öffnet, sodass sich Trader auf dem Smartphone verbinden, ohne etwas scannen zu müssen.
KyberSwap hat besonders viel Aufwand in die Übergabe unter iOS gesteckt. Das Ziel: Nutzer landen direkt auf dem MetaMask-Bestätigungsbildschirm, ohne zusätzlichen Schritt zwischen dem Tippen auf „Verbinden“ und der Bestätigung. Das Ergebnis ist dasselbe Verbindungserlebnis, egal ob ein Trader über die Desktop-Extension oder die mobile App kommt.
Der Stack
Ebene | Komponenten |
Trading | KyberSwap DEX Aggregator, Smart Settlement, Limit Orders, Crosschain-Swaps (23 Netzwerke), Kyber Earn |
Frontend | Wagmi v3, Viem |
Wallet-Verbindung | MetaMask Connect (connect-evm), metaMask()-Connector |
Erkennung und Transport | EIP-6963, MetaMask Wallet Protocol Relay |
Wallet | MetaMask-Browser-Extension (Desktop), MetaMask-Mobile-App |
Bisherige Wirkung
Seit der Einführung von MetaMask Connect berichtet KyberSwap, dass die Verbindung für Nutzer zuverlässig funktioniert, der Rollout vom ersten Tag an reibungslos verlief und bislang keine Beschwerden oder Probleme gemeldet wurden.
Das Ergebnis für die Nutzer ist laut KyberSwap, dass sich Verbinden und Traden jetzt wie ein einziger Schritt anfühlen. Ein Trader verbindet sich über MetaMask und gelangt direkt zu einem Swap zum besten Kurs, ohne Umwege dazwischen. MetaMask Connect kümmert sich um den Eingang dieses Flows, Smart Settlement um den Rest.
Zwei Integrationen, eine Beziehung
Die Connect-Integration ist die eine Hälfte von KyberSwaps Beziehung zu MetaMask. Die andere Hälfte verläuft in die entgegengesetzte Richtung: Die KyberSwap Aggregator API liefert MetaMask-Nutzern Swap-Kurse und Ausführung über mehrere Chains hinweg. MetaMask Connect bringt MetaMask-Nutzer zu KyberSwap, und die Aggregator API bringt KyberSwaps Routing in MetaMask.
„MetaMask ist an zwei Fronten ein geschätzter Partner. MetaMask Connect hat vereinfacht, wie Trader sich mit KyberSwap verbinden, und bietet ihnen ein zuverlässiges, einheitliches Erlebnis – ob mit der Extension oder der mobilen App. Gleichzeitig liefert die KyberSwap Aggregator API MetaMask-Nutzern die besten verfügbaren Swap-Kurse und Ausführung über mehrere Chains hinweg. Es ist eine Partnerschaft, die auf dem Prinzip beruht, das uns am wichtigsten ist: DeFi-Trading für alle einfacher, reibungsloser und effizienter zu machen.“ — Ken Tran, Business Development Manager, KyberSwap
KyberSwaps Rat an Builder
Verlass dich auf die offizielle Dokumentation. So bleibt deine Integration am Standard ausgerichtet, und der Umstieg gelingt sauberer als mit älteren Beispielen oder individuellen Eigenlösungen.
Migriere die Wallet-Verbindung im Rahmen einer umfassenderen Stack-Bereinigung. KyberSwap hat seinen MetaMask-Code beim Umstieg auf Wagmi v3 und Viem ersetzt. Die Änderung des Connectors war also Teil einer geplanten Konsolidierung und kein eigenständiges Projekt.
Teste die mobile Übergabe von Anfang bis Ende. Für Nutzer:innen zählt vor allem, wo sie landen, nachdem sie auf „Verbinden“ getippt haben. KyberSwap hat geprüft, dass iOS-Nutzer:innen direkt auf dem MetaMask-Bestätigungsbildschirm ankommen.
Wäge es gegen deine eigene Architektur ab. Die Migration verlief für das Setup von KyberSwap reibungslos, aber der Stack jedes Teams ist anders, und die richtige Entscheidung hängt von den Anforderungen deines Produkts ab.
Entwickle mit MetaMask Connect: eine Integration, die für alle Nutzer:innen funktioniert, egal wie sie sich verbinden möchten.