@cesium/engine 10.1.0 → 11.1.0

package/Source/Scene/Scene.js

@@ -57,7 +57,6 @@ import GlobeTranslucencyState from "./GlobeTranslucencyState.js";
 import InvertClassification from "./InvertClassification.js";
 import JobScheduler from "./JobScheduler.js";
 import MapMode2D from "./MapMode2D.js";
-import OctahedralProjectedCubeMap from "./OctahedralProjectedCubeMap.js";
 import PerformanceDisplay from "./PerformanceDisplay.js";
 import PerInstanceColorAppearance from "./PerInstanceColorAppearance.js";
 import Picking from "./Picking.js";
@@ -69,6 +68,7 @@ import SceneTransforms from "./SceneTransforms.js";
 import SceneTransitioner from "./SceneTransitioner.js";
 import ScreenSpaceCameraController from "./ScreenSpaceCameraController.js";
 import ShadowMap from "./ShadowMap.js";
+import SpecularEnvironmentCubeMap from "./SpecularEnvironmentCubeMap.js";
 import StencilConstants from "./StencilConstants.js";
 import SunLight from "./SunLight.js";
 import SunPostProcess from "./SunPostProcess.js";
@@ -77,6 +77,8 @@ import View from "./View.js";
 import DebugInspector from "./DebugInspector.js";
 import VoxelCell from "./VoxelCell.js";
 import VoxelPrimitive from "./VoxelPrimitive.js";
