bytev-charts/lib/plugin/three.js/examples/jsm/renderers/webgpu/WebGPURenderer.js

基于echarts和JavaScript及ES6封装的一个可以直接调用的图表组件库，内置主题设计，简单快捷，且支持用户自定义配置； npm 安装方式: npm install bytev-charts 若启动提示还需额外install插件,则运行 npm install @babel/runtime-corejs2 即可;

import "core-js/modules/es.array.slice.js";
import _asyncToGenerator from "@babel/runtime-corejs2/helpers/asyncToGenerator";
import _classCallCheck from "@babel/runtime-corejs2/helpers/classCallCheck";
import _createClass from "@babel/runtime-corejs2/helpers/createClass";
import _regeneratorRuntime from "@babel/runtime-corejs2/regenerator";

function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof _Symbol !== "undefined" && o[_Symbol$iterator] || o["@@iterator"]; if (!it) { if (_Array$isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return _Array$from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

import "core-js/modules/es.array.sort.js";
import "core-js/modules/es.regexp.exec.js";
import "core-js/modules/es.array.iterator.js";
import "core-js/modules/es.array-buffer.slice.js";
import "core-js/modules/es.object.to-string.js";
import "core-js/modules/es.typed-array.uint16-array.js";
import "core-js/modules/es.typed-array.copy-within.js";
import "core-js/modules/es.typed-array.every.js";
import "core-js/modules/es.typed-array.fill.js";
import "core-js/modules/es.typed-array.filter.js";
import "core-js/modules/es.typed-array.find.js";
import "core-js/modules/es.typed-array.find-index.js";
import "core-js/modules/es.typed-array.for-each.js";
import "core-js/modules/es.typed-array.includes.js";
import "core-js/modules/es.typed-array.index-of.js";
import "core-js/modules/es.typed-array.iterator.js";
import "core-js/modules/es.typed-array.join.js";
import "core-js/modules/es.typed-array.last-index-of.js";
import "core-js/modules/es.typed-array.map.js";
import "core-js/modules/es.typed-array.reduce.js";
import "core-js/modules/es.typed-array.reduce-right.js";
import "core-js/modules/es.typed-array.reverse.js";
import "core-js/modules/es.typed-array.set.js";
import "core-js/modules/es.typed-array.slice.js";
import "core-js/modules/es.typed-array.some.js";
import "core-js/modules/es.typed-array.sort.js";
import "core-js/modules/es.typed-array.subarray.js";
import "core-js/modules/es.typed-array.to-locale-string.js";
import "core-js/modules/es.typed-array.to-string.js";
import "core-js/modules/es.function.name.js";
import "core-js/modules/es.promise.js";
import _Object$assign from "@babel/runtime-corejs2/core-js/object/assign";
import _Array$isArray from "@babel/runtime-corejs2/core-js/array/is-array";
import _Array$from from "@babel/runtime-corejs2/core-js/array/from";
import _Symbol from "@babel/runtime-corejs2/core-js/symbol";
import _Symbol$iterator from "@babel/runtime-corejs2/core-js/symbol/iterator";
import { GPUIndexFormat, GPUTextureFormat, GPUStoreOp } from './constants.js';
import WebGPUObjects from './WebGPUObjects.js';
import WebGPUAttributes from './WebGPUAttributes.js';
import WebGPUGeometries from './WebGPUGeometries.js';
import WebGPUInfo from './WebGPUInfo.js';
import WebGPUProperties from './WebGPUProperties.js';
import WebGPURenderPipelines from './WebGPURenderPipelines.js';
import WebGPUBindings from './WebGPUBindings.js';
import WebGPURenderLists from './WebGPURenderLists.js';
import WebGPUTextures from './WebGPUTextures.js';
import WebGPUBackground from './WebGPUBackground.js';
import { Frustum, Matrix4, Vector3, Color } from '../../../../build/three.module.js';
console.info('THREE.WebGPURenderer: Modified Matrix4.makePerspective() and Matrix4.makeOrtographic() to work with WebGPU, see https://github.com/mrdoob/three.js/issues/20276.');

Matrix4.prototype.makePerspective = function (left, right, top, bottom, near, far) {
  var te = this.elements;
  var x = 2 * near / (right - left);
  var y = 2 * near / (top - bottom);
  var a = (right + left) / (right - left);
  var b = (top + bottom) / (top - bottom);
  var c = -far / (far - near);
  var d = -far * near / (far - near);
  te[0] = x;
  te[4] = 0;
  te[8] = a;
  te[12] = 0;
  te[1] = 0;
  te[5] = y;
  te[9] = b;
  te[13] = 0;
  te[2] = 0;
  te[6] = 0;
  te[10] = c;
  te[14] = d;
  te[3] = 0;
  te[7] = 0;
  te[11] = -1;
  te[15] = 0;
  return this;
};

Matrix4.prototype.makeOrthographic = function (left, right, top, bottom, near, far) {
  var te = this.elements;
  var w = 1.0 / (right - left);
  var h = 1.0 / (top - bottom);
  var p = 1.0 / (far - near);
  var x = (right + left) * w;
  var y = (top + bottom) * h;
  var z = near * p;
  te[0] = 2 * w;
  te[4] = 0;
  te[8] = 0;
  te[12] = -x;
  te[1] = 0;
  te[5] = 2 * h;
  te[9] = 0;
  te[13] = -y;
  te[2] = 0;
  te[6] = 0;
  te[10] = -1 * p;
  te[14] = -z;
  te[3] = 0;
  te[7] = 0;
  te[11] = 0;
  te[15] = 1;
  return this;
};

var _frustum = new Frustum();

var _projScreenMatrix = new Matrix4();

var _vector3 = new Vector3();

var WebGPURenderer = /*#__PURE__*/function () {
  function WebGPURenderer() {
    var parameters = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

    _classCallCheck(this, WebGPURenderer);

    // public
    this.domElement = parameters.canvas !== undefined ? parameters.canvas : document.createElementNS('http://www.w3.org/1999/xhtml', 'canvas');
    this.autoClear = true;
    this.autoClearColor = true;
    this.autoClearDepth = true;
    this.autoClearStencil = true;
    this.sortObjects = true; // internals

    this._parameters = _Object$assign({}, parameters);
    this._pixelRatio = 1;
    this._width = this.domElement.width;
    this._height = this.domElement.height;
    this._viewport = null;
    this._scissor = null;
    this._adapter = null;
    this._device = null;
    this._context = null;
    this._swapChain = null;
    this._colorBuffer = null;
    this._depthBuffer = null;
    this._info = null;
    this._properties = null;
    this._attributes = null;
    this._geometries = null;
    this._bindings = null;
    this._objects = null;
    this._renderPipelines = null;
    this._renderLists = null;
    this._textures = null;
    this._background = null;
    this._renderPassDescriptor = null;
    this._currentRenderList = null;
    this._opaqueSort = null;
    this._transparentSort = null;
    this._clearAlpha = 1;
    this._clearColor = new Color(0x000000);
    this._clearDepth = 1;
    this._clearStencil = 0;
    this._renderTarget = null; // some parameters require default values other than "undefined"

    this._parameters.antialias = parameters.antialias === true;

    if (this._parameters.antialias === true) {
      this._parameters.sampleCount = parameters.sampleCount === undefined ? 4 : parameters.sampleCount;
    } else {
      this._parameters.sampleCount = 1;
    }

    this._parameters.enabledExtensions = parameters.enabledExtensions === undefined ? [] : parameters.enabledExtensions;
    this._parameters.limits = parameters.limits === undefined ? {} : parameters.limits;
  }

  _createClass(WebGPURenderer, [{
    key: "init",
    value: function init() {
      return initWebGPU(this);
    }
  }, {
    key: "render",
    value: function render(scene, camera) {
      if (scene.autoUpdate === true) scene.updateMatrixWorld();
      if (camera.parent === null) camera.updateMatrixWorld();
      if (this._info.autoReset === true) this._info.reset();

      _projScreenMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);

      _frustum.setFromProjectionMatrix(_projScreenMatrix);

      this._currentRenderList = this._renderLists.get(scene, camera);

      this._currentRenderList.init();

      this._projectObject(scene, camera, 0);

      this._currentRenderList.finish();

      if (this.sortObjects === true) {
        this._currentRenderList.sort(this._opaqueSort, this._transparentSort);
      } // prepare render pass descriptor


      var colorAttachment = this._renderPassDescriptor.colorAttachments[0];
      var depthStencilAttachment = this._renderPassDescriptor.depthStencilAttachment;
      var renderTarget = this._renderTarget;

      if (renderTarget !== null) {
        // @TODO: Support RenderTarget with antialiasing.
        var renderTargetProperties = this._properties.get(renderTarget);

        colorAttachment.attachment = renderTargetProperties.colorTextureGPU.createView();
        depthStencilAttachment.attachment = renderTargetProperties.depthTextureGPU.createView();
      } else {
        if (this._parameters.antialias === true) {
          colorAttachment.attachment = this._colorBuffer.createView();
          colorAttachment.resolveTarget = this._swapChain.getCurrentTexture().createView();
        } else {
          colorAttachment.attachment = this._swapChain.getCurrentTexture().createView();
          colorAttachment.resolveTarget = undefined;
        }

        depthStencilAttachment.attachment = this._depthBuffer.createView();
      } //


      this._background.update(scene); // start render pass


      var device = this._device;
      var cmdEncoder = device.createCommandEncoder({});
      var passEncoder = cmdEncoder.beginRenderPass(this._renderPassDescriptor); // global rasterization settings for all renderable objects

      var vp = this._viewport;

      if (vp !== null) {
        var width = Math.floor(vp.width * this._pixelRatio);
        var height = Math.floor(vp.height * this._pixelRatio);
        passEncoder.setViewport(vp.x, vp.y, width, height, vp.minDepth, vp.maxDepth);
      }

      var sc = this._scissor;

      if (sc !== null) {
        var _width = Math.floor(sc.width * this._pixelRatio);

        var _height = Math.floor(sc.height * this._pixelRatio);

        passEncoder.setScissorRect(sc.x, sc.y, _width, _height);
      } // process render lists


      var opaqueObjects = this._currentRenderList.opaque;
      var transparentObjects = this._currentRenderList.transparent;
      if (opaqueObjects.length > 0) this._renderObjects(opaqueObjects, camera, passEncoder);
      if (transparentObjects.length > 0) this._renderObjects(transparentObjects, camera, passEncoder); // finish render pass

      passEncoder.endPass();
      device.defaultQueue.submit([cmdEncoder.finish()]);
    }
  }, {
    key: "getContext",
    value: function getContext() {
      return this._context;
    }
  }, {
    key: "getPixelRatio",
    value: function getPixelRatio() {
      return this._pixelRatio;
    }
  }, {
    key: "getDrawingBufferSize",
    value: function getDrawingBufferSize(target) {
      return target.set(this._width * this._pixelRatio, this._height * this._pixelRatio).floor();
    }
  }, {
    key: "getSize",
    value: function getSize(target) {
      return target.set(this._width, this._height);
    }
  }, {
    key: "setPixelRatio",
    value: function setPixelRatio() {
      var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
      this._pixelRatio = value;
      this.setSize(this._width, this._height, false);
    }
  }, {
    key: "setDrawingBufferSize",
    value: function setDrawingBufferSize(width, height, pixelRatio) {
      this._width = width;
      this._height = height;
      this._pixelRatio = pixelRatio;
      this.domElement.width = Math.floor(width * pixelRatio);
      this.domElement.height = Math.floor(height * pixelRatio);

      this._setupColorBuffer();

      this._setupDepthBuffer();
    }
  }, {
    key: "setSize",
    value: function setSize(width, height) {
      var updateStyle = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
      this._width = width;
      this._height = height;
      this.domElement.width = Math.floor(width * this._pixelRatio);
      this.domElement.height = Math.floor(height * this._pixelRatio);

      if (updateStyle === true) {
        this.domElement.style.width = width + 'px';
        this.domElement.style.height = height + 'px';
      }

      this._setupColorBuffer();

      this._setupDepthBuffer();
    }
  }, {
    key: "setOpaqueSort",
    value: function setOpaqueSort(method) {
      this._opaqueSort = method;
    }
  }, {
    key: "setTransparentSort",
    value: function setTransparentSort(method) {
      this._transparentSort = method;
    }
  }, {
    key: "getScissor",
    value: function getScissor(target) {
      var scissor = this._scissor;
      target.x = scissor.x;
      target.y = scissor.y;
      target.width = scissor.width;
      target.height = scissor.height;
      return target;
    }
  }, {
    key: "setScissor",
    value: function setScissor(x, y, width, height) {
      if (x === null) {
        this._scissor = null;
      } else {
        this._scissor = {
          x: x,
          y: y,
          width: width,
          height: height
        };
      }
    }
  }, {
    key: "getViewport",
    value: function getViewport(target) {
      var viewport = this._viewport;
      target.x = viewport.x;
      target.y = viewport.y;
      target.width = viewport.width;
      target.height = viewport.height;
      target.minDepth = viewport.minDepth;
      target.maxDepth = viewport.maxDepth;
      return target;
    }
  }, {
    key: "setViewport",
    value: function setViewport(x, y, width, height) {
      var minDepth = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
      var maxDepth = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1;

      if (x === null) {
        this._viewport = null;
      } else {
        this._viewport = {
          x: x,
          y: y,
          width: width,
          height: height,
          minDepth: minDepth,
          maxDepth: maxDepth
        };
      }
    }
  }, {
    key: "getClearColor",
    value: function getClearColor() {
      return this._clearColor;
    }
  }, {
    key: "setClearColor",
    value: function setClearColor(color) {
      var alpha = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;

      this._clearColor.set(color);

      this._clearAlpha = alpha;
    }
  }, {
    key: "getClearAlpha",
    value: function getClearAlpha() {
      return this._clearAlpha;
    }
  }, {
    key: "setClearAlpha",
    value: function setClearAlpha(alpha) {
      this._clearAlpha = alpha;
    }
  }, {
    key: "getClearDepth",
    value: function getClearDepth() {
      return this._clearDepth;
    }
  }, {
    key: "setClearDepth",
    value: function setClearDepth(depth) {
      this._clearDepth = depth;
    }
  }, {
    key: "getClearStencil",
    value: function getClearStencil() {
      return this._clearStencil;
    }
  }, {
    key: "setClearStencil",
    value: function setClearStencil(stencil) {
      this._clearStencil = stencil;
    }
  }, {
    key: "clear",
    value: function clear() {
      this._background.clear();
    }
  }, {
    key: "dispose",
    value: function dispose() {
      this._objects.dispose();

      this._properties.dispose();

      this._renderPipelines.dispose();

      this._bindings.dispose();

      this._info.dispose();

      this._renderLists.dispose();

      this._textures.dispose();
    }
  }, {
    key: "setRenderTarget",
    value: function setRenderTarget(renderTarget) {
      this._renderTarget = renderTarget;

      if (renderTarget !== null) {
        this._textures.initRenderTarget(renderTarget);
      }
    }
  }, {
    key: "_projectObject",
    value: function _projectObject(object, camera, groupOrder) {
      var info = this._info;
      var currentRenderList = this._currentRenderList;
      if (object.visible === false) return;
      var visible = object.layers.test(camera.layers);

      if (visible) {
        if (object.isGroup) {
          groupOrder = object.renderOrder;
        } else if (object.isLOD) {
          if (object.autoUpdate === true) object.update(camera);
        } else if (object.isLight) {
          //currentRenderState.pushLight( object );
          if (object.castShadow) {//currentRenderState.pushShadow( object );
          }
        } else if (object.isSprite) {
          if (!object.frustumCulled || _frustum.intersectsSprite(object)) {
            if (this.sortObjects === true) {
              _vector3.setFromMatrixPosition(object.matrixWorld).applyMatrix4(_projScreenMatrix);
            }

            var geometry = object.geometry;
            var material = object.material;

            if (material.visible) {
              currentRenderList.push(object, geometry, material, groupOrder, _vector3.z, null);
            }
          }
        } else if (object.isMesh || object.isLine || object.isPoints) {
          if (object.isSkinnedMesh) {
            // update skeleton only once in a frame
            if (object.skeleton.frame !== info.render.frame) {
              object.skeleton.update();
              object.skeleton.frame = info.render.frame;
            }
          }

          if (!object.frustumCulled || _frustum.intersectsObject(object)) {
            if (this.sortObjects === true) {
              _vector3.setFromMatrixPosition(object.matrixWorld).applyMatrix4(_projScreenMatrix);
            }

            var _geometry = object.geometry;
            var _material = object.material;

            if (_Array$isArray(_material)) {
              var groups = _geometry.groups;

              for (var i = 0, l = groups.length; i < l; i++) {
                var group = groups[i];
                var groupMaterial = _material[group.materialIndex];

                if (groupMaterial && groupMaterial.visible) {
                  currentRenderList.push(object, _geometry, groupMaterial, groupOrder, _vector3.z, group);
                }
              }
            } else if (_material.visible) {
              currentRenderList.push(object, _geometry, _material, groupOrder, _vector3.z, null);
            }
          }
        }
      }

      var children = object.children;

      for (var _i = 0, _l = children.length; _i < _l; _i++) {
        this._projectObject(children[_i], camera, groupOrder);
      }
    }
  }, {
    key: "_renderObjects",
    value: function _renderObjects(renderList, camera, passEncoder) {
      // process renderable objects
      for (var i = 0, il = renderList.length; i < il; i++) {
        var renderItem = renderList[i];
        var object = renderItem.object;
        object.modelViewMatrix.multiplyMatrices(camera.matrixWorldInverse, object.matrixWorld);
        object.normalMatrix.getNormalMatrix(object.modelViewMatrix);

        this._objects.update(object);

        this._bindings.update(object, camera);

        if (camera.isArrayCamera) {
          var cameras = camera.cameras;

          for (var j = 0, jl = cameras.length; j < jl; j++) {
            var camera2 = cameras[j];

            if (object.layers.test(camera2.layers)) {
              var vp = camera2.viewport;
              var minDepth = vp.minDepth === undefined ? 0 : vp.minDepth;
              var maxDepth = vp.maxDepth === undefined ? 1 : vp.maxDepth;
              passEncoder.setViewport(vp.x, vp.y, vp.width, vp.height, minDepth, maxDepth);

              this._renderObject(object, passEncoder);
            }
          }
        } else {
          this._renderObject(object, passEncoder);
        }
      }
    }
  }, {
    key: "_renderObject",
    value: function _renderObject(object, passEncoder) {
      var info = this._info; // pipeline

      var pipeline = this._renderPipelines.get(object);

      passEncoder.setPipeline(pipeline); // bind group

      var bindGroup = this._bindings.get(object).group;

      passEncoder.setBindGroup(0, bindGroup); // index

      var geometry = object.geometry;
      var index = geometry.index;
      var hasIndex = index !== null;

      if (hasIndex === true) {
        this._setupIndexBuffer(index, passEncoder);
      } // vertex buffers


      this._setupVertexBuffers(geometry.attributes, passEncoder, pipeline); // draw


      var drawRange = geometry.drawRange;
      var firstVertex = drawRange.start;

      if (hasIndex === true) {
        var indexCount = drawRange.count !== Infinity ? drawRange.count : index.count;
        passEncoder.drawIndexed(indexCount, 1, firstVertex, 0, 0);
        info.update(object, indexCount);
      } else {
        var positionAttribute = geometry.attributes.position;
        var vertexCount = drawRange.count !== Infinity ? drawRange.count : positionAttribute.count;
        passEncoder.draw(vertexCount, 1, firstVertex, 0);
        info.update(object, vertexCount);
      }
    }
  }, {
    key: "_setupIndexBuffer",
    value: function _setupIndexBuffer(index, encoder) {
      var buffer = this._attributes.get(index).buffer;

      var indexFormat = index.array instanceof Uint16Array ? GPUIndexFormat.Uint16 : GPUIndexFormat.Uint32;
      encoder.setIndexBuffer(buffer, indexFormat);
    }
  }, {
    key: "_setupVertexBuffers",
    value: function _setupVertexBuffers(geometryAttributes, encoder, pipeline) {
      var shaderAttributes = this._renderPipelines.getShaderAttributes(pipeline);

      var _iterator = _createForOfIteratorHelper(shaderAttributes),
          _step;

      try {
        for (_iterator.s(); !(_step = _iterator.n()).done;) {
          var shaderAttribute = _step.value;
          var name = shaderAttribute.name;
          var slot = shaderAttribute.slot;
          var attribute = geometryAttributes[name];

          if (attribute !== undefined) {
            var buffer = this._attributes.get(attribute).buffer;

            encoder.setVertexBuffer(slot, buffer);
          }
        }
      } catch (err) {
        _iterator.e(err);
      } finally {
        _iterator.f();
      }
    }
  }, {
    key: "_setupColorBuffer",
    value: function _setupColorBuffer() {
      var device = this._device;

      if (device) {
        if (this._colorBuffer) this._colorBuffer.destroy();
        this._colorBuffer = this._device.createTexture({
          size: {
            width: this._width * this._pixelRatio,
            height: this._height * this._pixelRatio,
            depth: 1
          },
          sampleCount: this._parameters.sampleCount,
          format: GPUTextureFormat.BRGA8Unorm,
          usage: GPUTextureUsage.OUTPUT_ATTACHMENT
        });
      }
    }
  }, {
    key: "_setupDepthBuffer",
    value: function _setupDepthBuffer() {
      var device = this._device;

      if (device) {
        if (this._depthBuffer) this._depthBuffer.destroy();
        this._depthBuffer = this._device.createTexture({
          size: {
            width: this._width * this._pixelRatio,
            height: this._height * this._pixelRatio,
            depth: 1
          },
          sampleCount: this._parameters.sampleCount,
          format: GPUTextureFormat.Depth24PlusStencil8,
          usage: GPUTextureUsage.OUTPUT_ATTACHMENT
        });
      }
    }
  }]);

  return WebGPURenderer;
}();

function initWebGPU(_x) {
  return _initWebGPU.apply(this, arguments);
}

function _initWebGPU() {
  _initWebGPU = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(scope) {
    var parameters, adapterOptions, adapter, deviceDescriptor, device, glslang, compiler, context, swapChain;
    return _regeneratorRuntime.wrap(function _callee$(_context) {
      while (1) {
        switch (_context.prev = _context.next) {
          case 0:
            parameters = scope._parameters;
            adapterOptions = {
              powerPreference: parameters.powerPreference
            };
            _context.next = 4;
            return navigator.gpu.requestAdapter(adapterOptions);

          case 4:
            adapter = _context.sent;
            deviceDescriptor = {
              enabledExtensions: parameters.enabledExtensions,
              limits: parameters.limits
            };
            _context.next = 8;
            return adapter.requestDevice(deviceDescriptor);

          case 8:
            device = _context.sent;
            _context.next = 11;
            return import('https://cdn.jsdelivr.net/npm/@webgpu/glslang@0.0.15/dist/web-devel/glslang.js');

          case 11:
            glslang = _context.sent;
            _context.next = 14;
            return glslang["default"]();

          case 14:
            compiler = _context.sent;
            context = parameters.context !== undefined ? parameters.context : scope.domElement.getContext('gpupresent');
            swapChain = context.configureSwapChain({
              device: device,
              format: GPUTextureFormat.BRGA8Unorm
            });
            scope._adapter = adapter;
            scope._device = device;
            scope._context = context;
            scope._swapChain = swapChain;
            scope._info = new WebGPUInfo();
            scope._properties = new WebGPUProperties();
            scope._attributes = new WebGPUAttributes(device);
            scope._geometries = new WebGPUGeometries(scope._attributes, scope._info);
            scope._textures = new WebGPUTextures(device, scope._properties, scope._info, compiler);
            scope._bindings = new WebGPUBindings(device, scope._info, scope._properties, scope._textures);
            scope._objects = new WebGPUObjects(scope._geometries, scope._info);
            scope._renderPipelines = new WebGPURenderPipelines(device, compiler, scope._bindings, parameters.sampleCount);
            scope._renderLists = new WebGPURenderLists();
            scope._background = new WebGPUBackground(scope); //

            scope._renderPassDescriptor = {
              colorAttachments: [{
                attachment: null
              }],
              depthStencilAttachment: {
                attachment: null,
                depthStoreOp: GPUStoreOp.Store,
                stencilStoreOp: GPUStoreOp.Store
              }
            };

            scope._setupColorBuffer();

            scope._setupDepthBuffer();

          case 34:
          case "end":
            return _context.stop();
        }
      }
    }, _callee);
  }));
  return _initWebGPU.apply(this, arguments);
}

export default WebGPURenderer;