新增玻璃碎片三角形效果，优化动态背景动画逻辑，减少内存分配与GC开销，增强交互表现力与动画流畅度。

Author: ForteScarlet

composeApp/src/wasmJsMain/kotlin/love/forte/simbot/codegen/components/OptimizedAnimatedBackground.kt

@@ -9,6 +9,7 @@ import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.Path
 import androidx.compose.ui.graphics.drawscope.DrawScope
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.dp
@@ -28,10 +29,36 @@ private class MutableParticle(
     val alpha: Float
 )
 
+/**
+ * Performance-optimized connection representation using value class.
+ * Packs two integers into a single Long to avoid object allocation overhead
+ * compared to Pair<Int, Int>. This reduces GC pressure in the animation loop
+ * where connections are created frequently for triangle detection.
+ */
+@Immutable
+@Stable
+private value class Connection(private val value: Long) {
+    constructor(first: Int, second: Int) : this((first.toLong() shl 32) or (second.toLong() and 0xFFFFFFFF))
+
+    @Stable
+    inline val first: Int get() = (value shr 32).toInt()
+
+    @Stable
+    inline val second: Int get() = value.toInt()
+
+    @Stable
+    @Suppress("NOTHING_TO_INLINE")
+    inline operator fun component1(): Int = first
+
+    @Stable
+    @Suppress("NOTHING_TO_INLINE")
+    inline operator fun component2(): Int = second
+}
+
 /**
  * Ultra-optimized animated background with theme-aware performance scaling:
  * 1. Eliminated O(n²) algorithm with distance culling
- * 2. Replaced expensive sqrt() with squared distance comparisons  
+ * 2. Replaced expensive sqrt() with squared distance comparisons
  * 3. Fixed excessive recomposition issues
  * 4. Used mutable particles to reduce object allocation
  * 5. Cached color objects to reduce GC pressure
@@ -49,7 +76,7 @@ fun OptimizedAnimatedBackground(
 ) {
     val density = LocalDensity.current
     val colorScheme = MaterialTheme.colorScheme
-    
+
     // Theme-aware performance scaling - reduce animation during theme transitions
     val performanceScale = remember(themeEffects?.isTransitioning) {
         if (themeEffects?.isTransitioning == true) 0.3f else 1f // 70% reduction during transitions
@@ -64,14 +91,15 @@ fun OptimizedAnimatedBackground(
     // Mutable particles list for better performance
     val particles = remember { mutableListOf<MutableParticle>() }
     var canvasSize by remember { mutableStateOf(Offset.Zero) }
-    
+
     // Theme-aware cached colors with sci-fi glow effects
     val cachedColors = remember(colorScheme, themeEffects?.glowIntensity) {
         val glowIntensity = themeEffects?.glowIntensity ?: 0f
         ParticleColors(
             particleColor = colorScheme.primary.copy(alpha = 0.65f + glowIntensity * 0.2f),
             connectionColor = colorScheme.secondary.copy(alpha = 0.4f + glowIntensity * 0.15f),
-            mouseConnectionColor = colorScheme.secondary.copy(alpha = 0.48f + glowIntensity * 0.25f)
+            mouseConnectionColor = colorScheme.secondary.copy(alpha = 0.48f + glowIntensity * 0.25f),
+            triangleFillColor = colorScheme.secondary.copy(alpha = 0.08f + glowIntensity * 0.03f)
         )
     }
 
@@ -91,15 +119,15 @@ fun OptimizedAnimatedBackground(
     // Consolidated LaunchedEffect for both initialization and updates with theme-aware scaling
     LaunchedEffect(canvasSize, scaledParticleCount, animationTime) {
         if (canvasSize == Offset.Zero) return@LaunchedEffect
-        
+
         // Initialize particles if needed with scaled count
         if (particles.size != scaledParticleCount) {
             particles.clear()
             repeat(scaledParticleCount) {
                 particles.add(createRandomMutableParticle(canvasSize.x, canvasSize.y, scaledParticleSpeed))
             }
         }
-        
+
         // Update existing particles in-place with scaled speed
         particles.forEach { particle ->
             updateMutableParticle(particle, canvasSize.x, canvasSize.y, scaledParticleSpeed)
@@ -138,7 +166,8 @@ fun OptimizedAnimatedBackground(
 private data class ParticleColors(
     val particleColor: Color,
     val connectionColor: Color,
-    val mouseConnectionColor: Color
+    val mouseConnectionColor: Color,
+    val triangleFillColor: Color
 )
 
 /**
@@ -158,7 +187,12 @@ private fun createRandomMutableParticle(canvasWidth: Float, canvasHeight: Float,
 /**
  * Update mutable particle in-place (no object allocation)
  */
