WebGL doesn't work when compiled with the --optimize flag

[w0rm]

Create the following file Triangle.elm:

module Triangle exposing (main)
import Html exposing (Html)
import WebGL exposing (Mesh, Shader)
import Math.Matrix4 as Mat4 exposing (Mat4)
import Math.Vector3 as Vec3 exposing (vec3, Vec3)
main : Html a
main =
    WebGL.toHtml []
        [ WebGL.entity
            vertexShader
            fragmentShader
            mesh
            { transform = Mat4.identity }
        ]
mesh : Mesh { position : Vec3, color : Vec3 }
mesh =
    WebGL.triangles
        [ ( { position = vec3 0 0 0, color = vec3 1 0 0 }
          , { position = vec3 1 1 0, color = vec3 0 1 0 }
          , { position = vec3 1 -1 0, color = vec3 0 0 1 }
          )
        ]
vertexShader : Shader { position : Vec3, color : Vec3 } { transform : Mat4 } { vcolor : Vec3 }
vertexShader =
    [glsl|
        attribute vec3 position;
        attribute vec3 color;
        uniform mat4 transform;
        varying vec3 vcolor;
        void main () {
            gl_Position = transform * vec4(position, 1.0);
            vcolor = color;
        }
    |]
fragmentShader : Shader {} { transform : Mat4 } { vcolor : Vec3 }
fragmentShader =
    [glsl|
        precision mediump float;
        varying vec3 vcolor;
        void main () {
            gl_FragColor = vec4(vcolor, 1.0);
        }
    |]

Execute this and see that index.html has runtime errors:

elm init
elm install elm-explorations/linear-algebra
elm install elm-explorations/webgl
elm make Triangle.elm --optimize --output=index.html

[w0rm]

Possible solution for "safe" shaders is to generate the conversion map for all attributes and uniforms:

{
    src: '\n\n        attribute vec3 position;\n        attribute vec3 color;\n        uniform mat4 transform;\n      ....  ',
    inputs: {
        position: 'ag', // attribute
        color: 'ac', // attribute
        transform: 'bj' // uniform
    }
}