+import getMetadataClassProperty from "./getMetadataClassProperty.js";
+import PickedMetadataInfo from "./PickedMetadataInfo.js";
 
 const requestRenderAfterFrame = function (scene) {
   return function () {
@@ -107,7 +109,7 @@ const requestRenderAfterFrame = function (scene) {
  * @param {boolean} [options.requestRenderMode=false] If true, rendering a frame will only occur when needed as determined by changes within the scene. Enabling improves performance of the application, but requires using {@link Scene#requestRender} to render a new frame explicitly in this mode. This will be necessary in many cases after making changes to the scene in other parts of the API. See {@link https://cesium.com/blog/2018/01/24/cesium-scene-rendering-performance/|Improving Performance with Explicit Rendering}.
  * @param {number} [options.maximumRenderTimeChange=0.0] If requestRenderMode is true, this value defines the maximum change in simulation time allowed before a render is requested. See {@link https://cesium.com/blog/2018/01/24/cesium-scene-rendering-performance/|Improving Performance with Explicit Rendering}.
  * @param {number} [options.depthPlaneEllipsoidOffset=0.0] Adjust the DepthPlane to address rendering artefacts below ellipsoid zero elevation.
- * @param {number} [options.msaaSamples=1] If provided, this value controls the rate of multisample antialiasing. Typical multisampling rates are 2, 4, and sometimes 8 samples per pixel. Higher sampling rates of MSAA may impact performance in exchange for improved visual quality. This value only applies to WebGL2 contexts that support multisample render targets.
+ * @param {number} [options.msaaSamples=4] If provided, this value controls the rate of multisample antialiasing. Typical multisampling rates are 2, 4, and sometimes 8 samples per pixel. Higher sampling rates of MSAA may impact performance in exchange for improved visual quality. This value only applies to WebGL2 contexts that support multisample render targets. Set to 1 to disable MSAA.
  *
  * @see CesiumWidget
  * @see {@link http://www.khronos.org/registry/webgl/specs/latest/#5.2|WebGLContextAttributes}
@@ -157,7 +159,7 @@ function Scene(options) {
   this._frameState = new FrameState(
     context,
     new CreditDisplay(creditContainer, "•", creditViewport),
-    this._jobScheduler
+    this._jobScheduler,
   );
   this._frameState.scene3DOnly = defaultValue(options.scene3DOnly, false);
   this._removeCreditContainer = !hasCreditContainer;
@@ -191,6 +193,12 @@ function Scene(options) {
   this._overlayCommandList = [];
 
   this._useOIT = defaultValue(options.orderIndependentTranslucency, true);
+  /**
+   * The function that will be used for executing translucent commands when
+   * useOIT is true. This is created once in
+   * obtainTranslucentCommandExecutionFunction, then cached here.
+   * @private
+   */
   this._executeOITFunction = undefined;
 
   this._depthPlane = new DepthPlane(options.depthPlaneEllipsoidOffset);
@@ -228,7 +236,7 @@ function Scene(options) {
   this._minimumDisableDepthTestDistance = 0.0;
   this._debugInspector = new DebugInspector();
 
-  this._msaaSamples = defaultValue(options.msaaSamples, 1);
+  this._msaaSamples = defaultValue(options.msaaSamples, 4);
 
   /**
    * Exceptions occurring in <code>render</code> are always caught in order to raise the
@@ -547,7 +555,7 @@ function Scene(options) {
       -45.0,
       -45.0,
       45.0,
-      45.0
+      45.0,
     );
   }
 
@@ -581,7 +589,7 @@ function Scene(options) {
   this.invertClassificationColor = Color.clone(Color.WHITE);
 
   this._actualInvertClassificationColor = Color.clone(
-    this._invertClassificationColor
+    this._invertClassificationColor,
   );
   this._invertClassification = new InvertClassification();
 
@@ -677,17 +685,19 @@ function Scene(options) {
    */
   this.maximumRenderTimeChange = defaultValue(
     options.maximumRenderTimeChange,
-    0.0
+    0.0,
   );
   this._lastRenderTime = undefined;
   this._frameRateMonitor = undefined;
 
-  this._removeRequestListenerCallback = RequestScheduler.requestCompletedEvent.addEventListener(
-    requestRenderAfterFrame(this)
-  );
-  this._removeTaskProcessorListenerCallback = TaskProcessor.taskCompletedEvent.addEventListener(
-    requestRenderAfterFrame(this)
-  );
+  this._removeRequestListenerCallback =
+    RequestScheduler.requestCompletedEvent.addEventListener(
+      requestRenderAfterFrame(this),
+    );
+  this._removeTaskProcessorListenerCallback =
+    TaskProcessor.taskCompletedEvent.addEventListener(
+      requestRenderAfterFrame(this),
+    );
   this._removeGlobeCallbacks = [];
   this._removeTerrainProviderReadyListener = undefined;
 
@@ -695,7 +705,7 @@ function Scene(options) {
     0,
     0,
     context.drawingBufferWidth,
-    context.drawingBufferHeight
+    context.drawingBufferHeight,
   );
   const camera = new Camera(this);
 
@@ -738,7 +748,7 @@ function Scene(options) {
    * @type {string}
    */
   this.specularEnvironmentMaps = undefined;
-  this._specularEnvironmentMapAtlas = undefined;
+  this._specularEnvironmentCubeMap = undefined;
 
   /**
    * The light source for shading. Defaults to a directional light from the Sun.
@@ -768,13 +778,13 @@ function updateGlobeListeners(scene, globe) {
   if (defined(globe)) {
     removeGlobeCallbacks.push(
       globe.imageryLayersUpdatedEvent.addEventListener(
-        requestRenderAfterFrame(scene)
-      )
+        requestRenderAfterFrame(scene),
+      ),
     );
     removeGlobeCallbacks.push(
       globe.terrainProviderChanged.addEventListener(
-        requestRenderAfterFrame(scene)
-      )
+        requestRenderAfterFrame(scene),
+      ),
     );
   }
   scene._removeGlobeCallbacks = removeGlobeCallbacks;
@@ -927,7 +937,7 @@ Object.defineProperties(Scene.prototype, {
    */
   specularEnvironmentMapsSupported: {
     get: function () {
-      return OctahedralProjectedCubeMap.isSupported(this._context);
+      return SpecularEnvironmentCubeMap.isSupported(this._context);
     },
   },
 
@@ -1398,7 +1408,7 @@ Object.defineProperties(Scene.prototype, {
       //>>includeStart('debug', pragmas.debug);
       if (this.scene3DOnly && value !== SceneMode.SCENE3D) {
         throw new DeveloperError(
-          "Only SceneMode.SCENE3D is valid when scene3DOnly is true."
+          "Only SceneMode.SCENE3D is valid when scene3DOnly is true.",
         );
       }
       //>>includeEnd('debug');
@@ -1411,7 +1421,7 @@ Object.defineProperties(Scene.prototype, {
         //>>includeStart('debug', pragmas.debug);
       } else {
         throw new DeveloperError(
-          "value must be a valid SceneMode enumeration."
+          "value must be a valid SceneMode enumeration.",
         );
         //>>includeEnd('debug');
       }
@@ -1460,7 +1470,7 @@ Object.defineProperties(Scene.prototype, {
       //>>includeStart('debug', pragmas.debug);
       if (this.camera.frustum instanceof OrthographicFrustum) {
         throw new DeveloperError(
-          "VR is unsupported with an orthographic projection."
+          "VR is unsupported with an orthographic projection.",
         );
       }
       //>>includeEnd('debug');
@@ -1469,9 +1479,8 @@ Object.defineProperties(Scene.prototype, {
         this._frameState.creditDisplay.container.style.visibility = "hidden";
         this._cameraVR = new Camera(this);
         if (!defined(this._deviceOrientationCameraController)) {
-          this._deviceOrientationCameraController = new DeviceOrientationCameraController(
-            this
-          );
+          this._deviceOrientationCameraController =
+            new DeviceOrientationCameraController(this);
         }
 
         this._aspectRatioVR = this.camera.frustum.aspectRatio;
@@ -1533,7 +1542,7 @@ Object.defineProperties(Scene.prototype, {
       //>>includeStart('debug', pragmas.debug);
       if (!defined(value) || value < 0.0) {
         throw new DeveloperError(
-          "minimumDisableDepthTestDistance must be greater than or equal to 0.0."
+          "minimumDisableDepthTestDistance must be greater than or equal to 0.0.",
         );
       }
       //>>includeEnd('debug');
@@ -1630,7 +1639,7 @@ Object.defineProperties(Scene.prototype, {
    * The sample rate of multisample antialiasing (values greater than 1 enable MSAA).
    * @memberof Scene.prototype
    * @type {number}
-   * @default 1
+   * @default 4
    */
   msaaSamples: {
     get: function () {
@@ -1714,12 +1723,28 @@ Scene.prototype.getCompressedTextureFormatSupported = function (format) {
   );
 };
 
+function pickedMetadataInfoChanged(command, frameState) {
+  const oldPickedMetadataInfo = command.pickedMetadataInfo;
+  const newPickedMetadataInfo = frameState.pickedMetadataInfo;
+  if (oldPickedMetadataInfo?.schemaId !== newPickedMetadataInfo?.schemaId) {
+    return true;
+  }
+  if (oldPickedMetadataInfo?.className !== newPickedMetadataInfo?.className) {
+    return true;
+  }
+  if (
+    oldPickedMetadataInfo?.propertyName !== newPickedMetadataInfo?.propertyName
+  ) {
+    return true;
+  }
+  return false;
+}
+
 function updateDerivedCommands(scene, command, shadowsDirty) {
   const frameState = scene._frameState;
   const context = scene._context;
   const oit = scene._view.oit;
-  const lightShadowMaps = frameState.shadowState.lightShadowMaps;
-  const lightShadowsEnabled = frameState.shadowState.lightShadowsEnabled;
+  const { lightShadowMaps, lightShadowsEnabled } = frameState.shadowState;
 
   let derivedCommands = command.derivedCommands;
 
@@ -1728,16 +1753,27 @@ function updateDerivedCommands(scene, command, shadowsDirty) {
       scene,
       command,
       context,
-      derivedCommands.picking
+      derivedCommands.picking,
     );
   }
-
+  if (frameState.pickingMetadata && command.pickMetadataAllowed) {
+    command.pickedMetadataInfo = frameState.pickedMetadataInfo;
+    if (defined(command.pickedMetadataInfo)) {
+      derivedCommands.pickingMetadata =
+        DerivedCommand.createPickMetadataDerivedCommand(
+          scene,
+          command,
+          context,
+          derivedCommands.pickingMetadata,
+        );
+    }
+  }
   if (!command.pickOnly) {
     derivedCommands.depth = DerivedCommand.createDepthOnlyDerivedCommand(
       scene,
       command,
       context,
-      derivedCommands.depth
+      derivedCommands.depth,
     );
   }
 
@@ -1747,7 +1783,7 @@ function updateDerivedCommands(scene, command, shadowsDirty) {
     derivedCommands.hdr = DerivedCommand.createHdrCommand(
       command,
       context,
-      derivedCommands.hdr
+      derivedCommands.hdr,
     );
     command = derivedCommands.hdr.command;
     derivedCommands = command.derivedCommands;
@@ -1759,7 +1795,7 @@ function updateDerivedCommands(scene, command, shadowsDirty) {
       command,
       shadowsDirty,
       context,
-      derivedCommands.shadows
+      derivedCommands.shadows,
     );
   }
 
@@ -1771,13 +1807,13 @@ function updateDerivedCommands(scene, command, shadowsDirty) {
       derivedCommands.oit.shadows = oit.createDerivedCommands(
         derivedCommands.shadows.receiveCommand,
         context,
-        derivedCommands.oit.shadows
+        derivedCommands.oit.shadows,
       );
     } else {
       derivedCommands.oit = oit.createDerivedCommands(
         command,
         context,
-        derivedCommands.oit
+        derivedCommands.oit,
       );
     }
   }
@@ -1787,26 +1823,26 @@ function updateDerivedCommands(scene, command, shadowsDirty) {
  * @private
  */
 Scene.prototype.updateDerivedCommands = function (command) {
-  if (!defined(command.derivedCommands)) {
+  const { derivedCommands } = command;
+  if (!defined(derivedCommands)) {
     // Is not a DrawCommand
     return;
   }
 
   const frameState = this._frameState;
+  const { shadowState, useLogDepth } = this._frameState;
   const context = this._context;
 
   // Update derived commands when any shadow maps become dirty
   let shadowsDirty = false;
-  const lastDirtyTime = frameState.shadowState.lastDirtyTime;
+  const lastDirtyTime = shadowState.lastDirtyTime;
   if (command.lastDirtyTime !== lastDirtyTime) {
     command.lastDirtyTime = lastDirtyTime;
     command.dirty = true;
     shadowsDirty = true;
   }
 
-  const useLogDepth = frameState.useLogDepth;
   const useHdr = this._hdr;
-  const derivedCommands = command.derivedCommands;
   const hasLogDepthDerivedCommands = defined(derivedCommands.logDepth);
   const hasHdrCommands = defined(derivedCommands.hdr);
   const hasDerivedCommands = defined(derivedCommands.originalCommand);
@@ -1814,42 +1850,43 @@ Scene.prototype.updateDerivedCommands = function (command) {
     useLogDepth && !hasLogDepthDerivedCommands;
   const needsHdrCommands = useHdr && !hasHdrCommands;
   const needsDerivedCommands = (!useLogDepth || !useHdr) && !hasDerivedCommands;
+  const needsUpdateForMetadataPicking =
+    frameState.pickingMetadata &&
+    pickedMetadataInfoChanged(command, frameState);
   command.dirty =
     command.dirty ||
     needsLogDepthDerivedCommands ||
     needsHdrCommands ||
-    needsDerivedCommands;
+    needsDerivedCommands ||
+    needsUpdateForMetadataPicking;
 
-  if (command.dirty) {
-    command.dirty = false;
+  if (!command.dirty) {
+    return;
+  }
 
-    const shadowMaps = frameState.shadowState.shadowMaps;
-    const shadowsEnabled = frameState.shadowState.shadowsEnabled;
-    if (shadowsEnabled && command.castShadows) {
-      derivedCommands.shadows = ShadowMap.createCastDerivedCommand(
-        shadowMaps,
-        command,
-        shadowsDirty,
-        context,
-        derivedCommands.shadows
-      );
-    }
+  command.dirty = false;
 
-    if (hasLogDepthDerivedCommands || needsLogDepthDerivedCommands) {
-      derivedCommands.logDepth = DerivedCommand.createLogDepthCommand(
-        command,
-        context,
-        derivedCommands.logDepth
-      );
-      updateDerivedCommands(
-        this,
-        derivedCommands.logDepth.command,
-        shadowsDirty
-      );
-    }
-    if (hasDerivedCommands || needsDerivedCommands) {
-      updateDerivedCommands(this, command, shadowsDirty);
-    }
+  const { shadowsEnabled, shadowMaps } = shadowState;
+  if (shadowsEnabled && command.castShadows) {
+    derivedCommands.shadows = ShadowMap.createCastDerivedCommand(
+      shadowMaps,
+      command,
+      shadowsDirty,
+      context,
+      derivedCommands.shadows,
+    );
+  }
+
+  if (hasLogDepthDerivedCommands || needsLogDepthDerivedCommands) {
+    derivedCommands.logDepth = DerivedCommand.createLogDepthCommand(
+      command,
+      context,
+      derivedCommands.logDepth,
+    );
+    updateDerivedCommands(this, derivedCommands.logDepth.command, shadowsDirty);
+  }
+  if (hasDerivedCommands || needsDerivedCommands) {
+    updateDerivedCommands(this, command, shadowsDirty);
   }
 };
 
@@ -1871,31 +1908,34 @@ const requestRenderModeDeferCheckPassState = new Cesium3DTilePassState({
 
 const scratchOccluderBoundingSphere = new BoundingSphere();
 let scratchOccluder;
-
+/**
+ * Get the central body occluder for the scene.
+ * Assumes only one central body occluder, the top-level globe.
+ *
+ * @param {Scene} scene
+ * @returns {Occluder|undefined}
+ *
+ * @private
+ */
 function getOccluder(scene) {
-  // TODO: The occluder is the top-level globe. When we add
-  //       support for multiple central bodies, this should be the closest one.
-  const globe = scene.globe;
   if (
-    scene._mode === SceneMode.SCENE3D &&
-    defined(globe) &&
-    globe.show &&
-    !scene._cameraUnderground &&
-    !scene._globeTranslucencyState.translucent
+    scene._mode !== SceneMode.SCENE3D ||
+    !scene.globe?.show ||
+    scene._cameraUnderground ||
+    scene._globeTranslucencyState.translucent
   ) {
-    const ellipsoid = scene.ellipsoid;
-    const minimumTerrainHeight = scene.frameState.minimumTerrainHeight;
-    scratchOccluderBoundingSphere.radius =
-      ellipsoid.minimumRadius + minimumTerrainHeight;
-    scratchOccluder = Occluder.fromBoundingSphere(
-      scratchOccluderBoundingSphere,
-      scene.camera.positionWC,
-      scratchOccluder
-    );
-    return scratchOccluder;
+    return undefined;
   }
 
-  return undefined;
+  scratchOccluderBoundingSphere.radius =
+    scene.ellipsoid.minimumRadius + scene.frameState.minimumTerrainHeight;
+  scratchOccluder = Occluder.fromBoundingSphere(
+    scratchOccluderBoundingSphere,
+    scene.camera.positionWC,
+    scratchOccluder,
+  );
+
+  return scratchOccluder;
 }
 
 /**
@@ -1935,11 +1975,12 @@ Scene.prototype.updateFrameState = function () {
   frameState.cullingVolume = camera.frustum.computeCullingVolume(
     camera.positionWC,
     camera.directionWC,
-    camera.upWC
+    camera.upWC,
   );
   frameState.occluder = getOccluder(this);
   frameState.minimumTerrainHeight = 0.0;
-  frameState.minimumDisableDepthTestDistance = this._minimumDisableDepthTestDistance;
+  frameState.minimumDisableDepthTestDistance =
+    this._minimumDisableDepthTestDistance;
   frameState.invertClassification = this.invertClassification;
   frameState.useLogDepth =
     this._logDepthBuffer &&
@@ -1961,14 +2002,17 @@ Scene.prototype.updateFrameState = function () {
     globe._terrainExaggerationChanged = false;
   }
   frameState.verticalExaggeration = this.verticalExaggeration;
-  frameState.verticalExaggerationRelativeHeight = this.verticalExaggerationRelativeHeight;
+  frameState.verticalExaggerationRelativeHeight =
+    this.verticalExaggerationRelativeHeight;
 
   if (
-    defined(this._specularEnvironmentMapAtlas) &&
-    this._specularEnvironmentMapAtlas.ready
+    defined(this._specularEnvironmentCubeMap) &&
+    this._specularEnvironmentCubeMap.ready
   ) {
-    frameState.specularEnvironmentMaps = this._specularEnvironmentMapAtlas.texture;
-    frameState.specularEnvironmentMapsMaximumLOD = this._specularEnvironmentMapAtlas.maximumMipmapLevel;
+    frameState.specularEnvironmentMaps =
+      this._specularEnvironmentCubeMap.texture;
+    frameState.specularEnvironmentMapsMaximumLOD =
+      this._specularEnvironmentCubeMap.maximumMipmapLevel;
   } else {
     frameState.specularEnvironmentMaps = undefined;
     frameState.specularEnvironmentMapsMaximumLOD = undefined;
@@ -1978,7 +2022,7 @@ Scene.prototype.updateFrameState = function () {
 
   this._actualInvertClassificationColor = Color.clone(
     this.invertClassificationColor,
-    this._actualInvertClassificationColor
+    this._actualInvertClassificationColor,
   );
   if (!InvertClassification.isTranslucencySupported(this._context)) {
     this._actualInvertClassificationColor.alpha = 1.0;
@@ -1998,18 +2042,31 @@ Scene.prototype.updateFrameState = function () {
 };
 
 /**
+ * Check whether a draw command will render anything visible in the current Scene,
+ * based on its bounding volume.
+ *
+ * @param {CullingVolume} cullingVolume The culling volume of the current Scene.
+ * @param {DrawCommand} [command] The draw command
+ * @param {Occluder} [occluder] An occluder that may be in front of the command's bounding volume.
+ * @returns {boolean} <code>true</code> if the command's bounding volume is visible in the scene.
+ *
  * @private
  */
-Scene.prototype.isVisible = function (command, cullingVolume, occluder) {
+Scene.prototype.isVisible = function (cullingVolume, command, occluder) {
+  if (!defined(command)) {
+    return false;
+  }
+  const { boundingVolume } = command;
+  if (!defined(boundingVolume) || !command.cull) {
+    return true;
+  }
+  if (cullingVolume.computeVisibility(boundingVolume) === Intersect.OUTSIDE) {
+    return false;
+  }
   return (
-    defined(command) &&
-    (!defined(command.boundingVolume) ||
-      !command.cull ||
-      (cullingVolume.computeVisibility(command.boundingVolume) !==
-        Intersect.OUTSIDE &&
-        (!defined(occluder) ||
-          !command.occlude ||
-          !command.boundingVolume.isOccluded(occluder))))
+    !defined(occluder) ||
+    !command.occlude ||
+    !boundingVolume.isOccluded(occluder)
   );
 };
 
@@ -2029,16 +2086,25 @@ let transformFrom2D = new Matrix4(
   0.0,
   0.0,
   0.0,
-  1.0
+  1.0,
 );
 transformFrom2D = Matrix4.inverseTransformation(
   transformFrom2D,
-  transformFrom2D
+  transformFrom2D,
 );
 
+/**
+ * Debug code to draw bounding volume for command.  Not optimized!
+ * Assumes bounding volume is a bounding sphere or box.
+ *
+ * @param {DrawCommand} command The draw command for which to render the bounding volume.
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The state for the current render pass.
+ * @param {Framebuffer} debugFramebuffer The framebuffer where the bounding volume will be rendered.
+ *
+ * @private
+ */
 function debugShowBoundingVolume(command, scene, passState, debugFramebuffer) {
-  // Debug code to draw bounding volume for command.  Not optimized!
-  // Assumes bounding volume is a bounding sphere or box
   const frameState = scene._frameState;
   const context = frameState.context;
   const boundingVolume = command.boundingVolume;
@@ -2047,8 +2113,6 @@ function debugShowBoundingVolume(command, scene, passState, debugFramebuffer) {
     scene._debugVolume.destroy();
   }
 
-  let geometry;
-
   let center = Cartesian3.clone(boundingVolume.center);
   if (frameState.mode !== SceneMode.SCENE3D) {
     center = Matrix4.multiplyByPoint(transformFrom2D, center, center);
@@ -2057,63 +2121,44 @@ function debugShowBoundingVolume(command, scene, passState, debugFramebuffer) {
     center = projection.ellipsoid.cartographicToCartesian(centerCartographic);
   }
 
-  if (defined(boundingVolume.radius)) {
-    const radius = boundingVolume.radius;
-
-    geometry = GeometryPipeline.toWireframe(
-      EllipsoidGeometry.createGeometry(
-        new EllipsoidGeometry({
-          radii: new Cartesian3(radius, radius, radius),
-          vertexFormat: PerInstanceColorAppearance.FLAT_VERTEX_FORMAT,
-        })
-      )
-    );
-
-    scene._debugVolume = new Primitive({
-      geometryInstances: new GeometryInstance({
-        geometry: geometry,
-        modelMatrix: Matrix4.fromTranslation(center),
-        attributes: {
-          color: new ColorGeometryInstanceAttribute(1.0, 0.0, 0.0, 1.0),
-        },
-      }),
-      appearance: new PerInstanceColorAppearance({
-        flat: true,
-        translucent: false,
+  let geometry;
+  let modelMatrix;
+  const { radius } = boundingVolume;
+  if (defined(radius)) {
+    geometry = EllipsoidGeometry.createGeometry(
+      new EllipsoidGeometry({
+        radii: new Cartesian3(radius, radius, radius),
+        vertexFormat: PerInstanceColorAppearance.FLAT_VERTEX_FORMAT,
       }),
-      asynchronous: false,
-    });
-  } else {
-    const halfAxes = boundingVolume.halfAxes;
-
-    geometry = GeometryPipeline.toWireframe(
-      BoxGeometry.createGeometry(
-        BoxGeometry.fromDimensions({
-          dimensions: new Cartesian3(2.0, 2.0, 2.0),
-          vertexFormat: PerInstanceColorAppearance.FLAT_VERTEX_FORMAT,
-        })
-      )
     );
-
-    scene._debugVolume = new Primitive({
-      geometryInstances: new GeometryInstance({
-        geometry: geometry,
-        modelMatrix: Matrix4.fromRotationTranslation(
-          halfAxes,
-          center,
-          new Matrix4()
-        ),
-        attributes: {
-          color: new ColorGeometryInstanceAttribute(1.0, 0.0, 0.0, 1.0),
-        },
-      }),
-      appearance: new PerInstanceColorAppearance({
-        flat: true,
-        translucent: false,
+    modelMatrix = Matrix4.fromTranslation(center);
+  } else {
+    geometry = BoxGeometry.createGeometry(
+      BoxGeometry.fromDimensions({
+        dimensions: new Cartesian3(2.0, 2.0, 2.0),
+        vertexFormat: PerInstanceColorAppearance.FLAT_VERTEX_FORMAT,
       }),
-      asynchronous: false,
-    });
+    );
+    modelMatrix = Matrix4.fromRotationTranslation(
+      boundingVolume.halfAxes,
+      center,
+      new Matrix4(),
+    );
   }
+  scene._debugVolume = new Primitive({
+    geometryInstances: new GeometryInstance({
+      geometry: GeometryPipeline.toWireframe(geometry),
+      modelMatrix: modelMatrix,
+      attributes: {
+        color: new ColorGeometryInstanceAttribute(1.0, 0.0, 0.0, 1.0),
+      },
+    }),
+    appearance: new PerInstanceColorAppearance({
+      flat: true,
+      translucent: false,
+    }),
+    asynchronous: false,
+  });
 
   const savedCommandList = frameState.commandList;
   const commandList = (frameState.commandList = []);
@@ -2141,8 +2186,19 @@ function debugShowBoundingVolume(command, scene, passState, debugFramebuffer) {
   frameState.commandList = savedCommandList;
 }
 
-function executeCommand(command, scene, context, passState, debugFramebuffer) {
+/**
+ * Execute a single draw command, or one of its derived commands if appropriate for the current render state.
+ *
+ * @param {DrawCommand} command The command to execute.
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The state for the current render pass.
+ * @param {Framebuffer} debugFramebuffer The framebuffer where debug QCs will be rendered.
+ *
+ * @private
+ */
+function executeCommand(command, scene, passState, debugFramebuffer) {
   const frameState = scene._frameState;
+  const context = scene._context;
 
   if (defined(scene.debugCommandFilter) && !scene.debugCommandFilter(command)) {
     return;
@@ -2174,14 +2230,23 @@ function executeCommand(command, scene, context, passState, debugFramebuffer) {
   }
 
   if (passes.pick || passes.depth) {
-    if (
-      passes.pick &&
-      !passes.depth &&
-      defined(command.derivedCommands.picking)
-    ) {
-      command = command.derivedCommands.picking.pickCommand;
-      command.execute(context, passState);
-      return;
+    if (passes.pick && !passes.depth) {
+      if (
+        frameState.pickingMetadata &&
+        defined(command.derivedCommands.pickingMetadata)
+      ) {
+        command = command.derivedCommands.pickingMetadata.pickMetadataCommand;
+        command.execute(context, passState);
+        return;
+      }
+      if (
+        !frameState.pickingMetadata &&
+        defined(command.derivedCommands.picking)
+      ) {
+        command = command.derivedCommands.picking.pickCommand;
+        command.execute(context, passState);
+        return;
+      }
     } else if (defined(command.derivedCommands.depth)) {
       command = command.derivedCommands.depth.depthOnlyCommand;
       command.execute(context, passState);
@@ -2193,7 +2258,7 @@ function executeCommand(command, scene, context, passState, debugFramebuffer) {
     scene._debugInspector.executeDebugShowFrustumsCommand(
       scene,
       command,
-      passState
+      passState,
     );
     return;
   }
@@ -2212,23 +2277,38 @@ function executeCommand(command, scene, context, passState, debugFramebuffer) {
   }
 }
 
-function executeIdCommand(command, scene, context, passState) {
-  const frameState = scene._frameState;
-  let derivedCommands = command.derivedCommands;
+/**
+ * Execute a single ID draw command, used to render information for picking.
+ *
+ * @param {DrawCommand} command The command to execute.
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The state for the current render pass.
+ *
+ * @private
+ */
+function executeIdCommand(command, scene, passState) {
+  const { derivedCommands } = command;
   if (!defined(derivedCommands)) {
     return;
   }
 
+  const frameState = scene._frameState;
+  const context = scene._context;
+
   if (frameState.useLogDepth && defined(derivedCommands.logDepth)) {
     command = derivedCommands.logDepth.command;
   }
 
-  derivedCommands = command.derivedCommands;
-  if (defined(derivedCommands.picking)) {
-    command = derivedCommands.picking.pickCommand;
+  const { picking, pickingMetadata, depth } = command.derivedCommands;
+  if (defined(pickingMetadata)) {
+    command = derivedCommands.pickingMetadata.pickMetadataCommand;
     command.execute(context, passState);
-  } else if (defined(derivedCommands.depth)) {
-    command = derivedCommands.depth.depthOnlyCommand;
+  }
+  if (defined(picking)) {
+    command = picking.pickCommand;
+    command.execute(context, passState);
+  } else if (defined(depth)) {
+    command = depth.depthOnlyCommand;
     command.execute(context, passState);
   }
 }
@@ -2254,24 +2334,16 @@ function executeTranslucentCommandsBackToFront(
   executeFunction,
   passState,
   commands,
-  invertClassification
+  invertClassification,
 ) {
-  const context = scene.context;
-
   mergeSort(commands, backToFront, scene.camera.positionWC);
 
   if (defined(invertClassification)) {
-    executeFunction(
-      invertClassification.unclassifiedCommand,
-      scene,
-      context,
-      passState
-    );
+    executeFunction(invertClassification.unclassifiedCommand, scene, passState);
   }
 
-  const length = commands.length;
-  for (let i = 0; i < length; ++i) {
-    executeFunction(commands[i], scene, context, passState);
+  for (let i = 0; i < commands.length; ++i) {
+    executeFunction(commands[i], scene, passState);
   }
 }
 
@@ -2280,35 +2352,38 @@ function executeTranslucentCommandsFrontToBack(
   executeFunction,
   passState,
   commands,
-  invertClassification
+  invertClassification,
 ) {
-  const context = scene.context;
-
   mergeSort(commands, frontToBack, scene.camera.positionWC);
 
   if (defined(invertClassification)) {
-    executeFunction(
-      invertClassification.unclassifiedCommand,
-      scene,
-      context,
-      passState
-    );
+    executeFunction(invertClassification.unclassifiedCommand, scene, passState);
   }
 
-  const length = commands.length;
-  for (let i = 0; i < length; ++i) {
-    executeFunction(commands[i], scene, context, passState);
+  for (let i = 0; i < commands.length; ++i) {
+    executeFunction(commands[i], scene, passState);
   }
 }
 
-function executeVoxelCommands(scene, executeFunction, passState, commands) {
-  const context = scene.context;
+/**
+ * Execute commands to render voxels in the scene.
+ *
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The state for the current render pass.
+ * @param {FrustumCommands} frustumCommands The draw commands for the current frustum.
+ *
+ * @private
+ */
+function performVoxelsPass(scene, passState, frustumCommands) {
+  scene.context.uniformState.updatePass(Pass.VOXELS);
+
+  const commands = frustumCommands.commands[Pass.VOXELS];
+  commands.length = frustumCommands.indices[Pass.VOXELS];
 
   mergeSort(commands, backToFront, scene.camera.positionWC);
 
-  const length = commands.length;
-  for (let i = 0; i < length; ++i) {
-    executeFunction(commands[i], scene, context, passState);
+  for (let i = 0; i < commands.length; ++i) {
+    executeCommand(commands[i], scene, passState);
   }
 }
 
@@ -2316,89 +2391,49 @@ const scratchPerspectiveFrustum = new PerspectiveFrustum();
 const scratchPerspectiveOffCenterFrustum = new PerspectiveOffCenterFrustum();
 const scratchOrthographicFrustum = new OrthographicFrustum();
 const scratchOrthographicOffCenterFrustum = new OrthographicOffCenterFrustum();
-
-function executeCommands(scene, passState) {
-  const { camera, context, frameState } = scene;
-  const { uniformState } = context;
-
-  uniformState.updateCamera(camera);
-
-  // Create a working frustum from the original camera frustum.
-  let frustum;
-  if (defined(camera.frustum.fov)) {
-    frustum = camera.frustum.clone(scratchPerspectiveFrustum);
-  } else if (defined(camera.frustum.infiniteProjectionMatrix)) {
-    frustum = camera.frustum.clone(scratchPerspectiveOffCenterFrustum);
-  } else if (defined(camera.frustum.width)) {
-    frustum = camera.frustum.clone(scratchOrthographicFrustum);
-  } else {
-    frustum = camera.frustum.clone(scratchOrthographicOffCenterFrustum);
+/**
+ * Create a working frustum from the original camera frustum.
+ *
+ * @param {Camera} camera The camera
+ * @returns {PerspectiveFrustum|PerspectiveOffCenterFrustum|OrthographicFrustum|OrthographicOffCenterFrustum} The working frustum
+ *
+ * @private
+ */
+function createWorkingFrustum(camera) {
+  const { frustum } = camera;
+  if (defined(frustum.fov)) {
+    return frustum.clone(scratchPerspectiveFrustum);
   }
-
-  // Ideally, we would render the sky box and atmosphere last for
-  // early-z, but we would have to draw it in each frustum
-  frustum.near = camera.frustum.near;
-  frustum.far = camera.frustum.far;
-  uniformState.updateFrustum(frustum);
-  uniformState.updatePass(Pass.ENVIRONMENT);
-
-  const passes = frameState.passes;
-  const picking = passes.pick || passes.pickVoxel;
-  const environmentState = scene._environmentState;
-  const view = scene._view;
-  const renderTranslucentDepthForPick =
-    environmentState.renderTranslucentDepthForPick;
-  const useWebVR = environmentState.useWebVR;
-
-  // Do not render environment primitives during a pick pass since they do not generate picking commands.
-  if (!picking) {
-    const skyBoxCommand = environmentState.skyBoxCommand;
-    if (defined(skyBoxCommand)) {
-      executeCommand(skyBoxCommand, scene, context, passState);
-    }
-
-    if (environmentState.isSkyAtmosphereVisible) {
-      executeCommand(
-        environmentState.skyAtmosphereCommand,
-        scene,
-        context,
-        passState
-      );
-    }
-
-    if (environmentState.isSunVisible) {
-      environmentState.sunDrawCommand.execute(context, passState);
-      if (scene.sunBloom && !useWebVR) {
-        let framebuffer;
-        if (environmentState.useGlobeDepthFramebuffer) {
-          framebuffer = view.globeDepth.framebuffer;
-        } else if (environmentState.usePostProcess) {
-          framebuffer = view.sceneFramebuffer.framebuffer;
-        } else {
-          framebuffer = environmentState.originalFramebuffer;
-        }
-        scene._sunPostProcess.execute(context);
-        scene._sunPostProcess.copy(context, framebuffer);
-        passState.framebuffer = framebuffer;
-      }
-    }
-
-    // Moon can be seen through the atmosphere, since the sun is rendered after the atmosphere.
-    if (environmentState.isMoonVisible) {
-      environmentState.moonCommand.execute(context, passState);
-    }
+  if (defined(frustum.infiniteProjectionMatrix)) {
+    return frustum.clone(scratchPerspectiveOffCenterFrustum);
+  }
+  if (defined(frustum.width)) {
+    return frustum.clone(scratchOrthographicFrustum);
   }
+  return frustum.clone(scratchOrthographicOffCenterFrustum);
+}
 
-  // Determine how translucent surfaces will be handled.
-  let executeTranslucentCommands;
-  if (environmentState.useOIT) {
+/**
+ * Determine how translucent surfaces will be handled.
+ *
+ * When OIT is enabled, then this will delegate to OIT.executeCommands.
+ * Otherwise, it will just be executeTranslucentCommandsBackToFront
+ * for render passes, or executeTranslucentCommandsFrontToBack for
+ * other passes.
+ *
+ * @param {Scene} scene The scene.
+ * @returns {Function} A function to execute translucent commands.
+ */
+function obtainTranslucentCommandExecutionFunction(scene) {
+  if (scene._environmentState.useOIT) {
     if (!defined(scene._executeOITFunction)) {
+      const { view, context } = scene;
       scene._executeOITFunction = function (
         scene,
         executeFunction,
         passState,
         commands,
-        invertClassification
+        invertClassification,
       ) {
         view.globeDepth.prepareColorTextures(context);
         view.oit.executeCommands(
@@ -2406,35 +2441,171 @@ function executeCommands(scene, passState) {
           executeFunction,
           passState,
           commands,
-          invertClassification
+          invertClassification,
         );
       };
     }
-    executeTranslucentCommands = scene._executeOITFunction;
-  } else if (passes.render) {
-    executeTranslucentCommands = executeTranslucentCommandsBackToFront;
-  } else {
-    executeTranslucentCommands = executeTranslucentCommandsFrontToBack;
+    return scene._executeOITFunction;
+  }
+  if (scene.frameState.passes.render) {
+    return executeTranslucentCommandsBackToFront;
+  }
+  return executeTranslucentCommandsFrontToBack;
+}
+
+/**
+ * Execute draw commands to render translucent objects in the scene.
+ *
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The state for the current render pass.
+ * @param {FrustumCommands} frustumCommands The draw commands for the current frustum.
+ *
+ * @private
+ */
+function performTranslucentPass(scene, passState, frustumCommands) {
+  const { frameState, context } = scene;
+  const { pick, pickVoxel } = frameState.passes;
+  const picking = pick || pickVoxel;
+
+  let invertClassification;
+  if (
+    !picking &&
+    scene._environmentState.useInvertClassification &&
+    frameState.invertClassificationColor.alpha < 1.0
+  ) {
+    // Fullscreen pass to copy unclassified fragments when alpha < 1.0.
+    // Not executed when undefined.
+    invertClassification = scene._invertClassification;
+  }
+
+  const executeTranslucentCommands =
+    obtainTranslucentCommandExecutionFunction(scene);
+
+  context.uniformState.updatePass(Pass.TRANSLUCENT);
+  const commands = frustumCommands.commands[Pass.TRANSLUCENT];
+  commands.length = frustumCommands.indices[Pass.TRANSLUCENT];
+  executeTranslucentCommands(
+    scene,
+    executeCommand,
+    passState,
+    commands,
+    invertClassification,
+  );
+}
+
+/**
+ * Execute commands for classification of translucent 3D Tiles.
+ *
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The state for the current render pass.
+ * @param {FrustumCommands} frustumCommands The draw commands for the current frustum.
+ *
+ * @private
+ */
+function performTranslucent3DTilesClassification(
+  scene,
+  passState,
+  frustumCommands,
+) {
+  const { translucentTileClassification, globeDepth } = scene._view;
+  const has3DTilesClassificationCommands =
+    frustumCommands.indices[Pass.CESIUM_3D_TILE_CLASSIFICATION] > 0;
+  if (
+    !has3DTilesClassificationCommands ||
+    !translucentTileClassification.isSupported()
+  ) {
+    return;
+  }
+
+  const commands = frustumCommands.commands[Pass.TRANSLUCENT];
+  translucentTileClassification.executeTranslucentCommands(
+    scene,
+    executeCommand,
+    passState,
+    commands,
+    globeDepth.depthStencilTexture,
+  );
+  translucentTileClassification.executeClassificationCommands(
+    scene,
+    executeCommand,
+    passState,
+    frustumCommands,
+  );
+}
+
+/**
+ * Execute the draw commands for all the render passes.
+ *
+ * @param {Scene} scene
+ * @param {PassState} passState
+ *
+ * @private
+ */
+function executeCommands(scene, passState) {
+  const { camera, context, frameState } = scene;
+  const { uniformState } = context;
+
+  uniformState.updateCamera(camera);
+
+  const frustum = createWorkingFrustum(camera);
+  frustum.near = camera.frustum.near;
+  frustum.far = camera.frustum.far;
+
+  const passes = frameState.passes;
+  const picking = passes.pick || passes.pickVoxel;
+
+  // Ideally, we would render the sky box and atmosphere last for
+  // early-z, but we would have to draw it in each frustum.
+  // Do not render environment primitives during a pick pass since they do not generate picking commands.
+  if (!picking) {
+    renderEnvironment(scene, passState);
   }
 
-  const frustumCommandsList = view.frustumCommandsList;
+  const {
+    clearGlobeDepth,
+    renderTranslucentDepthForPick,
+    useDepthPlane,
+    useGlobeDepthFramebuffer,
+    useInvertClassification,
+    usePostProcessSelected,
+  } = scene._environmentState;
+
+  const {
+    globeDepth,
+    globeTranslucencyFramebuffer,
+    sceneFramebuffer,
+    frustumCommandsList,
+  } = scene._view;
   const numFrustums = frustumCommandsList.length;
 
-  const clearGlobeDepth = environmentState.clearGlobeDepth;
-  const useDepthPlane = environmentState.useDepthPlane;
   const globeTranslucencyState = scene._globeTranslucencyState;
-  const globeTranslucent = globeTranslucencyState.translucent;
-  const globeTranslucencyFramebuffer = scene._view.globeTranslucencyFramebuffer;
   const clearDepth = scene._depthClearCommand;
   const clearStencil = scene._stencilClearCommand;
   const clearClassificationStencil = scene._classificationStencilClearCommand;
   const depthPlane = scene._depthPlane;
-  const usePostProcessSelected = environmentState.usePostProcessSelected;
 
   const height2D = camera.position.z;
 
+  function performPass(frustumCommands, passId) {
+    uniformState.updatePass(passId);
+    const commands = frustumCommands.commands[passId];
+    const commandCount = frustumCommands.indices[passId];
+    for (let j = 0; j < commandCount; ++j) {
+      executeCommand(commands[j], scene, passState);
+    }
+    return commandCount;
+  }
+
+  function performIdPass(frustumCommands, passId) {
+    uniformState.updatePass(passId);
+    const commands = frustumCommands.commands[passId];
+    const commandCount = frustumCommands.indices[passId];
+    for (let j = 0; j < commandCount; ++j) {
+      executeIdCommand(commands[j], scene, passState);
+    }
+  }
+
   // Execute commands in each frustum in back to front order
-  let j;
   for (let i = 0; i < numFrustums; ++i) {
     const index = numFrustums - i - 1;
     const frustumCommands = frustumCommandsList[index];
@@ -2463,47 +2634,36 @@ function executeCommands(scene, passState) {
       clearStencil.execute(context, passState);
     }
 
-    uniformState.updatePass(Pass.GLOBE);
-    let commands = frustumCommands.commands[Pass.GLOBE];
-    let length = frustumCommands.indices[Pass.GLOBE];
-
-    if (globeTranslucent) {
+    if (globeTranslucencyState.translucent) {
+      uniformState.updatePass(Pass.GLOBE);
       globeTranslucencyState.executeGlobeCommands(
         frustumCommands,
         executeCommand,
         globeTranslucencyFramebuffer,
         scene,
-        passState
+        passState,
       );
     } else {
-      for (j = 0; j < length; ++j) {
-        executeCommand(commands[j], scene, context, passState);
-      }
+      performPass(frustumCommands, Pass.GLOBE);
     }
 
-    const globeDepth = view.globeDepth;
-    if (defined(globeDepth) && environmentState.useGlobeDepthFramebuffer) {
+    if (useGlobeDepthFramebuffer) {
       globeDepth.executeCopyDepth(context, passState);
     }
 
     // Draw terrain classification
-    if (!environmentState.renderTranslucentDepthForPick) {
-      uniformState.updatePass(Pass.TERRAIN_CLASSIFICATION);
-      commands = frustumCommands.commands[Pass.TERRAIN_CLASSIFICATION];
-      length = frustumCommands.indices[Pass.TERRAIN_CLASSIFICATION];
-
-      if (globeTranslucent) {
+    if (!renderTranslucentDepthForPick) {
+      if (globeTranslucencyState.translucent) {
+        uniformState.updatePass(Pass.TERRAIN_CLASSIFICATION);
         globeTranslucencyState.executeGlobeClassificationCommands(
           frustumCommands,
           executeCommand,
           globeTranslucencyFramebuffer,
           scene,
-          passState
+          passState,
         );
       } else {
-        for (j = 0; j < length; ++j) {
-          executeCommand(commands[j], scene, context, passState);
-        }
+        performPass(frustumCommands, Pass.TERRAIN_CLASSIFICATION);
       }
     }
 
@@ -2514,43 +2674,29 @@ function executeCommands(scene, passState) {
       }
     }
 
-    if (
-      !environmentState.useInvertClassification ||
-      picking ||
-      environmentState.renderTranslucentDepthForPick
-    ) {
+    let commandCount;
+    if (!useInvertClassification || picking || renderTranslucentDepthForPick) {
       // Common/fastest path. Draw 3D Tiles and classification normally.
 
       // Draw 3D Tiles
-      uniformState.updatePass(Pass.CESIUM_3D_TILE);
-      commands = frustumCommands.commands[Pass.CESIUM_3D_TILE];
-      length = frustumCommands.indices[Pass.CESIUM_3D_TILE];
-      for (j = 0; j < length; ++j) {
-        executeCommand(commands[j], scene, context, passState);
-      }
+      commandCount = performPass(frustumCommands, Pass.CESIUM_3D_TILE);
 
-      if (length > 0) {
-        if (defined(globeDepth) && environmentState.useGlobeDepthFramebuffer) {
-          // When clearGlobeDepth is true, executeUpdateDepth needs
-          // a globe depth texture with resolved stencil bits.
+      if (commandCount > 0) {
+        if (useGlobeDepthFramebuffer) {
           globeDepth.prepareColorTextures(context, clearGlobeDepth);
           globeDepth.executeUpdateDepth(
             context,
             passState,
-            clearGlobeDepth,
-            globeDepth.depthStencilTexture
+            globeDepth.depthStencilTexture,
           );
         }
 
         // Draw classifications. Modifies 3D Tiles color.
-        if (!environmentState.renderTranslucentDepthForPick) {
-          uniformState.updatePass(Pass.CESIUM_3D_TILE_CLASSIFICATION);
-          commands =
-            frustumCommands.commands[Pass.CESIUM_3D_TILE_CLASSIFICATION];
-          length = frustumCommands.indices[Pass.CESIUM_3D_TILE_CLASSIFICATION];
-          for (j = 0; j < length; ++j) {
-            executeCommand(commands[j], scene, context, passState);
-          }
+        if (!renderTranslucentDepthForPick) {
+          commandCount = performPass(
+            frustumCommands,
+            Pass.CESIUM_3D_TILE_CLASSIFICATION,
+          );
         }
       }
     } else {
@@ -2592,34 +2738,22 @@ function executeCommands(scene, passState) {
       passState.framebuffer = scene._invertClassification._fbo.framebuffer;
 
       // Draw normally
-      uniformState.updatePass(Pass.CESIUM_3D_TILE);
-      commands = frustumCommands.commands[Pass.CESIUM_3D_TILE];
-      length = frustumCommands.indices[Pass.CESIUM_3D_TILE];
-      for (j = 0; j < length; ++j) {
-        executeCommand(commands[j], scene, context, passState);
-      }
+      commandCount = performPass(frustumCommands, Pass.CESIUM_3D_TILE);
 
-      if (defined(globeDepth) && environmentState.useGlobeDepthFramebuffer) {
+      if (useGlobeDepthFramebuffer) {
         scene._invertClassification.prepareTextures(context);
         globeDepth.executeUpdateDepth(
           context,
           passState,
-          clearGlobeDepth,
-          scene._invertClassification._fbo.getDepthStencilTexture()
+          scene._invertClassification._fbo.getDepthStencilTexture(),
         );
       }
 
       // Set stencil
-      uniformState.updatePass(Pass.CESIUM_3D_TILE_CLASSIFICATION_IGNORE_SHOW);
-      commands =
-        frustumCommands.commands[
-          Pass.CESIUM_3D_TILE_CLASSIFICATION_IGNORE_SHOW
-        ];
-      length =
-        frustumCommands.indices[Pass.CESIUM_3D_TILE_CLASSIFICATION_IGNORE_SHOW];
-      for (j = 0; j < length; ++j) {
-        executeCommand(commands[j], scene, context, passState);
-      }
+      commandCount = performPass(
+        frustumCommands,
+        Pass.CESIUM_3D_TILE_CLASSIFICATION_IGNORE_SHOW,
+      );
 
       passState.framebuffer = opaqueClassificationFramebuffer;
 
@@ -2631,35 +2765,24 @@ function executeCommands(scene, passState) {
       }
 
       // Clear stencil set by the classification for the next classification pass
-      if (length > 0 && context.stencilBuffer) {
+      if (commandCount > 0 && context.stencilBuffer) {
         clearClassificationStencil.execute(context, passState);
       }
 
       // Draw style over classification.
-      uniformState.updatePass(Pass.CESIUM_3D_TILE_CLASSIFICATION);
-      commands = frustumCommands.commands[Pass.CESIUM_3D_TILE_CLASSIFICATION];
-      length = frustumCommands.indices[Pass.CESIUM_3D_TILE_CLASSIFICATION];
-      for (j = 0; j < length; ++j) {
-        executeCommand(commands[j], scene, context, passState);
-      }
+      commandCount = performPass(
+        frustumCommands,
+        Pass.CESIUM_3D_TILE_CLASSIFICATION,
+      );
     }
 
-    if (length > 0 && context.stencilBuffer) {
+    if (commandCount > 0 && context.stencilBuffer) {
       clearStencil.execute(context, passState);
     }
 
-    uniformState.updatePass(Pass.VOXELS);
-    commands = frustumCommands.commands[Pass.VOXELS];
-    length = frustumCommands.indices[Pass.VOXELS];
-    commands.length = length;
-    executeVoxelCommands(scene, executeCommand, passState, commands);
-
-    uniformState.updatePass(Pass.OPAQUE);
-    commands = frustumCommands.commands[Pass.OPAQUE];
-    length = frustumCommands.indices[Pass.OPAQUE];
-    for (j = 0; j < length; ++j) {
-      executeCommand(commands[j], scene, context, passState);
-    }
+    performVoxelsPass(scene, passState, frustumCommands);
+
+    performPass(frustumCommands, Pass.OPAQUE);
 
     if (index !== 0 && scene.mode !== SceneMode.SCENE2D) {
       // Do not overlap frustums in the translucent pass to avoid blending artifacts
@@ -2667,60 +2790,18 @@ function executeCommands(scene, passState) {
       uniformState.updateFrustum(frustum);
     }
 
-    let invertClassification;
-    if (
-      !picking &&
-      environmentState.useInvertClassification &&
-      frameState.invertClassificationColor.alpha < 1.0
-    ) {
-      // Fullscreen pass to copy unclassified fragments when alpha < 1.0.
-      // Not executed when undefined.
-      invertClassification = scene._invertClassification;
-    }
-
-    uniformState.updatePass(Pass.TRANSLUCENT);
-    commands = frustumCommands.commands[Pass.TRANSLUCENT];
-    commands.length = frustumCommands.indices[Pass.TRANSLUCENT];
-    executeTranslucentCommands(
-      scene,
-      executeCommand,
-      passState,
-      commands,
-      invertClassification
-    );
+    performTranslucentPass(scene, passState, frustumCommands);
 
-    // Classification for translucent 3D Tiles
-    const has3DTilesClassificationCommands =
-      frustumCommands.indices[Pass.CESIUM_3D_TILE_CLASSIFICATION] > 0;
-    if (
-      has3DTilesClassificationCommands &&
-      view.translucentTileClassification.isSupported()
-    ) {
-      view.translucentTileClassification.executeTranslucentCommands(
-        scene,
-        executeCommand,
-        passState,
-        commands,
-        globeDepth.depthStencilTexture
-      );
-      view.translucentTileClassification.executeClassificationCommands(
-        scene,
-        executeCommand,
-        passState,
-        frustumCommands
-      );
-    }
+    performTranslucent3DTilesClassification(scene, passState, frustumCommands);
 
     if (
       context.depthTexture &&
       scene.useDepthPicking &&
-      (environmentState.useGlobeDepthFramebuffer ||
-        renderTranslucentDepthForPick)
+      (useGlobeDepthFramebuffer || renderTranslucentDepthForPick)
     ) {
       // PERFORMANCE_IDEA: Use MRT to avoid the extra copy.
-      const depthStencilTexture = globeDepth.depthStencilTexture;
       const pickDepth = scene._picking.getPickDepth(scene, index);
-      pickDepth.update(context, depthStencilTexture);
+      pickDepth.update(context, globeDepth.depthStencilTexture);
       pickDepth.executeCopyDepth(context, passState);
     }
 
@@ -2729,7 +2810,7 @@ function executeCommands(scene, passState) {
     }
 
     const originalFramebuffer = passState.framebuffer;
-    passState.framebuffer = view.sceneFramebuffer.getIdFramebuffer();
+    passState.framebuffer = sceneFramebuffer.getIdFramebuffer();
 
     // reset frustum
     frustum.near =
@@ -2739,22 +2820,17 @@ function executeCommands(scene, passState) {
     frustum.far = frustumCommands.far;
     uniformState.updateFrustum(frustum);
 
-    uniformState.updatePass(Pass.GLOBE);
-    commands = frustumCommands.commands[Pass.GLOBE];
-    length = frustumCommands.indices[Pass.GLOBE];
-
-    if (globeTranslucent) {
+    if (globeTranslucencyState.translucent) {
+      uniformState.updatePass(Pass.GLOBE);
       globeTranslucencyState.executeGlobeCommands(
         frustumCommands,
         executeIdCommand,
         globeTranslucencyFramebuffer,
         scene,
-        passState
+        passState,
       );
     } else {
-      for (j = 0; j < length; ++j) {
-        executeIdCommand(commands[j], scene, context, passState);
-      }
+      performIdPass(frustumCommands, Pass.GLOBE);
     }
 
     if (clearGlobeDepth) {
@@ -2767,34 +2843,67 @@ function executeCommands(scene, passState) {
       depthPlane.execute(context, passState);
     }
 
-    uniformState.updatePass(Pass.CESIUM_3D_TILE);
-    commands = frustumCommands.commands[Pass.CESIUM_3D_TILE];
-    length = frustumCommands.indices[Pass.CESIUM_3D_TILE];
-    for (j = 0; j < length; ++j) {
-      executeIdCommand(commands[j], scene, context, passState);
-    }
+    performIdPass(frustumCommands, Pass.CESIUM_3D_TILE);
+    performIdPass(frustumCommands, Pass.OPAQUE);
+    performIdPass(frustumCommands, Pass.TRANSLUCENT);
 
-    uniformState.updatePass(Pass.OPAQUE);
-    commands = frustumCommands.commands[Pass.OPAQUE];
-    length = frustumCommands.indices[Pass.OPAQUE];
-    for (j = 0; j < length; ++j) {
-      executeIdCommand(commands[j], scene, context, passState);
-    }
+    passState.framebuffer = originalFramebuffer;
+  }
+}
+
+/**
+ * Render the sky, atmosphere, sun, and moon
+ *
+ * @param {Scene} scene The scene.
+ * @param {PassState} passState The render state for the pass.
+ *
+ * @private
+ */
+function renderEnvironment(scene, passState) {
+  const { context, environmentState, view } = scene;
+
+  context.uniformState.updatePass(Pass.ENVIRONMENT);
+
+  if (defined(environmentState.skyBoxCommand)) {
+    executeCommand(environmentState.skyBoxCommand, scene, passState);
+  }
+
+  if (environmentState.isSkyAtmosphereVisible) {
+    executeCommand(environmentState.skyAtmosphereCommand, scene, passState);
+  }
 
-    uniformState.updatePass(Pass.TRANSLUCENT);
-    commands = frustumCommands.commands[Pass.TRANSLUCENT];
-    length = frustumCommands.indices[Pass.TRANSLUCENT];
-    for (j = 0; j < length; ++j) {
-      executeIdCommand(commands[j], scene, context, passState);
+  if (environmentState.isSunVisible) {
+    environmentState.sunDrawCommand.execute(context, passState);
+    if (scene.sunBloom && !environmentState.useWebVR) {
+      let framebuffer;
+      if (environmentState.useGlobeDepthFramebuffer) {
+        framebuffer = view.globeDepth.framebuffer;
+      } else if (environmentState.usePostProcess) {
+        framebuffer = view.sceneFramebuffer.framebuffer;
+      } else {
+        framebuffer = environmentState.originalFramebuffer;
+      }
+      scene._sunPostProcess.execute(context);
+      scene._sunPostProcess.copy(context, framebuffer);
+      passState.framebuffer = framebuffer;
     }
+  }
 
-    passState.framebuffer = originalFramebuffer;
+  // Moon can be seen through the atmosphere, since the sun is rendered after the atmosphere.
+  if (environmentState.isMoonVisible) {
+    environmentState.moonCommand.execute(context, passState);
   }
 }
 
+/**
+ * Execute compute commands from the scene's environment state and computeCommandList
+ *
+ * @param {Scene} scene
+ *
+ * @private
+ */
 function executeComputeCommands(scene) {
-  const us = scene.context.uniformState;
-  us.updatePass(Pass.COMPUTE);
+  scene.context.uniformState.updatePass(Pass.COMPUTE);
 
   const sunComputeCommand = scene._environmentState.sunComputeCommand;
   if (defined(sunComputeCommand)) {
@@ -2802,114 +2911,130 @@ function executeComputeCommands(scene) {
   }
 
   const commandList = scene._computeCommandList;
-  const length = commandList.length;
-  for (let i = 0; i < length; ++i) {
+  for (let i = 0; i < commandList.length; ++i) {
     commandList[i].execute(scene._computeEngine);
   }
 }
 
+/**
+ * Execute the draw commands for overlays
+ *
+ * @param {Scene} scene
+ * @param {PassState} passState
+ *
+ * @private
+ */
 function executeOverlayCommands(scene, passState) {
-  const us = scene.context.uniformState;
-  us.updatePass(Pass.OVERLAY);
+  scene.context.uniformState.updatePass(Pass.OVERLAY);
 
   const context = scene.context;
   const commandList = scene._overlayCommandList;
-  const length = commandList.length;
-  for (let i = 0; i < length; ++i) {
+  for (let i = 0; i < commandList.length; ++i) {
     commandList[i].execute(context, passState);
   }
 }
 
+/**
+ * Add the scene's draw commands into the shadow map passes.
+ *
+ * @param {Scene} scene
+ * @param {DrawCommand[]} commandList
+ * @param {ShadowMap} shadowMap
+ *
+ * @private
+ */
 function insertShadowCastCommands(scene, commandList, shadowMap) {
-  const shadowVolume = shadowMap.shadowMapCullingVolume;
-  const isPointLight = shadowMap.isPointLight;
-  const passes = shadowMap.passes;
+  const { shadowMapCullingVolume, isPointLight, passes } = shadowMap;
   const numberOfPasses = passes.length;
 
-  const length = commandList.length;
-  for (let i = 0; i < length; ++i) {
+  const shadowedPasses = [
+    Pass.GLOBE,
+    Pass.CESIUM_3D_TILE,
+    Pass.OPAQUE,
+    Pass.TRANSLUCENT,
+  ];
+
+  for (let i = 0; i < commandList.length; ++i) {
     const command = commandList[i];
     scene.updateDerivedCommands(command);
 
     if (
-      command.castShadows &&
-      (command.pass === Pass.GLOBE ||
-        command.pass === Pass.CESIUM_3D_TILE ||
-        command.pass === Pass.OPAQUE ||
-        command.pass === Pass.TRANSLUCENT)
+      !command.castShadows ||
+      shadowedPasses.indexOf(command.pass) < 0 ||
+      !scene.isVisible(shadowMapCullingVolume, command)
     ) {
-      if (scene.isVisible(command, shadowVolume)) {
-        if (isPointLight) {
-          for (let k = 0; k < numberOfPasses; ++k) {
-            passes[k].commandList.push(command);
-          }
-        } else if (numberOfPasses === 1) {
-          passes[0].commandList.push(command);
-        } else {
-          let wasVisible = false;
-          // Loop over cascades from largest to smallest
-          for (let j = numberOfPasses - 1; j >= 0; --j) {
-            const cascadeVolume = passes[j].cullingVolume;
-            if (scene.isVisible(command, cascadeVolume)) {
-              passes[j].commandList.push(command);
-              wasVisible = true;
-            } else if (wasVisible) {
-              // If it was visible in the previous cascade but now isn't
-              // then there is no need to check any more cascades
-              break;
-            }
-          }
+      continue;
+    }
+
+    if (isPointLight) {
+      for (let k = 0; k < numberOfPasses; ++k) {
+        passes[k].commandList.push(command);
+      }
+    } else if (numberOfPasses === 1) {
+      passes[0].commandList.push(command);
+    } else {
+      let wasVisible = false;
+      // Loop over cascades from largest to smallest
+      for (let j = numberOfPasses - 1; j >= 0; --j) {
+        const cascadeVolume = passes[j].cullingVolume;
+        if (scene.isVisible(cascadeVolume, command)) {
+          passes[j].commandList.push(command);
+          wasVisible = true;
+        } else if (wasVisible) {
+          // If it was visible in the previous cascade but now isn't
+          // then there is no need to check any more cascades
+          break;
         }
       }
     }
   }
 }
 
+/**
+ * Execute the draw commands to cast shadows into the shadow maps.
+ *
+ * @param {Scene} scene
+ *
+ * @private
+ */
 function executeShadowMapCastCommands(scene) {
-  const frameState = scene.frameState;
-  const shadowMaps = frameState.shadowState.shadowMaps;
-  const shadowMapLength = shadowMaps.length;
+  const { shadowState, commandList } = scene.frameState;
+  const { shadowsEnabled, shadowMaps } = shadowState;
 
-  if (!frameState.shadowState.shadowsEnabled) {
+  if (!shadowsEnabled) {
     return;
   }
 
-  const context = scene.context;
-  const uniformState = context.uniformState;
+  const { context } = scene;
+  const { uniformState } = context;
 
-  for (let i = 0; i < shadowMapLength; ++i) {
+  for (let i = 0; i < shadowMaps.length; ++i) {
     const shadowMap = shadowMaps[i];
     if (shadowMap.outOfView) {
       continue;
     }
 
     // Reset the command lists
-    const passes = shadowMap.passes;
-    const numberOfPasses = passes.length;
-    for (let j = 0; j < numberOfPasses; ++j) {
+    const { passes } = shadowMap;
+    for (let j = 0; j < passes.length; ++j) {
       passes[j].commandList.length = 0;
     }
 
-    // Insert the primitive/model commands into the command lists
-    const sceneCommands = scene.frameState.commandList;
-    insertShadowCastCommands(scene, sceneCommands, shadowMap);
+    // Insert the primitive/model commands into the shadow map command lists
+    insertShadowCastCommands(scene, commandList, shadowMap);
 
-    for (let j = 0; j < numberOfPasses; ++j) {
+    for (let j = 0; j < passes.length; ++j) {
       const pass = shadowMap.passes[j];
-      uniformState.updateCamera(pass.camera);
+      const { camera, commandList } = pass;
+      uniformState.updateCamera(camera);
       shadowMap.updatePass(context, j);
-      const numberOfCommands = pass.commandList.length;
-      for (let k = 0; k < numberOfCommands; ++k) {
-        const command = pass.commandList[k];
+      for (let k = 0; k < commandList.length; ++k) {
+        const command = commandList[k];
         // Set the correct pass before rendering into the shadow map because some shaders
         // conditionally render based on whether the pass is translucent or opaque.
         uniformState.updatePass(command.pass);
-        executeCommand(
-          command.derivedCommands.shadows.castCommands[i],
-          scene,
-          context,
-          pass.passState
-        );
+        const castCommand = command.derivedCommands.shadows.castCommands[i];
+        executeCommand(castCommand, scene, pass.passState);
       }
     }
   }
@@ -2918,38 +3043,46 @@ function executeShadowMapCastCommands(scene) {
 const scratchEyeTranslation = new Cartesian3();
 
 /**
+ * Update and clear framebuffers, and execute draw commands.
+ *
+ * @param {PassState} passState State specific to each render pass.
+ * @param {Color} backgroundColor
+ *
  * @private
  */
 Scene.prototype.updateAndExecuteCommands = function (
   passState,
-  backgroundColor
+  backgroundColor,
 ) {
-  const frameState = this._frameState;
-  const mode = frameState.mode;
-  const useWebVR = this._environmentState.useWebVR;
+  updateAndClearFramebuffers(this, passState, backgroundColor);
 
-  if (useWebVR) {
+  if (this._environmentState.useWebVR) {
     executeWebVRCommands(this, passState, backgroundColor);
   } else if (
-    mode !== SceneMode.SCENE2D ||
+    this._frameState.mode !== SceneMode.SCENE2D ||
     this._mapMode2D === MapMode2D.ROTATE
   ) {
-    executeCommandsInViewport(true, this, passState, backgroundColor);
+    executeCommandsInViewport(true, this, passState);
   } else {
-    updateAndClearFramebuffers(this, passState, backgroundColor);
     execute2DViewportCommands(this, passState);
   }
 };
 
-function executeWebVRCommands(scene, passState, backgroundColor) {
+/**
+ * Execute the draw commands to render the scene into the stereo viewports of a WebVR application.
+ *
+ * @param {Scene} scene
+ * @param {PassState} passState
+ *
+ * @private
+ */
+function executeWebVRCommands(scene, passState) {
   const view = scene._view;
   const camera = view.camera;
   const environmentState = scene._environmentState;
   const renderTranslucentDepthForPick =
     environmentState.renderTranslucentDepthForPick;
 
-  updateAndClearFramebuffers(scene, passState, backgroundColor);
-
   updateAndRenderPrimitives(scene);
 
   view.createPotentiallyVisibleSet(scene);
@@ -2976,7 +3109,7 @@ function executeWebVRCommands(scene, passState, backgroundColor) {
   const eyeTranslation = Cartesian3.multiplyByScalar(
     savedCamera.right,
     eyeSeparation * 0.5,
-    scratchEyeTranslation
+    scratchEyeTranslation,
   );
 
   camera.frustum.aspectRatio = viewport.width / viewport.height;
@@ -3000,7 +3133,7 @@ function executeWebVRCommands(scene, passState, backgroundColor) {
 
 const scratch2DViewportCartographic = new Cartographic(
   Math.PI,
-  CesiumMath.PI_OVER_TWO
+  CesiumMath.PI_OVER_TWO,
 );
 const scratch2DViewportMaxCoord = new Cartesian3();
 const scratch2DViewportSavedPosition = new Cartesian3();
@@ -3010,10 +3143,17 @@ const scratch2DViewportEyePoint = new Cartesian3();
 const scratch2DViewportWindowCoords = new Cartesian3();
 const scratch2DViewport = new BoundingRectangle();
 
+/**
+ * Execute the draw commands to render into a 2D viewport.
+ *
+ * @param {Scene} scene
+ * @param {PassState} passState
+ *
+ * @private
+ */
 function execute2DViewportCommands(scene, passState) {
-  const context = scene.context;
-  const frameState = scene.frameState;
-  const camera = scene.camera;
+  const { frameState, camera } = scene;
+  const { uniformState } = scene.context;
 
   const originalViewport = passState.viewport;
   const viewport = BoundingRectangle.clone(originalViewport, scratch2DViewport);
@@ -3027,11 +3167,11 @@ function execute2DViewportCommands(scene, passState) {
 
   const position = Cartesian3.clone(
     camera.position,
-    scratch2DViewportSavedPosition
+    scratch2DViewportSavedPosition,
   );
   const transform = Matrix4.clone(
     camera.transform,
-    scratch2DViewportCameraTransform
+    scratch2DViewportCameraTransform,
   );
   const frustum = camera.frustum.clone();
 
@@ -3041,7 +3181,7 @@ function execute2DViewportCommands(scene, passState) {
     viewport,
     0.0,
     1.0,
-    scratch2DViewportTransform
+    scratch2DViewportTransform,
   );
   const projectionMatrix = camera.frustum.projectionMatrix;
 
@@ -3050,13 +3190,13 @@ function execute2DViewportCommands(scene, passState) {
     CesiumMath.sign(x) * maxCoord.x - x,
     0.0,
     -camera.positionWC.x,
-    scratch2DViewportEyePoint
+    scratch2DViewportEyePoint,
   );
   const windowCoordinates = Transforms.pointToGLWindowCoordinates(
     projectionMatrix,
     viewportTransformation,
     eyePoint,
-    scratch2DViewportWindowCoords
+    scratch2DViewportWindowCoords,
   );
 
   windowCoordinates.x = Math.floor(windowCoordinates.x);
@@ -3082,9 +3222,9 @@ function execute2DViewportCommands(scene, passState) {
     frameState.cullingVolume = camera.frustum.computeCullingVolume(
       camera.positionWC,
       camera.directionWC,
-      camera.upWC
+      camera.upWC,
     );
-    context.uniformState.update(frameState);
+    uniformState.update(frameState);
 
     executeCommandsInViewport(true, scene, passState);
 
@@ -3098,9 +3238,9 @@ function execute2DViewportCommands(scene, passState) {
     frameState.cullingVolume = camera.frustum.computeCullingVolume(
       camera.positionWC,
       camera.directionWC,
-      camera.upWC
+      camera.upWC,
     );
-    context.uniformState.update(frameState);
+    uniformState.update(frameState);
 
     executeCommandsInViewport(false, scene, passState);
   } else if (windowCoordinates.x > viewportX + viewportWidth * 0.5) {
@@ -3112,9 +3252,9 @@ function execute2DViewportCommands(scene, passState) {
     frameState.cullingVolume = camera.frustum.computeCullingVolume(
       camera.positionWC,
       camera.directionWC,
-      camera.upWC
+      camera.upWC,
     );
-    context.uniformState.update(frameState);
+    uniformState.update(frameState);
 
     executeCommandsInViewport(true, scene, passState);
 
@@ -3129,9 +3269,9 @@ function execute2DViewportCommands(scene, passState) {
     frameState.cullingVolume = camera.frustum.computeCullingVolume(
       camera.positionWC,
       camera.directionWC,
-      camera.upWC
+      camera.upWC,
     );
-    context.uniformState.update(frameState);
+    uniformState.update(frameState);
 
     executeCommandsInViewport(false, scene, passState);
   } else {
@@ -3144,9 +3284,9 @@ function execute2DViewportCommands(scene, passState) {
     frameState.cullingVolume = camera.frustum.computeCullingVolume(
       camera.positionWC,
       camera.directionWC,
-      camera.upWC
+      camera.upWC,
     );
-    context.uniformState.update(frameState);
+    uniformState.update(frameState);
 
     executeCommandsInViewport(true, scene, passState);
 
@@ -3161,9 +3301,9 @@ function execute2DViewportCommands(scene, passState) {
     frameState.cullingVolume = camera.frustum.computeCullingVolume(
       camera.positionWC,
       camera.directionWC,
-      camera.upWC
+      camera.upWC,
     );
-    context.uniformState.update(frameState);
+    uniformState.update(frameState);
 
     executeCommandsInViewport(false, scene, passState);
   }
@@ -3174,16 +3314,19 @@ function execute2DViewportCommands(scene, passState) {
   passState.viewport = originalViewport;
 }
 
-function executeCommandsInViewport(
-  firstViewport,
-  scene,
-  passState,
-  backgroundColor
-) {
-  const environmentState = scene._environmentState;
+/**
+ * Execute the draw commands to render the scene into the viewport.
+ * If this is the first viewport rendered, the framebuffers will be cleared to the background color.
+ *
+ * @param {boolean} firstViewport <code>true</code> if this is the first viewport rendered.
+ * @param {Scene} scene
+ * @param {PassState} passState
+ *
+ * @private
+ */
+function executeCommandsInViewport(firstViewport, scene, passState) {
   const view = scene._view;
-  const renderTranslucentDepthForPick =
-    environmentState.renderTranslucentDepthForPick;
+  const { renderTranslucentDepthForPick } = scene._environmentState;
 
   if (!firstViewport) {
     scene.frameState.commandList.length = 0;
@@ -3194,9 +3337,6 @@ function executeCommandsInViewport(
   view.createPotentiallyVisibleSet(scene);
 
   if (firstViewport) {
-    if (defined(backgroundColor)) {
-      updateAndClearFramebuffers(scene, passState, backgroundColor);
-    }
     executeComputeCommands(scene);
     if (!renderTranslucentDepthForPick) {
       executeShadowMapCastCommands(scene);
@@ -3239,7 +3379,7 @@ Scene.prototype.updateEnvironment = function () {
     if (defined(skyAtmosphere)) {
       if (defined(globe)) {
         skyAtmosphere.setDynamicLighting(
-          DynamicAtmosphereLightingType.fromGlobeFlags(globe)
+          DynamicAtmosphereLightingType.fromGlobeFlags(globe),
         );
         environmentState.isReadyForAtmosphere =
           environmentState.isReadyForAtmosphere ||
@@ -3253,7 +3393,7 @@ Scene.prototype.updateEnvironment = function () {
 
       environmentState.skyAtmosphereCommand = skyAtmosphere.update(
         frameState,
-        globe
+        globe,
       );
       if (defined(environmentState.skyAtmosphereCommand)) {
         this.updateDerivedCommands(environmentState.skyAtmosphereCommand);
@@ -3317,31 +3457,29 @@ Scene.prototype.updateEnvironment = function () {
     defined(environmentState.skyAtmosphereCommand) &&
     environmentState.isReadyForAtmosphere;
   environmentState.isSunVisible = this.isVisible(
-    environmentState.sunDrawCommand,
     cullingVolume,
-    occluder
+    environmentState.sunDrawCommand,
+    occluder,
   );
   environmentState.isMoonVisible = this.isVisible(
-    environmentState.moonCommand,
     cullingVolume,
-    occluder
+    environmentState.moonCommand,
+    occluder,
   );
 
   const envMaps = this.specularEnvironmentMaps;
-  let envMapAtlas = this._specularEnvironmentMapAtlas;
-  if (
-    defined(envMaps) &&
-    (!defined(envMapAtlas) || envMapAtlas.url !== envMaps)
-  ) {
-    envMapAtlas = envMapAtlas && envMapAtlas.destroy();
-    this._specularEnvironmentMapAtlas = new OctahedralProjectedCubeMap(envMaps);
-  } else if (!defined(envMaps) && defined(envMapAtlas)) {
-    envMapAtlas.destroy();
-    this._specularEnvironmentMapAtlas = undefined;
+  let specularEnvironmentCubeMap = this._specularEnvironmentCubeMap;
+  if (defined(envMaps) && specularEnvironmentCubeMap?.url !== envMaps) {
+    specularEnvironmentCubeMap =
+      specularEnvironmentCubeMap && specularEnvironmentCubeMap.destroy();
+    this._specularEnvironmentCubeMap = new SpecularEnvironmentCubeMap(envMaps);
+  } else if (!defined(envMaps) && defined(specularEnvironmentCubeMap)) {
+    specularEnvironmentCubeMap.destroy();
+    this._specularEnvironmentCubeMap = undefined;
   }
 
-  if (defined(this._specularEnvironmentMapAtlas)) {
-    this._specularEnvironmentMapAtlas.update(frameState);
+  if (defined(this._specularEnvironmentCubeMap)) {
+    this._specularEnvironmentCubeMap.update(frameState);
   }
 };
 
@@ -3368,21 +3506,21 @@ function updateDebugFrustumPlanes(scene) {
 
 function updateShadowMaps(scene) {
   const frameState = scene._frameState;
-  const shadowMaps = frameState.shadowMaps;
+  const { passes, shadowState, shadowMaps } = frameState;
   const length = shadowMaps.length;
 
   const shadowsEnabled =
     length > 0 &&
-    !frameState.passes.pick &&
-    !frameState.passes.pickVoxel &&
+    !passes.pick &&
+    !passes.pickVoxel &&
     scene.mode === SceneMode.SCENE3D;
-  if (shadowsEnabled !== frameState.shadowState.shadowsEnabled) {
+  if (shadowsEnabled !== shadowState.shadowsEnabled) {
     // Update derived commands when shadowsEnabled changes
-    ++frameState.shadowState.lastDirtyTime;
-    frameState.shadowState.shadowsEnabled = shadowsEnabled;
+    ++shadowState.lastDirtyTime;
+    shadowState.shadowsEnabled = shadowsEnabled;
   }
 
-  frameState.shadowState.lightShadowsEnabled = false;
+  shadowState.lightShadowsEnabled = false;
 
   if (!shadowsEnabled) {
     return;
@@ -3391,28 +3529,28 @@ function updateShadowMaps(scene) {
   // Check if the shadow maps are different than the shadow maps last frame.
   // If so, the derived commands need to be updated.
   for (let j = 0; j < length; ++j) {
-    if (shadowMaps[j] !== frameState.shadowState.shadowMaps[j]) {
-      ++frameState.shadowState.lastDirtyTime;
+    if (shadowMaps[j] !== shadowState.shadowMaps[j]) {
+      ++shadowState.lastDirtyTime;
       break;
     }
   }
 
-  frameState.shadowState.shadowMaps.length = 0;
-  frameState.shadowState.lightShadowMaps.length = 0;
+  shadowState.shadowMaps.length = 0;
+  shadowState.lightShadowMaps.length = 0;
 
   for (let i = 0; i < length; ++i) {
     const shadowMap = shadowMaps[i];
     shadowMap.update(frameState);
 
-    frameState.shadowState.shadowMaps.push(shadowMap);
+    shadowState.shadowMaps.push(shadowMap);
 
     if (shadowMap.fromLightSource) {
-      frameState.shadowState.lightShadowMaps.push(shadowMap);
-      frameState.shadowState.lightShadowsEnabled = true;
+      shadowState.lightShadowMaps.push(shadowMap);
+      shadowState.lightShadowsEnabled = true;
     }
 
     if (shadowMap.dirty) {
-      ++frameState.shadowState.lastDirtyTime;
+      ++shadowState.lastDirtyTime;
       shadowMap.dirty = false;
     }
   }
@@ -3438,7 +3576,7 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
   const environmentState = scene._environmentState;
   const view = scene._view;
 
-  const passes = scene._frameState.passes;
+  const passes = frameState.passes;
   const picking = passes.pick || passes.pickVoxel;
   if (defined(view.globeDepth)) {
     view.globeDepth.picking = picking;
@@ -3469,9 +3607,8 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
 
   // Update globe depth rendering based on the current context and clear the globe depth framebuffer.
   // Globe depth is copied for the pick pass to support picking batched geometries in GroundPrimitives.
-  const useGlobeDepthFramebuffer = (environmentState.useGlobeDepthFramebuffer = defined(
-    view.globeDepth
-  ));
+  const useGlobeDepthFramebuffer = (environmentState.useGlobeDepthFramebuffer =
+    defined(view.globeDepth));
   if (useGlobeDepthFramebuffer) {
     view.globeDepth.update(
       context,
@@ -3479,7 +3616,7 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
       view.viewport,
       scene.msaaSamples,
       scene._hdr,
-      environmentState.clearGlobeDepth
+      environmentState.clearGlobeDepth,
     );
     view.globeDepth.clear(context, passState, clearColor);
   }
@@ -3494,7 +3631,7 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
       passState,
       view.globeDepth.colorFramebufferManager,
       scene._hdr,
-      scene.msaaSamples
+      scene.msaaSamples,
     );
     oit.clear(context, passState, clearColor);
     environmentState.useOIT = oit.isSupported();
@@ -3514,7 +3651,7 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
       context,
       view.viewport,
       scene._hdr,
-      scene.msaaSamples
+      scene.msaaSamples,
     );
     view.sceneFramebuffer.clear(context, passState, clearColor);
 
@@ -3543,8 +3680,8 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
     !picking && defined(passState.framebuffer) && scene.invertClassification);
   if (useInvertClassification) {
     let depthFramebuffer;
-    if (scene.frameState.invertClassificationColor.alpha === 1.0) {
-      if (environmentState.useGlobeDepthFramebuffer) {
+    if (frameState.invertClassificationColor.alpha === 1.0) {
+      if (useGlobeDepthFramebuffer) {
         depthFramebuffer = view.globeDepth.framebuffer;
       }
     }
@@ -3554,17 +3691,17 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
       scene._invertClassification.update(
         context,
         scene.msaaSamples,
-        view.globeDepth.colorFramebufferManager
+        view.globeDepth.colorFramebufferManager,
       );
       scene._invertClassification.clear(context, passState);
 
-      if (scene.frameState.invertClassificationColor.alpha < 1.0 && useOIT) {
+      if (frameState.invertClassificationColor.alpha < 1.0 && useOIT) {
         const command = scene._invertClassification.unclassifiedCommand;
         const derivedCommands = command.derivedCommands;
         derivedCommands.oit = oit.createDerivedCommands(
           command,
           context,
-          derivedCommands.oit
+          derivedCommands.oit,
         );
       }
     } else {
@@ -3577,7 +3714,7 @@ function updateAndClearFramebuffers(scene, passState, clearColor) {
       scene._hdr,
       view.viewport,
       context,
-      passState
+      passState,
     );
   }
 }
@@ -3589,16 +3726,18 @@ Scene.prototype.resolveFramebuffers = function (passState) {
   const context = this._context;
   const environmentState = this._environmentState;
   const view = this._view;
-  const globeDepth = view.globeDepth;
+  const { globeDepth, translucentTileClassification } = view;
   if (defined(globeDepth)) {
     globeDepth.prepareColorTextures(context);
   }
 
-  const useOIT = environmentState.useOIT;
-  const useGlobeDepthFramebuffer = environmentState.useGlobeDepthFramebuffer;
-  const usePostProcess = environmentState.usePostProcess;
+  const {
+    useOIT,
+    useGlobeDepthFramebuffer,
+    usePostProcess,
+    originalFramebuffer,
+  } = environmentState;
 
-  const defaultFramebuffer = environmentState.originalFramebuffer;
   const globeFramebuffer = useGlobeDepthFramebuffer
     ? globeDepth.colorFramebufferManager
     : undefined;
@@ -3608,11 +3747,10 @@ Scene.prototype.resolveFramebuffers = function (passState) {
   if (useOIT) {
     passState.framebuffer = usePostProcess
       ? sceneFramebuffer.framebuffer
-      : defaultFramebuffer;
+      : originalFramebuffer;
     view.oit.execute(context, passState);
   }
 
-  const translucentTileClassification = view.translucentTileClassification;
   if (
     translucentTileClassification.hasTranslucentDepth &&
     translucentTileClassification.isSupported()
@@ -3632,14 +3770,14 @@ Scene.prototype.resolveFramebuffers = function (passState) {
     const idTexture = idFramebuffer.getColorTexture(0);
     const depthTexture = defaultValue(
       globeFramebuffer,
-      sceneFramebuffer
+      sceneFramebuffer,
     ).getDepthStencilTexture();
     postProcess.execute(context, colorTexture, depthTexture, idTexture);
-    postProcess.copy(context, defaultFramebuffer);
+    postProcess.copy(context, originalFramebuffer);
   }
 
   if (!useOIT && !usePostProcess && useGlobeDepthFramebuffer) {
-    passState.framebuffer = defaultFramebuffer;
+    passState.framebuffer = originalFramebuffer;
     globeDepth.executeCopyColor(context, passState);
   }
 };
@@ -3648,7 +3786,7 @@ function callAfterRenderFunctions(scene) {
   // Functions are queued up during primitive update and executed here in case
   // the function modifies scene state that should remain constant over the frame.
   const functions = scene._frameState.afterRender;
-  for (let i = 0, length = functions.length; i < length; ++i) {
+  for (let i = 0; i < functions.length; ++i) {
     const shouldRequestRender = functions[i]();
     if (shouldRequestRender) {
       scene.requestRender();
@@ -3662,9 +3800,7 @@ function getGlobeHeight(scene) {
   if (scene.mode === SceneMode.MORPHING) {
     return;
   }
-
-  const camera = scene.camera;
-  const cartographic = camera.positionCartographic;
+  const cartographic = scene.camera.positionCartographic;
   return scene.getHeight(cartographic);
 }
 
@@ -3742,7 +3878,7 @@ const updateHeightScratchCartographic = new Cartographic();
 Scene.prototype.updateHeight = function (
   cartographic,
   callback,
-  heightReference
+  heightReference,
 ) {
   //>>includeStart('debug', pragmas.debug);
   Check.typeOf.func("callback", callback);
@@ -3770,7 +3906,7 @@ Scene.prototype.updateHeight = function (
   if (!ignoreTerrain && defined(this.globe)) {
     terrainRemoveCallback = this.globe._surface.updateHeight(
       cartographic,
-      callbackWrapper
+      callbackWrapper,
     );
   }
 
@@ -3788,7 +3924,7 @@ Scene.prototype.updateHeight = function (
     const tilesetRemoveCallback = primitive.updateHeight(
       cartographic,
       callbackWrapper,
-      ellipsoid
+      ellipsoid,
     );
     tilesetRemoveCallbacks[primitive.id] = tilesetRemoveCallback;
   };
@@ -3802,10 +3938,10 @@ Scene.prototype.updateHeight = function (
   }
 
   const removeAddedListener = this.primitives.primitiveAdded.addEventListener(
-    createPrimitiveEventListener
+    createPrimitiveEventListener,
   );
-  const removeRemovedListener = this.primitives.primitiveRemoved.addEventListener(
-    (primitive) => {
+  const removeRemovedListener =
+    this.primitives.primitiveRemoved.addEventListener((primitive) => {
       if (primitive.isDestroyed() || !primitive.isCesium3DTileset) {
         return;
       }
@@ -3813,13 +3949,12 @@ Scene.prototype.updateHeight = function (
         tilesetRemoveCallbacks[primitive.id]();
       }
       delete tilesetRemoveCallbacks[primitive.id];
-    }
-  );
+    });
 
   const removeCallback = () => {
     terrainRemoveCallback = terrainRemoveCallback && terrainRemoveCallback();
     Object.values(tilesetRemoveCallbacks).forEach((tilesetRemoveCallback) =>
-      tilesetRemoveCallback()
+      tilesetRemoveCallback(),
     );
     tilesetRemoveCallbacks = {};
     removeAddedListener();
@@ -3884,7 +4019,7 @@ Scene.prototype.initializeFrame = function () {
         }
 
         this._globeHeight = updatedCartographic.height;
-      }
+      },
     );
   }
   this._cameraUnderground = isCameraUnderground(this);
@@ -3920,7 +4055,7 @@ function updateDebugShowFramesPerSecond(scene, renderedThisFrame) {
     scene._performanceDisplay =
       scene._performanceDisplay && scene._performanceDisplay.destroy();
     scene._performanceContainer.parentNode.removeChild(
-      scene._performanceContainer
+      scene._performanceContainer,
     );
   }
 }
@@ -3929,8 +4064,7 @@ function prePassesUpdate(scene) {
   scene._jobScheduler.resetBudgets();
 
   const frameState = scene._frameState;
-  const primitives = scene.primitives;
-  primitives.prePassesUpdate(frameState);
+  scene.primitives.prePassesUpdate(frameState);
 
   if (defined(scene.globe)) {
     scene.globe.update(frameState);
@@ -3941,20 +4075,23 @@ function prePassesUpdate(scene) {
 }
 
 function postPassesUpdate(scene) {
-  const frameState = scene._frameState;
-  const primitives = scene.primitives;
-  primitives.postPassesUpdate(frameState);
-
+  scene.primitives.postPassesUpdate(scene._frameState);
   RequestScheduler.update();
 }
 
 const scratchBackgroundColor = new Color();
 
+/**
+ * Render the scene
+ *
+ * @param {Scene} scene
+ * @private
+ */
 function render(scene) {
   const frameState = scene._frameState;
 
   const context = scene.context;
-  const us = context.uniformState;
+  const { uniformState } = context;
 
   const view = scene._defaultView;
   scene._view = view;
@@ -3976,13 +4113,16 @@ function render(scene) {
   frameState.atmosphere = scene.atmosphere;
   scene.fog.update(frameState);
 
-  us.update(frameState);
+  uniformState.update(frameState);
 
   const shadowMap = scene.shadowMap;
   if (defined(shadowMap) && shadowMap.enabled) {
     if (!defined(scene.light) || scene.light instanceof SunLight) {
       // Negate the sun direction so that it is from the Sun, not to the Sun
-      Cartesian3.negate(us.sunDirectionWC, scene._shadowMapCamera.direction);
+      Cartesian3.negate(
+        uniformState.sunDirectionWC,
+        scene._shadowMapCamera.direction,
+      );
     } else {
       Cartesian3.clone(scene.light.direction, scene._shadowMapCamera.direction);
     }
@@ -4081,7 +4221,7 @@ Scene.prototype.render = function (time) {
     defined(this._lastRenderTime)
   ) {
     const difference = Math.abs(
-      JulianDate.secondsDifference(this._lastRenderTime, time)
+      JulianDate.secondsDifference(this._lastRenderTime, time),
     );
     shouldRender = shouldRender || difference > this.maximumRenderTimeChange;
   }
@@ -4095,7 +4235,7 @@ Scene.prototype.render = function (time) {
     const frameNumber = CesiumMath.incrementWrap(
       frameState.frameNumber,
       15000000.0,
-      1.0
+      1.0,
     );
     updateFrameNumber(this, frameNumber, time);
     frameState.newFrame = true;
@@ -4104,9 +4244,7 @@ Scene.prototype.render = function (time) {
   tryAndCatchError(this, prePassesUpdate);
 
   /**
-   *
    * Passes update. Add any passes here
-   *
    */
   if (this.primitives.show) {
     tryAndCatchError(this, updateMostDetailedRayPicks);
@@ -4126,14 +4264,13 @@ Scene.prototype.render = function (time) {
   }
 
   /**
-   *
    * Post passes update. Execute any pass invariant code that should run after the passes here.
-   *
    */
   updateDebugShowFramesPerSecond(this, shouldRender);
   tryAndCatchError(this, postPassesUpdate);
 
-  // Often used to trigger events (so don't want in trycatch) that the user might be subscribed to. Things like the tile load events, promises, etc.
+  // Often used to trigger events (so don't want in trycatch) that the user
+  // might be subscribed to. Things like the tile load events, promises, etc.
   // We don't want those events to resolve during the render loop because the events might add new primitives
   callAfterRenderFunctions(this);
 
@@ -4171,7 +4308,7 @@ Scene.prototype.requestRender = function () {
 Scene.prototype.clampLineWidth = function (width) {
   return Math.max(
     ContextLimits.minimumAliasedLineWidth,
-    Math.min(width, ContextLimits.maximumAliasedLineWidth)
+    Math.min(width, ContextLimits.maximumAliasedLineWidth),
   );
 };
 
@@ -4234,7 +4371,7 @@ Scene.prototype.pickVoxel = function (windowPosition, width, height) {
     this,
     windowPosition,
     width,
-    height
+    height,
   );
   // Look up the keyframeNode containing this picked cell
   const tileIndex = 255 * voxelCoordinate[0] + voxelCoordinate[1];
@@ -4250,10 +4387,94 @@ Scene.prototype.pickVoxel = function (windowPosition, width, height) {
     voxelPrimitive,
     tileIndex,
     sampleIndex,
-    keyframeNode
+    keyframeNode,
   );
 };
 
+/**
+ * Pick a metadata value at the given window position.
+ *
+ * @param {Cartesian2} windowPosition Window coordinates to perform picking on.
+ * @param {string|undefined} schemaId The ID of the metadata schema to pick values
+ * from. If this is `undefined`, then it will pick the values from the object
+ * that match the given class- and property name, regardless of the schema ID.
+ * @param {string} className The name of the metadata class to pick
+ * values from
+ * @param {string} propertyName The name of the metadata property to pick
+ * values from
+ * @returns The metadata value
+ *
+ * @experimental This feature is not final and is subject to change without Cesium's standard deprecation policy.
+ */
+Scene.prototype.pickMetadata = function (
+  windowPosition,
+  schemaId,
+  className,
+  propertyName,
+) {
+  //>>includeStart('debug', pragmas.debug);
+  Check.typeOf.object("windowPosition", windowPosition);
+  Check.typeOf.string("className", className);
+  Check.typeOf.string("propertyName", propertyName);
+  //>>includeEnd('debug');
+
+  const pickedObject = this.pick(windowPosition);
+  if (!defined(pickedObject)) {
+    return undefined;
+  }
+
+  // Check if the picked object is a model that has structural
+  // metadata, with a schema that contains the specified
+  // property.
+  const schema = pickedObject.detail?.model?.structuralMetadata?.schema;
+  const classProperty = getMetadataClassProperty(
+    schema,
+    schemaId,
+    className,
+    propertyName,
+  );
+  if (!defined(classProperty)) {
+    return undefined;
+  }
+
+  const pickedMetadataInfo = new PickedMetadataInfo(
+    schemaId,
+    className,
+    propertyName,
+    classProperty,
+  );
+
+  const pickedMetadataValues = this._picking.pickMetadata(
+    this,
+    windowPosition,
+    pickedMetadataInfo,
+  );
+
+  return pickedMetadataValues;
+};
+
+/**
+ * Pick the schema of the metadata of the object at the given position
+ *
+ * @param {Cartesian2} windowPosition Window coordinates to perform picking on.
+ * @returns {MetadataSchema} The metadata schema, or `undefined` if there is no object with
+ * associated metadata at the given position.
+ *
+ * @experimental This feature is not final and is subject to change without Cesium's standard deprecation policy.
+ */
+Scene.prototype.pickMetadataSchema = function (windowPosition) {
+  //>>includeStart('debug', pragmas.debug);
+  Check.typeOf.object("windowPosition", windowPosition);
+  //>>includeEnd('debug');
+
+  const pickedObject = this.pick(windowPosition);
+  if (!defined(pickedObject)) {
+    return undefined;
+  }
+  const schema = pickedObject.detail?.model?.structuralMetadata?.schema;
+  return schema;
+};
+
 /**
  * Returns the cartesian position reconstructed from the depth buffer and window position.
  * The returned position is in world coordinates. Used internally by camera functions to
@@ -4273,12 +4494,12 @@ Scene.prototype.pickVoxel = function (windowPosition, width, height) {
  */
 Scene.prototype.pickPositionWorldCoordinates = function (
   windowPosition,
-  result
+  result,
 ) {
   return this._picking.pickPositionWorldCoordinates(
     this,
     windowPosition,
-    result
+    result,
   );
 };
 
@@ -4355,7 +4576,7 @@ function updateRequestRenderModeDeferCheckPass(scene) {
   // Check if any ignored requests are ready to go (to wake rendering up again)
   scene.primitives.updateForPass(
     scene._frameState,
-    requestRenderModeDeferCheckPassState
+    requestRenderModeDeferCheckPassState,
   );
 }
 
@@ -4407,14 +4628,14 @@ Scene.prototype.drillPickFromRay = function (
   ray,
   limit,
   objectsToExclude,
-  width
+  width,
 ) {
   return this._picking.drillPickFromRay(
     this,
     ray,
     limit,
     objectsToExclude,
-    width
+    width,
   );
 };
 
@@ -4434,13 +4655,13 @@ Scene.prototype.drillPickFromRay = function (
 Scene.prototype.pickFromRayMostDetailed = function (
   ray,
   objectsToExclude,
-  width
+  width,
 ) {
   return this._picking.pickFromRayMostDetailed(
     this,
     ray,
     objectsToExclude,
-    width
+    width,
   );
 };
 
@@ -4462,14 +4683,14 @@ Scene.prototype.drillPickFromRayMostDetailed = function (
   ray,
   limit,
   objectsToExclude,
-  width
+  width,
 ) {
   return this._picking.drillPickFromRayMostDetailed(
     this,
     ray,
     limit,
     objectsToExclude,
-    width
+    width,
   );
 };
 
@@ -4534,14 +4755,14 @@ Scene.prototype.clampToHeight = function (
   cartesian,
   objectsToExclude,
   width,
-  result
+  result,
 ) {
   return this._picking.clampToHeight(
     this,
     cartesian,
     objectsToExclude,
     width,
-    result
+    result,
   );
 };
 
@@ -4576,13 +4797,13 @@ Scene.prototype.clampToHeight = function (
 Scene.prototype.sampleHeightMostDetailed = function (
   positions,
   objectsToExclude,
-  width
+  width,
 ) {
   return this._picking.sampleHeightMostDetailed(
     this,
     positions,
     objectsToExclude,
-    width
+    width,
   );
 };
 
@@ -4616,13 +4837,13 @@ Scene.prototype.sampleHeightMostDetailed = function (
 Scene.prototype.clampToHeightMostDetailed = function (
   cartesians,
   objectsToExclude,
-  width
+  width,
 ) {
   return this._picking.clampToHeightMostDetailed(
     this,
     cartesians,
     objectsToExclude,
-    width
+    width,
   );
 };
 
@@ -4696,15 +4917,14 @@ function setTerrain(scene, terrain) {
   }
   // Otherwise, set a placeholder
   scene.globe.terrainProvider = undefined;
-  scene._removeTerrainProviderReadyListener = terrain.readyEvent.addEventListener(
-    (provider) => {
+  scene._removeTerrainProviderReadyListener =
+    terrain.readyEvent.addEventListener((provider) => {
       if (defined(scene) && defined(scene.globe)) {
         scene.globe.terrainProvider = provider;
       }
 
       scene._removeTerrainProviderReadyListener();
-    }
-  );
+    });
 }
 
 /**
@@ -4814,7 +5034,7 @@ Scene.prototype.destroy = function () {
     this._performanceDisplay =
       this._performanceDisplay && this._performanceDisplay.destroy();
     this._performanceContainer.parentNode.removeChild(
-      this._performanceContainer
+      this._performanceContainer,
     );
   }