JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://getfirebug.com/firebug-lite-debug.js"></script>
<button onclick='startFill()'>Start!</button>
<div id='canvas'></div>

CSS

#canvas {
  border: 3px solid blue;
  font-family: monospace;
  font-size: 14px;
}

JavaScript

function fillCell(matrix, r, c, srcColor, color, fill) {
  if (matrix[r][c] == srcColor) {
    matrix[r][c] = color;
    fill.push([r, c]);
  }
}

function floodFill(matrix, point, color) {
	var start = Date.now();
  
  var srcColor = matrix[point[0]][point[1]];
  if (srcColor == color) return;

  matrix[point[0]][point[1]] = color;
  var frontier = [point];

	var iteration = 0;
  var maxFrontierLen = 0;
  while (frontier.length > 0) {
    //console.log(frontier);
    //console.log('Iteration:', iteration, '. Frontier len:', frontier.length);
    iteration++;
    maxFrontierLen = Math.max(maxFrontierLen, frontier.length);
    color = (color + iteration + 1) % 10;
    var fill = [];
    for (var p = 0; p < frontier.length; p++) {
      var r = frontier[p][0];
      var c = frontier[p][1];

      // up
      if (r > 0) fillCell(matrix, r - 1, c, srcColor, color, fill);
      // left
      if (c > 0) fillCell(matrix, r, c - 1, srcColor, color, fill);
      // down
      if (r < matrix.length - 1) fillCell(matrix, r + 1, c, srcColor, color, fill);
      // right
      if (c < matrix[0].length - 1) fillCell(matrix, r, c + 1, srcColor, color, fill);
    }
    frontier = fill;
  }
	var end = Date.now();
	console.log('Time:', end - start, 'msec (', matrix.length, 'x', matrix[0].length, ')');
  console.log('Iterations:', iteration, '. Max frontier len:', maxFrontierLen);
}

function paint(matrix, targetSelector) {
return;
  var html = '';
  for (var r = 0; r < matrix.length; r++) {
    for (var c = 0; c < matrix[r].length; c++) {
      html += matrix[r][c];
    }
    html += '<br/>';
  }
  $(targetSelector)
    .html(html);
}

window.startFill = function() {
  floodFill(canvas, [Math.floor(rows / 2), Math.floor(cols / 2)], '0');
  paint(canvas, '#canvas');
}

//////////////////////////////
var cols = 5000;
var rows = 2000;
//////////////////////////////

var canvas = [];
for (var r = 0; r < rows; r++) {
  var row = [];
  for (var c = 0; c < cols; c++) {
    var ch =...