High-level outline of an asynchronous tree drawing algorithm

tree.js

// render the given branch, which is specified by its startingPoint, length, and angle
// If there are more branches to grow, grow randomly to the left and right
function growBranch({ startingPoint, length, angle, remainingBranches }) {
  endingPoint = computeEndpoint({ startingPoint, length, angle });
  renderBranch({ startingPoint, endingPoint });

  const newRemainingBranches = remainingBranches - 1;
  if (newRemainingBranches <= 0) {
    return;
  }

  ["left", "right"].forEach(direction => {
    const newAngle = computeRandomAngle(direction);
    const newLength = shrinkBranchLength(length);

    setTimeout(function() {
      growBranch({
        startingPoint: endingPoint,
        length: newLength,
        angle: newAngle,
        remainingBranches: newRemainingBranches
      });
    }, DELAY);
  });
}

// Starts off the tree by growing the first "branch," i.e. the trunk itself
function growTree() {
  growBranch({
    startingPoint: GROUND,
    length: TRUNK_LENGTH,
    angle: STRAIGHT_UP,
    remainingBranches: TREE_COMPLEXITY
  });
}