The following blocks of code show two different ways of implementing the graphics pipeline:

Version $1$:

$/*$ main.js $*/$

$...$

let myMatrix $=$ mult$($projMatrix$,$ mult$($cameraMatrix$,$ modelMatrix$))$;

let matrixUniform $=$ gl$.$getUniformLocation$($program$,$ webglMatrix$)$;

gl$.$uniformMatrix$4$fv$($matrixUniform$,$ false, flatten$($myMatrix$))$;

$...$

$/*$ index.html $*/$

$...$

attribute vec$4$ vPosition;

attribute vec$4$ vColor;

uniform mat$4$ webglMatrix;

varying vec$4$ fColor;

void main$()\{$

gl$\_$Position $=$ webglMatrix $*$ vPosition;

fColor $=$ vColor;

$\}$

$...$

Version $2$:

$/*$ main.js $*/$

$...$

let projMatrixLoc $=$ gl$.$getUniformLocation$($program$,$ projMatrix$)$;

gl$.$uniformMatrix$4$fv$($projMatrixLoc$,$ false, flatten$($projMatrix$))$;

let cameraMatrixLoc $=$ gl$.$getUniformLocation$($program$,$ cameraMatrix$)$;

gl$.$uniformMatrix$4$fv$($cameraMatrixLoc$,$ false, flatten$($cameraMatrix$))$;

let modelMatrixLoc $=$ gl$.$getUniformLocation$($program$,$ modelMatrix$)$;

gl$.$uniformMatrix$4$fv$($modelMatrixLoc$,$ false, flatten$($modelMatrix$))$;

$...$

$/*$ index.html $*/$

$...$

attribute vec$4$ vPosition;

attribute vec$4$ vColor;

uniform mat$4$ projMatrix;

uniform mat$4$ cameraMatrix;

uniform mat$4$ modelMatrix;

varying vec$4$ fColor;

void main$()\{$

gl$\_$Position $=$ projMatrix $*$ cameraMatrix $*$ modelMatrix $*$ vPosition;

fColor $=$ vColor;

$\}$

$...$

Explain the advantages of each approach. Be detailed in your answer.