A save and restore canvas state example

function canvasReady() {
  draw(document.getElementById('canvas').getContext('2d'));
}
function draw(ctx) {
  ctx.textBaseline = "top";
  ctx.font = "16pt Arial";
  ctx.shadowColor = "red";
  ctx.shadowOffsetX = 10;
  ctx.shadowOffsetY = 10;
  ctx.shadowBlur = 10;
  ctx.fillText("red shadow", 80, 20);

  ctx.save();
  ctx.textAlign = "center";
  ctx.font = "20pt 'Arial Black'";
  ctx.fillStyle = "#09F";
  ctx.shadowColor = "green";
  ctx.shadowOffsetX = 5;
  ctx.shadowOffsetY = 5;
  ctx.shadowBlur = 5;
  ctx.fillText("green shadow", 120, 60);

  ctx.save();
  ctx.textAlign = "end";
  ctx.font = "24pt 'Times New Roman'";
  ctx.globalAlpha = 0.5;
  ctx.fillStyle = "#eee";
  ctx.shadowColor = "blue";
  ctx.shadowOffsetX = 3;
  ctx.shadowOffsetY = -1;
  ctx.shadowBlur =  0;
  ctx.fillText("blue shadow", 220, 100);
  ctx.restore();

  ctx.fillText("green shadow", 120, 140);
  ctx.restore();

  ctx.fillText("red shadow", 80, 180);
}