@cesium/engine 21.0.1 → 22.1.0

package/Source/Core/TerrainProvider.js

@@ -15,6 +15,8 @@ import CesiumMath from "./Math.js";
  * @see CesiumTerrainProvider
  * @see VRTheWorldTerrainProvider
  * @see GoogleEarthEnterpriseTerrainProvider
+ * @see ArcGISTiledElevationTerrainProvider
+ * @see Cesium3DTilesTerrainProvider
  */
 function TerrainProvider() {
   DeveloperError.throwInstantiationError();
@@ -236,7 +238,80 @@ TerrainProvider.getRegularGridAndSkirtIndicesAndEdgeIndices = function (
 };
 
 /**
+ * Calculates the number of skirt vertices given the edge indices.
  * @private
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} westIndicesSouthToNorth Edge indices along the west side of the tile.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} southIndicesEastToWest Edge indices along the south side of the tile.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} eastIndicesNorthToSouth Edge indices along the east side of the tile.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} northIndicesWestToEast Edge indices along the north side of the tile.
+ * @returns {number} The number of skirt vertices.
+ */
+TerrainProvider.getSkirtVertexCount = function (
+  westIndicesSouthToNorth,
+  southIndicesEastToWest,
+  eastIndicesNorthToSouth,
+  northIndicesWestToEast,
+) {
+  return (
+    westIndicesSouthToNorth.length +
+    southIndicesEastToWest.length +
+    eastIndicesNorthToSouth.length +
+    northIndicesWestToEast.length
+  );
+};
+
+/**
+ * Compute the number of skirt indices given the number of skirt vertices.
+ * Consider a 3x3 grid of vertices. There will be 8 skirt vertices around the edge:
+ * - 16 edge triangles
+ * - 48 indices
+ *
+ *   |\|\|
+ * |/|   |/|
+ * |/|   |/|
+ *   |\|\|
+ *
+ * @private
+ * @param {number} skirtVertexCount
+ * @returns {number}
+ */
+TerrainProvider.getSkirtIndexCount = function (skirtVertexCount) {
+  return (skirtVertexCount - 4) * 2 * 3;
+};
+
+/**
+ * Compute the number of skirt indices given the number of skirt vertices with filled corners.
+ * Consider a 3x3 grid of vertices. There will be 8 skirt vertices around the edge:
+ * - 16 edge triangles
+ * - 4 cap triangles
+ * - 60 indices
+ *
+ *  /|\|\|\
+ * |/|   |/|
+ * |/|   |/|
+ *  \|\|\|/
+ *
+ * @private
+ * @param {number} skirtVertexCount
+ * @returns {number}
+ */
+TerrainProvider.getSkirtIndexCountWithFilledCorners = function (
+  skirtVertexCount,
+) {
+  return ((skirtVertexCount - 4) * 2 + 4) * 3;
+};
+
+/**
+ * Adds skirt indices.
+ * This does not add filled corners. Use {@link TerrainProvider.addSkirtIndicesWithFilledCorners} to add skirt indices with filled corners.
+ * @private
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} westIndicesSouthToNorth The indices of the vertices on the Western edge of the tile, ordered from South to North.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} southIndicesEastToWest The indices of the vertices on the Southern edge of the tile, ordered from East to West.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} eastIndicesNorthToSouth The indices of the vertices on the Eastern edge of the tile, ordered from North to South.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} northIndicesWestToEast The indices of the vertices on the Northern edge of the tile, ordered from West to East.
+ * @param {number} vertexCount The number of vertices in the tile before adding skirt vertices.
+ * @param {Uint16Array|Uint32Array} indices The array of indices to which skirt indices are added.
+ * @param {number} offset The offset into the indices array at which to start adding skirt indices.
  */
 TerrainProvider.addSkirtIndices = function (
   westIndicesSouthToNorth,
@@ -272,6 +347,82 @@ TerrainProvider.addSkirtIndices = function (
   addSkirtIndices(northIndicesWestToEast, vertexIndex, indices, offset);
 };
 
+/**
+ * Adds skirt indices with filled corners.
+ * @private
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} westIndicesSouthToNorth The indices of the vertices on the Western edge of the tile, ordered from South to North.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} southIndicesEastToWest The indices of the vertices on the Southern edge of the tile, ordered from East to West.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} eastIndicesNorthToSouth The indices of the vertices on the Eastern edge of the tile, ordered from North to South.
+ * @param {number[]|Uint8Array|Uint16Array|Uint32Array} northIndicesWestToEast The indices of the vertices on the Northern edge of the tile, ordered from West to East.
+ * @param {number} vertexCount The number of vertices in the tile before adding skirt vertices.
+ * @param {Uint16Array|Uint32Array} indices The array of indices to which skirt indices are added.
+ * @param {number} offset The offset into the indices array at which to start adding skirt indices.
+ */
+TerrainProvider.addSkirtIndicesWithFilledCorners = function (
+  westIndicesSouthToNorth,
+  southIndicesEastToWest,
+  eastIndicesNorthToSouth,
+  northIndicesWestToEast,
+  vertexCount,
+  indices,
+  offset,
+) {
+  // Add skirt indices without filled corners
+  TerrainProvider.addSkirtIndices(
+    westIndicesSouthToNorth,
+    southIndicesEastToWest,
+    eastIndicesNorthToSouth,
+    northIndicesWestToEast,
+    vertexCount,
+    indices,
+    offset,
+  );
+
+  const skirtVertexCount = TerrainProvider.getSkirtVertexCount(
+    westIndicesSouthToNorth,
+    southIndicesEastToWest,
+    eastIndicesNorthToSouth,
+    northIndicesWestToEast,
+  );
+  const skirtIndexCountWithoutCaps =
+    TerrainProvider.getSkirtIndexCount(skirtVertexCount);
+
+  const cornerStartIdx = offset + skirtIndexCountWithoutCaps;
+
+  const cornerSWIndex = westIndicesSouthToNorth[0];
+  const cornerNWIndex = northIndicesWestToEast[0];
+  const cornerNEIndex = eastIndicesNorthToSouth[0];
+  const cornerSEIndex = southIndicesEastToWest[0];
+
+  // Indices based on edge order in addSkirtIndices
+  const westSouthIndex = vertexCount;
+  const westNorthIndex = westSouthIndex + westIndicesSouthToNorth.length - 1;
+  const southEastIndex = westNorthIndex + 1;
+  const southWestIndex = southEastIndex + southIndicesEastToWest.length - 1;
+  const eastNorthIndex = southWestIndex + 1;
+  const eastSouthIndex = eastNorthIndex + eastIndicesNorthToSouth.length - 1;
+  const northWestIndex = eastSouthIndex + 1;
+  const northEastIndex = northWestIndex + northIndicesWestToEast.length - 1;
+
+  // Connect the corner vertices with the skirt vertices extending from the corner
+
+  indices[cornerStartIdx + 0] = cornerSWIndex;
+  indices[cornerStartIdx + 1] = westSouthIndex;
+  indices[cornerStartIdx + 2] = southWestIndex;
+
+  indices[cornerStartIdx + 3] = cornerSEIndex;
+  indices[cornerStartIdx + 4] = southEastIndex;
+  indices[cornerStartIdx + 5] = eastSouthIndex;
+
+  indices[cornerStartIdx + 6] = cornerNEIndex;
+  indices[cornerStartIdx + 7] = eastNorthIndex;
+  indices[cornerStartIdx + 8] = northEastIndex;
+
+  indices[cornerStartIdx + 9] = cornerNWIndex;
+  indices[cornerStartIdx + 10] = northWestIndex;
+  indices[cornerStartIdx + 11] = westNorthIndex;
+};
+
 function getEdgeIndices(width, height) {
   const westIndicesSouthToNorth = new Array(height);
   const southIndicesEastToWest = new Array(width);

package/Source/Core/TexturePacker.js

@@ -122,6 +122,8 @@ TexturePacker.prototype._findNode = function (node, { width, height }) {
       return node;
     }
 
+    const borderPadding = this._borderPadding;
+
     // Vertical split (childNode1 = left half, childNode2 = right half).
     if (widthDifference > heightDifference) {
       node.childNode1 = new TextureNode({
@@ -130,12 +132,18 @@ TexturePacker.prototype._findNode = function (node, { width, height }) {
         width,
         height: nodeHeight,
       });
-      node.childNode2 = new TextureNode({
-        x: rectangle.x + width,
-        y: rectangle.y,
-        width: widthDifference,
-        height: nodeHeight,
-      });
+
+      // Apply padding only along the vertical "cut".
+      const widthDifferencePadded = widthDifference - borderPadding;
+
+      if (widthDifferencePadded > 0) {
+        node.childNode2 = new TextureNode({
+          x: rectangle.x + width + borderPadding,
+          y: rectangle.y,
+          width: widthDifferencePadded,
+          height: nodeHeight,
+        });
+      }
 
       return this._findNode(node.childNode1, { width, height });
     }
@@ -147,12 +155,19 @@ TexturePacker.prototype._findNode = function (node, { width, height }) {
       width: nodeWidth,
       height,
     });
-    node.childNode2 = new TextureNode({
-      x: rectangle.x,
-      y: rectangle.y + height,
-      width: nodeWidth,
-      height: heightDifference,
-    });
+
+    // Apply padding only along the horizontal "cut".
+    const heightDifferencePadded = heightDifference - borderPadding;
+
+    if (heightDifferencePadded > 0) {
+      node.childNode2 = new TextureNode({
+        x: rectangle.x,
+        y: rectangle.y + height + borderPadding,
+        width: nodeWidth,
+        height: heightDifferencePadded,
+      });
+    }
+
     return this._findNode(node.childNode1, { width, height });
   }
 

package/Source/Core/Transforms.js

@@ -1131,23 +1131,32 @@ Transforms.rotationMatrixFromPositionVelocity = function (
   return result;
 };
 
-const swizzleMatrix = new Matrix4(
-  0.0,
-  0.0,
-  1.0,
-  0.0,
-  1.0,
-  0.0,
-  0.0,
-  0.0,
-  0.0,
-  1.0,
-  0.0,
-  0.0,
-  0.0,
-  0.0,
-  0.0,
-  1.0,
+/**
+ * An immutable matrix that swaps x, y, z for 2D.
+ *
+ * @type {Matrix4}
+ * @constant
+ * @private
+ */
+Transforms.SWIZZLE_3D_TO_2D_MATRIX = Object.freeze(
+  new Matrix4(
+    0.0,
+    0.0,
+    1.0,
+    0.0,
+    1.0,
+    0.0,
+    0.0,
+    0.0,
+    0.0,
+    1.0,
+    0.0,
+    0.0,
+    0.0,
+    0.0,
+    0.0,
+    1.0,
+  ),
 );
 
 const scratchCartographic = new Cartographic();
@@ -1210,7 +1219,7 @@ Transforms.basisTo2D = function (projection, matrix, result) {
   const toENU = Matrix4.inverseTransformation(fromENU, scratchToENU);
   const rotation = Matrix4.getMatrix3(matrix, scratchRotation);
   const local = Matrix4.multiplyByMatrix3(toENU, rotation, result);
-  Matrix4.multiply(swizzleMatrix, local, result); // Swap x, y, z for 2D
+  Matrix4.multiply(Transforms.SWIZZLE_3D_TO_2D_MATRIX, local, result); // Swap x, y, z for 2D
   Matrix4.setTranslation(result, projectedPosition, result); // Use the projected center
 
   return result;
@@ -1260,7 +1269,7 @@ Transforms.ellipsoidTo2DModelMatrix = function (projection, center, result) {
     projectedPosition,
     scratchFromENU,
   );
-  Matrix4.multiply(swizzleMatrix, toENU, result);
+  Matrix4.multiply(Transforms.SWIZZLE_3D_TO_2D_MATRIX, toENU, result);
   Matrix4.multiply(translation, result, result);
 
   return result;

package/Source/Core/VRTheWorldTerrainProvider.js

@@ -20,7 +20,7 @@ function DataRectangle(rectangle, maxLevel) {
 }
 
 /**
- * @typedef {Object} VRTheWorldTerrainProvider.ConstructorOptions
+ * @typedef {object} VRTheWorldTerrainProvider.ConstructorOptions
  *
  * Initialization options for the VRTheWorldTerrainProvider constructor
  *
@@ -265,7 +265,7 @@ Object.defineProperties(VRTheWorldTerrainProvider.prototype, {
  * Creates a {@link TerrainProvider} that produces terrain geometry by tessellating height maps
  * retrieved from a {@link http://vr-theworld.com/|VT MÄK VR-TheWorld server}.
  *
- * @param {Resource|String} url The URL of the VR-TheWorld TileMap.
+ * @param {Resource|string} url The URL of the VR-TheWorld TileMap.
  * @param {VRTheWorldTerrainProvider.ConstructorOptions} [options] An object describing initialization options.
  * @returns {Promise<VRTheWorldTerrainProvider>}
  *

package/Source/Core/binarySearch.js

@@ -4,7 +4,7 @@ import Check from "./Check.js";
  * Finds an item in a sorted array.
  *
  * @function
- * @param {Array} array The sorted array to search.
+ * @param {Array|Int8Array|Uint8Array|Int16Array|Uint16Array|Int32Array|Uint32Array|Float32Array|Float64Array} array The sorted array to search.
  * @param {*} itemToFind The item to find in the array.
  * @param {binarySearchComparator} comparator The function to use to compare the item to
  *        elements in the array.

package/Source/Core/createWorldBathymetryAsync.js

@@ -6,8 +6,8 @@ import Frozen from "./Frozen.js";
  *
  * @function
  *
- * @param {Object} [options] Object with the following properties:
- * @param {Boolean} [options.requestVertexNormals=false] Flag that indicates if the client should request additional lighting information from the server if available.
+ * @param {object} [options] Object with the following properties:
+ * @param {boolean} [options.requestVertexNormals=false] Flag that indicates if the client should request additional lighting information from the server if available.
  * @returns {Promise<CesiumTerrainProvider>} A promise that resolves to the created CesiumTerrainProvider
  *
  * @see Ion

package/Source/Core/createWorldTerrainAsync.js

@@ -7,9 +7,9 @@ import Ellipsoid from "./Ellipsoid.js";
  *
  * @function
  *
- * @param {Object} [options] Object with the following properties:
- * @param {Boolean} [options.requestVertexNormals=false] Flag that indicates if the client should request additional lighting information from the server if available.
- * @param {Boolean} [options.requestWaterMask=false] Flag that indicates if the client should request per tile water masks from the server if available.
+ * @param {object} [options] Object with the following properties:
+ * @param {boolean} [options.requestVertexNormals=false] Flag that indicates if the client should request additional lighting information from the server if available.
+ * @param {boolean} [options.requestWaterMask=false] Flag that indicates if the client should request per tile water masks from the server if available.
  * @returns {Promise<CesiumTerrainProvider>} A promise that resolves to the created CesiumTerrainProvider
  *
  * @see Ion

package/Source/Core/loadImageFromTypedArray.js

@@ -3,12 +3,18 @@ import defined from "./defined.js";
 import Resource from "./Resource.js";
 
 /**
+ * Loads an image from a typed array.
+ * @param {Object} options An object containing the following properties:
+ * @param {Uint8Array} options.uint8Array The typed array containing the image data.
+ * @param {string} options.format The MIME format of the image (e.g., "image/png").
+ * @param {Request} [options.request] The request object to use to fetch the image.
+ * @param {boolean} [options.flipY=false] Whether to flip the image vertically.
+ * @param {boolean} [options.skipColorSpaceConversion=false] Whether to skip color space conversion.
+ * @returns {Promise<HTMLImageElement|HTMLCanvasElement|ImageBitmap>|undefined} A promise that resolves to the loaded image. Returns undefined if <code>request.throttle</code> is true and the request does not have high enough priority.
  * @private
  */
 function loadImageFromTypedArray(options) {
-  const uint8Array = options.uint8Array;
-  const format = options.format;
-  const request = options.request;
+  const { uint8Array, format, request } = options;
   const flipY = options.flipY ?? false;
   const skipColorSpaceConversion = options.skipColorSpaceConversion ?? false;
   //>>includeStart('debug', pragmas.debug);

package/Source/Core/mergeSort.js

@@ -56,7 +56,7 @@ function sort(array, compare, userDefinedObject, start, end) {
  * A stable merge sort.
  *
  * @function mergeSort
- * @param {Array} array The array to sort.
+ * @param {Array|Int8Array|Uint8Array|Int16Array|Uint16Array|Int32Array|Uint32Array|Float32Array|Float64Array} array The array to sort.
  * @param {mergeSortComparator} comparator The function to use to compare elements in the array.
  * @param {*} [userDefinedObject] Any item to pass as the third parameter to <code>comparator</code>.
  *

package/Source/DataSources/BillboardGraphics.js

@@ -10,7 +10,7 @@ import createPropertyDescriptor from "./createPropertyDescriptor.js";
  * Initialization options for the BillboardGraphics constructor
  *
  * @property {Property | boolean} [show=true] A boolean Property specifying the visibility of the billboard.
- * @property {Property | string | HTMLCanvasElement} [image] A Property specifying the Image, URI, or Canvas to use for the billboard.
+ * @property {Property | string | HTMLImageElement | HTMLCanvasElement} [image] A Property specifying the Image, URI, or Canvas to use for the billboard.
  * @property {Property | number} [scale=1.0] A numeric Property specifying the scale to apply to the image size.
  * @property {Property | Cartesian2} [pixelOffset=Cartesian2.ZERO] A {@link Cartesian2} Property specifying the pixel offset.
  * @property {Property | Cartesian3} [eyeOffset=Cartesian3.ZERO] A {@link Cartesian3} Property specifying the eye offset.

package/Source/DataSources/BillboardVisualizer.js

@@ -131,10 +131,6 @@ BillboardVisualizer.prototype.update = function (time) {
     }
 
     billboard.show = show;
-    if (item.textureValue !== textureValue) {
-      billboard.image = textureValue;
-      item.textureValue = textureValue;
-    }
     billboard.position = position;
     billboard.color = Property.getValueOrDefault(
       billboardGraphics._color,
@@ -227,6 +223,13 @@ BillboardVisualizer.prototype.update = function (time) {
       defaultSplitDirection,
     );
 
+    // Apply .image last, so any necessary property values are available
+    // in Billboard#_computeImageTextureSize before adding to the atlas.
+    if (item.textureValue !== textureValue) {
+      billboard.image = textureValue;
+      item.textureValue = textureValue;
+    }
+
     const subRegion = Property.getValueOrUndefined(
       billboardGraphics._imageSubRegion,
       time,

package/Source/DataSources/PropertyArray.js

@@ -66,8 +66,8 @@ const timeScratch = new JulianDate();
  * Gets the value of the property.
  *
  * @param {JulianDate} [time=JulianDate.now()] The time for which to retrieve the value. If omitted, the current system time is used.
- * @param {Object[]} [result] The object to store the value into, if omitted, a new instance is created and returned.
- * @returns {Object[]} The modified result parameter, which is an array of values produced by evaluating each of the contained properties at the given time or a new instance if the result parameter was not supplied.
+ * @param {object[]} [result] The object to store the value into, if omitted, a new instance is created and returned.
+ * @returns {object[]} The modified result parameter, which is an array of values produced by evaluating each of the contained properties at the given time or a new instance if the result parameter was not supplied.
  */
 PropertyArray.prototype.getValue = function (time, result) {
   if (!defined(time)) {

package/Source/Renderer/AutomaticUniforms.js

@@ -161,6 +161,67 @@ const AutomaticUniforms = {
     },
   }),
 
+  /**
+   * An automatic GLSL uniform representing a texture containing edge IDs
+   * from the 3D Tiles edge rendering pass. Used for edge detection and
+   * avoiding z-fighting between edges and surfaces.
+   *
+   * @example
+   * // GLSL declaration
+   * uniform sampler2D czm_edgeIdTexture;
+   *
+   * // Get the edge ID at the current fragment
+   * vec2 coords = gl_FragCoord.xy / czm_viewport.zw;
+   * vec4 edgeId = texture(czm_edgeIdTexture, coords);
+   */
+  czm_edgeIdTexture: new AutomaticUniform({
+    size: 1,
+    datatype: WebGLConstants.SAMPLER_2D,
+    getValue: function (uniformState) {
+      return uniformState.edgeIdTexture;
+    },
+  }),
+
+  /**
+   * An automatic GLSL uniform containing the edge color texture.
+   * This texture contains the edge content rendered during the CESIUM_3D_TILE_EDGES pass.
+   *
+   * @example
+   * // GLSL declaration
+   * uniform sampler2D czm_edgeColorTexture;
+   *
+   * // Sample the edge color at the current fragment
+   * vec2 coords = gl_FragCoord.xy / czm_viewport.zw;
+   * vec4 edgeColor = texture(czm_edgeColorTexture, coords);
+   */
+  czm_edgeColorTexture: new AutomaticUniform({
+    size: 1,
+    datatype: WebGLConstants.SAMPLER_2D,
+    getValue: function (uniformState) {
+      return uniformState.edgeColorTexture;
+    },
+  }),
+
+  /**
+   * An automatic GLSL uniform containing the packed depth texture produced by the
+   * edge visibility pass. The depth is packed via czm_packDepth and should be
+   * unpacked with czm_unpackDepth.
+   *
+   * @example
+   * // GLSL declaration
+   * uniform sampler2D czm_edgeDepthTexture;
+   *
+   * vec2 coords = gl_FragCoord.xy / czm_viewport.zw;
+   * float d = czm_unpackDepth(texture(czm_edgeDepthTexture, coords));
+   */
+  czm_edgeDepthTexture: new AutomaticUniform({
+    size: 1,
+    datatype: WebGLConstants.SAMPLER_2D,
+    getValue: function (uniformState) {
+      return uniformState.edgeDepthTexture;
+    },
+  }),
+
   /**
    * An automatic GLSL uniform representing a 4x4 model transformation matrix that
    * transforms model coordinates to world coordinates.

package/Source/Renderer/Buffer.js

@@ -72,6 +72,26 @@ function Buffer(options) {
   this.vertexArrayDestroyable = true;
 }
 
+Buffer.createPixelBuffer = function (options) {
+  //>>includeStart('debug', pragmas.debug);
+  Check.defined("options.context", options.context);
+  //>>includeEnd('debug');
+
+  if (!options.context._webgl2) {
+    throw new DeveloperError(
+      "A WebGL 2 context is required to create PixelBuffers.",
+    );
+  }
+
+  return new Buffer({
+    context: options.context,
+    bufferTarget: WebGLConstants.PIXEL_PACK_BUFFER,
+    typedArray: options.typedArray,
+    sizeInBytes: options.sizeInBytes,
+    usage: options.usage,
+  });
+};
+
 /**
  * Creates a vertex buffer, which contains untyped vertex data in GPU-controlled memory.
  * <br /><br />
@@ -242,6 +262,18 @@ Buffer.prototype._getBuffer = function () {
   return this._buffer;
 };
 
+Buffer.prototype._bind = function () {
+  const gl = this._gl;
+  const target = this._bufferTarget;
+  gl.bindBuffer(target, this._buffer);
+};
+
+Buffer.prototype._unBind = function () {
+  const gl = this._gl;
+  const target = this._bufferTarget;
+  gl.bindBuffer(target, null);
+};
+
 Buffer.prototype.copyFromArrayView = function (arrayView, offsetInBytes) {
   offsetInBytes = offsetInBytes ?? 0;
 

package/Source/Renderer/BufferUsage.js

@@ -7,12 +7,14 @@ const BufferUsage = {
   STREAM_DRAW: WebGLConstants.STREAM_DRAW,
   STATIC_DRAW: WebGLConstants.STATIC_DRAW,
   DYNAMIC_DRAW: WebGLConstants.DYNAMIC_DRAW,
+  DYNAMIC_READ: WebGLConstants.DYNAMIC_READ,
 
   validate: function (bufferUsage) {
     return (
       bufferUsage === BufferUsage.STREAM_DRAW ||
       bufferUsage === BufferUsage.STATIC_DRAW ||
-      bufferUsage === BufferUsage.DYNAMIC_DRAW
+      bufferUsage === BufferUsage.DYNAMIC_DRAW ||
+      bufferUsage === BufferUsage.DYNAMIC_READ
     );
   },
 };