| 182 | |
| 183 | // 触摸优化 |
| 184 | setupTouchOptimization() { |
| 185 | // 防止双击缩放 |
| 186 | let lastTouchEnd = 0; |
| 187 | document.addEventListener('touchend', (event) => { |
| 188 | const now = (new Date()).getTime(); |
| 189 | if (now - lastTouchEnd <= 300) { |
| 190 | event.preventDefault(); |
| 191 | } |
| 192 | lastTouchEnd = now; |
| 193 | }, false); |
| 194 | |
| 195 | // 优化触摸反馈(使用CSS变量避免高频classList操作) |
| 196 | document.addEventListener('touchstart', (e) => { |
| 197 | const target = e.target.closest('.btn, .card, .form-control'); |
| 198 | if (target) { |
| 199 | target.style.setProperty('--touch-active', '1'); |
| 200 | target.classList.add('touch-active'); |
| 201 | } |
| 202 | }, { passive: true }); |
| 203 | |
| 204 | document.addEventListener('touchend', (e) => { |
| 205 | const target = e.target.closest('.btn, .card, .form-control'); |
| 206 | if (target) { |
| 207 | // 使用requestAnimationFrame替代setTimeout,更高效 |
| 208 | requestAnimationFrame(() => { |
| 209 | target.style.removeProperty('--touch-active'); |
| 210 | target.classList.remove('touch-active'); |
| 211 | }); |
| 212 | } |
| 213 | }, { passive: true }); |
| 214 | } |
| 215 | |
| 216 | // 页面可见性处理(暂停/恢复滚动效果) |
| 217 | setupVisibilityHandler() { |