DEV Community


Discussion on: What was your win this week?

jckuhl profile image
Jonathan Kuhl

This week, I finally solved the issue of clearing blank cells in a minesweeper clone using Recursion. I started a MineSweeper clone using React that I imaginatively called "React Sweeper" and after some finagling, I got most of it to work.

Except for clearing blank cells.

For those of you who don't know MineSweeper, when you click on a blank cell, all the adjacent blank cells clear, as well as the numbers around the edge of the area. I knew the way to implement this would probably be recursion, but I had trouble figuring it out.

I sat on it for a month.

I came back to it this afternoon and finally got it to work. At first I used Array methods, like .map, but that turned out to be very slow, because it resulted in an array that had arrays in it, and flattening such an array got expensive. My largest minesweeper grid would crash because it got too slow. So I replaced .map with an old school for(;;) loop, which helped me avoid having to flatten the array and sped everything up significantly. Now clearing the largest grid still has a small noticeable delay, but less than a second.

It is now complete. It is my first time actually using npm run build on a React App, and my first time deploying a React app to Netlify.

It uses React Router, Styled-Components, CSS Grid and CSS Flexbox.