-private fun updateMutableParticle(particle: MutableParticle, canvasWidth: Float, canvasHeight: Float, baseSpeed: Float) {
+private fun updateMutableParticle(
+    particle: MutableParticle,
+    canvasWidth: Float,
+    canvasHeight: Float,
+    baseSpeed: Float
+) {
     // Update position
     particle.x += particle.vx
     particle.y += particle.vy
@@ -183,39 +217,204 @@ private fun updateMutableParticle(particle: MutableParticle, canvasWidth: Float,
     particle.vy = particle.vy.coerceIn(-maxSpeed, maxSpeed)
 }
 
+/**
+ * Draw glass shard triangles formed by connected particles and mouse
+ */
+private fun DrawScope.drawTriangles(
+    particles: List<MutableParticle>,
+    connections: List<Connection>,
+    mouseConnections: List<Int>,
+    mousePosition: Offset?,
+    connectionDistanceSquared: Float,
+    colors: ParticleColors
+) {
+
+    // Find triangles formed by particle-to-particle connections
+    for (i in connections.indices) {
+        for (j in i + 1 until connections.size) {
+            val conn1 = connections[i]
+            val conn2 = connections[j]
+
+            // Check if two connections share a common particle (form a triangle)
+            val sharedParticle = when {
+                conn1.first == conn2.first -> conn1.first
+                conn1.first == conn2.second -> conn1.first
+                conn1.second == conn2.first -> conn1.second
+                conn1.second == conn2.second -> conn1.second
+                else -> null
+            }
+
+            if (sharedParticle != null) {
+                // Get the three particles forming the triangle
+                val p1Index = if (conn1.first == sharedParticle) conn1.second else conn1.first
+                val p2Index = sharedParticle
+                val p3Index = if (conn2.first == sharedParticle) conn2.second else conn2.first
+
+                // Verify the third edge exists (p1 to p3)
+                val p1 = particles[p1Index]
+                val p3 = particles[p3Index]
+                val dx = p1.x - p3.x
+                val dy = p1.y - p3.y
+                val distanceSquared = dx * dx + dy * dy
+
+                if (distanceSquared <= connectionDistanceSquared) {
+                    drawGlassTriangle(
+                        particles[p1Index],
+                        particles[p2Index],
+                        particles[p3Index],
+                        connectionDistanceSquared,
+                        colors.triangleFillColor
+                    )
+                }
+            }
+        }
+    }
+
+    // Find triangles involving the mouse position
+    mousePosition?.let { mouse ->
+        if (mouseConnections.size >= 2) {
+            // Check each pair of mouse-connected particles
+            for (i in mouseConnections.indices) {
+                for (j in i + 1 until mouseConnections.size) {
+                    val p1Index = mouseConnections[i]
+                    val p2Index = mouseConnections[j]
+
+                    // Check if these two particles are also connected to each other
+                    if (connections.any {
+                            (it.first == p1Index && it.second == p2Index) ||
+                                    (it.first == p2Index && it.second == p1Index)
+                        }) {
+                        drawGlassTriangleWithMouse(
+                            particles[p1Index],
+                            particles[p2Index],
+                            mouse,
+                            connectionDistanceSquared,
+                            colors.triangleFillColor
+                        )
+                    }
+                }
+            }
+        }
+    }
+}
+
+/**
+ * Draw a glass shard triangle between three particles
+ */
+private fun DrawScope.drawGlassTriangle(
+    p1: MutableParticle,
+    p2: MutableParticle,
+    p3: MutableParticle,
+    connectionDistanceSquared: Float,
+    baseColor: Color
+) {
+    // Calculate distances of all three edges to find the longest
+    val dist1Sq = (p1.x - p2.x) * (p1.x - p2.x) + (p1.y - p2.y) * (p1.y - p2.y)
+    val dist2Sq = (p2.x - p3.x) * (p2.x - p3.x) + (p2.y - p3.y) * (p2.y - p3.y)
+    val dist3Sq = (p3.x - p1.x) * (p3.x - p1.x) + (p3.y - p1.y) * (p3.y - p1.y)
+
+    // Use the longest edge for alpha calculation
+    val longestDistanceSquared = maxOf(dist1Sq, dist2Sq, dist3Sq)
+    val longestDistance = kotlin.math.sqrt(longestDistanceSquared)
+    val maxDistance = kotlin.math.sqrt(connectionDistanceSquared)
+
+    // Make triangles fainter and decay faster than connection lines
+    // Base alpha factor is 0.3 (much fainter than lines) and use squared ratio for faster decay
+    val distanceRatio = (longestDistance / maxDistance).coerceIn(0f, 1f)
+    val alpha = (1 - distanceRatio * distanceRatio) * baseColor.alpha * 0.3f
+
+    val trianglePath = Path().apply {
+        moveTo(p1.x, p1.y)
+        lineTo(p2.x, p2.y)
+        lineTo(p3.x, p3.y)
+        close()
+    }
+
+    drawPath(
+        path = trianglePath,
+        color = baseColor.copy(alpha = alpha)
+    )
+}
+
+/**
+ * Draw a glass shard triangle involving mouse position
+ */
+private fun DrawScope.drawGlassTriangleWithMouse(
+    p1: MutableParticle,
+    p2: MutableParticle,
+    mousePos: Offset,
+    connectionDistanceSquared: Float,
+    baseColor: Color
+) {
+    // Calculate distances of all three edges to find the longest
+    val dist1Sq = (p1.x - p2.x) * (p1.x - p2.x) + (p1.y - p2.y) * (p1.y - p2.y)
+    val dist2Sq = (p2.x - mousePos.x) * (p2.x - mousePos.x) + (p2.y - mousePos.y) * (p2.y - mousePos.y)
+    val dist3Sq = (mousePos.x - p1.x) * (mousePos.x - p1.x) + (mousePos.y - p1.y) * (mousePos.y - p1.y)
+
+    // Use the longest edge for alpha calculation
+    val longestDistanceSquared = maxOf(dist1Sq, dist2Sq, dist3Sq)
+    val longestDistance = kotlin.math.sqrt(longestDistanceSquared)
+    val maxDistance = kotlin.math.sqrt(connectionDistanceSquared)
+
+    // Make triangles fainter and decay faster than connection lines
+    // Mouse triangles get slightly higher intensity (0.4 vs 0.3) but still much fainter than lines
+    val distanceRatio = (longestDistance / maxDistance).coerceIn(0f, 1f)
+    val alpha = (1 - distanceRatio * distanceRatio) * baseColor.alpha * 0.4f
+
+    val trianglePath = Path().apply {
+        moveTo(p1.x, p1.y)
+        lineTo(p2.x, p2.y)
+        lineTo(mousePos.x, mousePos.y)
+        close()
+    }
+
+    drawPath(
+        path = trianglePath,
+        color = baseColor.copy(alpha = alpha)
+    )
+}
+
 /**
  * Optimized drawing function with major performance improvements:
  * 1. Eliminated nested loop O(n²) algorithm using distance culling
  * 2. Uses squared distance comparison (no expensive sqrt)
  * 3. Early termination for distant particles
  * 4. Cached color objects
  * 5. Reduced temporary object allocation
+ * 6. Glass shard triangles when three points are connected
  */
 private fun DrawScope.drawOptimizedParticlesAndConnections(
     particles: List<MutableParticle>,
     connectionDistanceSquared: Float,
     colors: ParticleColors,
     mousePosition: Offset? = null
 ) {
-    // Optimized connection drawing with distance culling
+    // Collect all connected pairs for triangle detection
+    val connections = mutableListOf<Connection>()
+    val mouseConnections = mutableListOf<Int>()
+
+    // Optimized connection drawing with distance culling and connection tracking
     // Still O(n²) but with early termination for better average case performance
     for (i in particles.indices) {
         val particle1 = particles[i]
-        
+
         for (j in i + 1 until particles.size) {
             val particle2 = particles[j]
-            
+
             // Fast squared distance calculation (no sqrt needed)
             val dx = particle1.x - particle2.x
             val dy = particle1.y - particle2.y
             val distanceSquared = dx * dx + dy * dy
-            
+
             // Early termination if too far apart
             if (distanceSquared <= connectionDistanceSquared) {
+                // Track connection for triangle detection
+                connections.add(Connection(i, j))
+
                 // Only calculate sqrt when we know we need to draw
                 val distance = kotlin.math.sqrt(distanceSquared)
                 val alpha = (1 - distance / kotlin.math.sqrt(connectionDistanceSquared)) * colors.connectionColor.alpha
-                
+
                 drawLine(
                     color = colors.connectionColor.copy(alpha = alpha),
                     start = Offset(particle1.x, particle1.y),
@@ -226,17 +425,21 @@ private fun DrawScope.drawOptimizedParticlesAndConnections(
         }
     }
 
-    // Optimized mouse connections
+    // Optimized mouse connections with tracking for triangle detection
     mousePosition?.let { mouse ->
-        particles.forEach { particle ->
+        particles.forEachIndexed { index, particle ->
             val dx = particle.x - mouse.x
             val dy = particle.y - mouse.y
             val distanceSquared = dx * dx + dy * dy
-            
+
             if (distanceSquared <= connectionDistanceSquared) {
+                // Track mouse connection for triangle detection
+                mouseConnections.add(index)
+
                 val distance = kotlin.math.sqrt(distanceSquared)
-                val alpha = (1 - distance / kotlin.math.sqrt(connectionDistanceSquared)) * colors.mouseConnectionColor.alpha
-                
+                val alpha =
+                    (1 - distance / kotlin.math.sqrt(connectionDistanceSquared)) * colors.mouseConnectionColor.alpha
+
                 drawLine(
                     color = colors.mouseConnectionColor.copy(alpha = alpha),
                     start = Offset(particle.x, particle.y),
@@ -247,6 +450,9 @@ private fun DrawScope.drawOptimizedParticlesAndConnections(
         }
     }
 
+    // Draw glass shard triangles
+    drawTriangles(particles, connections, mouseConnections, mousePosition, connectionDistanceSquared, colors)
+
     // Draw particles with cached colors
     particles.forEach { particle ->
         drawCircle(
@@ -255,4 +461,4 @@ private fun DrawScope.drawOptimizedParticlesAndConnections(
             center = Offset(particle.x, particle.y)
         )
     }
-}
+}