Обо мне
Опыт
React Engineer
某公司 - - Сейчас
职位: React Engineer | 经验: 1 year | 项目: ## Web3 Multi-Chain Asset Management Dashboard\n\nTech Stack:Vue 3 · TypeScript · Vite · wagmi · ethers.js · MetaMask / WalletConnect · Ethereum\n\n### Project Overview\n\nA Web3 frontend application designed for general users, supporting wallet connection, multi-chain switching, on-chain asset reading, and transaction execution.\nThe project focuses on addressing **transaction uncertainty on-chain** and **improving overall user experience** in decentralized applications.\n\n---\n\n## Wallet \u0026 State Management\n\n* Built a wallet connection system based on **wagmi**, supporting **MetaMask** and **WalletConnect**\n* Handled wallet connection lifecycle events, including connect, disconnect, network switching, and account changes\n* Encapsulated global Web3 state (**address / chainId / provider**) for reuse across business components\n\n---\n\n## Contract Interaction \u0026 Transaction Lifecycle\n\n* Interacted with smart contracts using **ethers.js**, clearly separating:\n\n * `call` (read-only operations)\n * `sendTransaction` (state-changing transactions)\n* Implemented full transaction lifecycle UI feedback:\n\n * `pending` / `success` / `failed`\n* Classified and handled common transaction failure scenarios:\n\n * Insufficient gas\n * User rejection\n * Contract revert\n with clear and user-friendly error messages\n\n---\n\n## Authorization \u0026 Security Awareness\n\n* Implemented standard **ERC20 approval flow** (`approve → transferFrom`) to prevent redundant approvals\n* Added secondary confirmations and approval amount warnings for high-risk operations\n* Improved user awareness of authorization risks to reduce accidental asset loss\n\n---\n\n## Multi-Chain \u0026 Network Handling\n\n* Supported **Ethereum** and **Polygon** networks\n* Detected network mismatches and guided users to switch networks automatically\n* Adapted to different chains’ **RPC endpoints, Chain IDs, and gas strategies**\n\n\n## User Experience \u0026 Performance Optimization\n\n* Introduced **loading states, skeleton screens, and optimistic UI** to mitigate on-chain latency\n* Reduced frequent on-chain read requests through **caching and debouncing**\n* Enhanced usability and responsiveness under high-latency or unstable network conditions
