For handling block collision and clearing in a grid-based puzzle game, using a 2D array to represent the game state is the most efficient approach. The clearing logic typically involves a “flood fill” algorithm to find and remove connected blocks of the same color, followed by a function to make blocks fall into empty spaces.
For smooth animation on mobile, CSS transforms and requestAnimationFrame are your best friends. They are heavily optimized by browsers. A lightweight framework like Phaser or PixiJS is often worth it, as it handles rendering, input, and asset loading, letting you focus on the game logic.