I am currently making a clone of Agar.io based upon this I am stuck on getting skins to appear instead of the solid random color. With the current code, when you select a skin, making config.skin true, it freezes and I am not able to move, but can still chat. And I still have no image drawn.

config.skin is a base64 encoded image string

graph is the canvas's 2d context

    if (config.skin) {
      graph.strokeStyle = "hsl(" + userCurrent.hue + ", 100%, 45%)";
      graph.fillStyle = "hsl(" + userCurrent.hue + ", 100%, 50%)";
      graph.lineWidth = playerConfig.border;
      var skin = new Image();//userCurrent.x - 2 * userCurrent.size, userCurrent.y - 2 * userCurrent.size);
      skin.src = config.skin;
      skin.onload = () => { // jshint ignore:line
        graph.beginPath();
        graph.arc(userCurrent.h / 2, userCurrent.w / 2, userCurrent.radius, 0, Math.PI * 2, false);
        graph.clip();
        graph.drawImage(skin, userCurrent.x - 2 * userCurrent.size, userCurrent.y - 2 * userCurrent.size); //, 4 * userCurrent.size, 4 * userCurrent.size);
      };
    } else {
      graph.strokeStyle = "hsl(" + userCurrent.hue + ", 100%, 45%)";
      graph.fillStyle = "hsl(" + userCurrent.hue + ", 100%, 50%)";
      graph.lineWidth = playerConfig.border;
    }

full code at github