Para os dois canvas o código é igual sendo que à esquerda é sem aplicação dos métodos e à direita com aplicação.
<script>
// canvas da esquerda
var canvas = document.getElementById('quadro');
var ctx = canvas.getContext('2d');
ctx.fillStyle = 'red';
ctx.fillRect(40,20,40,140);
ctx.fillStyle = 'green';
ctx.fillRect(110,20,40,140);
ctx.fillStyle = 'blue';
ctx.fillRect(180,20,40,140);
ctx.fillRect(250,20,40,140);
ctx.fillRect(320,20,40,140);
// canvas da direita
var canvas1 = document.getElementById('quadro1');
var ctx1 = canvas1.getContext('2d');
ctx1.fillStyle = 'red';
ctx1.fillRect(40,20,40,140);
ctx1.save()
ctx1.fillStyle = 'green';
ctx1.fillRect(110,20,40,140);
ctx1.save()
ctx1.fillStyle = 'blue';
ctx1.fillRect(180,20,40,140);
ctx1.restore()
ctx1.fillRect(250,20,40,140);
ctx1.restore()
ctx1.fillRect(320,20,40,140);
</script>
canvas {border:1px solid #ccc;}
<canvas id="quadro" width="400" height="200"> <p>Conteúdo alternativo para navegadores que não suportam canvas.</p> </canvas>