# GPU 加速管理使用指南

## 概述

`ArgonRenderOptimizer` 提供 GPU 加速管理功能，包括启用/禁用 GPU 加速、限制动画数量（最多 3 个）、自动管理动画队列。

## 核心方法

### startAnimation(element, animationFn)
启动动画，自动管理 GPU 加速和队列。

```javascript
const optimizer = new ArgonRenderOptimizer();
const element = document.querySelector('.box');

optimizer.startAnimation(element, (el) => {
	el.style.transform = 'translateY(-50px)';
	el.style.transition = 'transform 0.5s ease';
	
	setTimeout(() => {
		el.style.transform = '';
		optimizer.endAnimation(el);
	}, 500);
});
```

### endAnimation(element)
结束动画，自动禁用 GPU 加速并启动队列中的下一个动画。

```javascript
optimizer.endAnimation(element);
```

## 最佳实践

1. **始终调用 endAnimation()** - 确保资源释放
2. **监听动画完成事件** - 使用 animationend/transitionend
3. **页面卸载时清理** - 调用 clearAllAnimations()

## 性能建议

- 仅对需要动画的元素启用 GPU 加速
- 利用系统自动管理的动画队列
- 避免同时运行超过 3 个动画

## 验证需求

- ✅ 需求 5.2: 使用 will-change 创建合成层
- ✅ 需求 5.3: 动画完成时移除 will-change
- ✅ 需求 5.5: 限制同时运行动画数量不超过 3 个