RN-Skia — use case (canvas, charts, blur, glassmorphism)?

@shopify/react-native-skia mang Skia engine (2D graphics của Google, dùng trong Chrome/Flutter) vào RN. Cho phép vẽ canvas-style với GPU acceleration.

Use case:

1. Custom canvas drawing: logo animated, signature pad, drawing app.

<Canvas style={{ flex: 1 }}>
  <Circle cx={100} cy={100} r={50} color="cyan" />
  <Path path="M 0 0 L 100 100" color="red" />
</Canvas>

2. Charts performance: Victory/D3 trong RN render qua SVG, lag với 1000+ data point. Skia render qua GPU, smooth với 10k+ point.

3. Blur backdrop / glassmorphism: built-in Blur filter, áp lên image hoặc layer trên — iOS-quality blur trên cả Android.

<Image image={img} fit="cover" />
<Blur blur={20} />

4. Image filters / shaders: color tint, ColorMatrix, BlendMode (multiply, overlay, etc), runtime SkSL shader (custom GLSL-style code).

5. Particle/animation phức tạp: kết hợp Reanimated shared value + Skia animated value → 60fps animation 1000+ particle.

Lợi:
- Performance ngang Flutter cho graphics nặng.
- Cross-platform pixel-perfect (giống Flutter).
- GPU-accelerated.

Nhược:
- Bundle size +~3MB.
- Learning curve: Skia API ≠ Canvas web ≠ React Native.
- Debugger limited (canvas content không tương tác bằng inspector).

Khi nào KHÔNG dùng:
- UI thường (button, list, form) — overhead không xứng.
- Animation đơn giản — Reanimated transform đủ.
- App size critical (banking app yêu cầu APK <30MB).