Webgl 使用期货进行异步加载

我决定学习飞镖，为此我的项目将是一个小的webgl游戏

但是，在aysnc操作和期货中使用单线程对我来说是新的，虽然我理解这些概念，但我发现知道如何使用它们有点困难

在我的游戏中，我想加载一个webgl GLSL程序。要创建这个程序，我首先必须从文件中加载顶点着色器和片段着色器。因此，我写了这篇文章，它似乎可以用于加载和编译着色器

我遇到的问题是如何知道何时加载了两个着色器，以便从两个加载的着色器创建“程序”对象。以我可以使用的相同方式。然后在将来从HttpRequest.getString重新运行时，我需要以某种方式执行相同的操作，并具有一个。然后，当片段和顶点着色器都加载时，该操作将运行

我确信我在这里错过了一些重要的和容易的东西，但这对我来说是新的，我正在努力知道如何使用它。（这很好，学习新东西很好！）

---

对

then

的所有调用都返回一个

Future

，该调用在执行then回调后触发。因此，在编译步骤中有两个未来。之后，您可以使用等待期货列表。

wait

函数返回一个

Future

，该函数在所有输入期货完成后触发

类似这样的事情（不完整，只是为了了解它的工作原理）：

---

如果您从future回调返回已编译的着色器，

future.wait

回调将收到一个列表，其中包含来自所有futures的所有结果。

哦，对了，这很好。很简单。这几乎就好像他们已经想清楚了：）

  //
  // Start the process of loading the shaders. 
  //
  void initShaders()
  {
    Shader vs = gl.createShader(VERTEX_SHADER);
    Shader fs = gl.createShader(FRAGMENT_SHADER);

    var vsFuture = HttpRequest.getString('basic.vert');
    var fsFuture = HttpRequest.getString('basic.frag');

    //
    // When we have the vertex shader source, compile it
    //
    vsFuture.then((src) {
      gl.shaderSource(vs, src);
      gl.compileShader(vs);
      if (!gl.getShaderParameter(vs, COMPILE_STATUS)) {
        throw new Exception(gl.getShaderInfoLog(vs));
      }
      print ('Vertex shader compiled');
    });

    //
    // When we have the fragment shader source, compile it
    //
    fsFuture.then((src) {
      gl.shaderSource(fs, src);
      gl.compileShader(fs);
      if (!gl.getShaderParameter(fs, COMPILE_STATUS)) {
        throw new Exception(gl.getShaderInfoLog(fs));
      }
      print ('Fragment shader compiled');
    });


    //
    // When both the fragment shader and the vertex shader are 
    // compiled, we need to link them. But how do we know??
    //

    ***something... to make this be called when both the vertex and
    fragment shaders are compiled...***
    {
      program = gl.createProgram();
      gl.attachShader(program, fs);
      gl.attachShader(program, ps);
      gl.linkProgram(program);

    }

   var vsCompiledFuture = vsFuture.then((src) {
     // Compile
   });

   var fsCompiledFuture = fsFuture.then((src) {
     // Compile
   });

   Future.wait([vsCompiledFuture, fsCompiledFuture]).then((_) {
     // Link here...
   });