diff --git a/src/mol-canvas3d/helper/bounding-sphere-helper.ts b/src/mol-canvas3d/helper/bounding-sphere-helper.ts
index 1101e7881740dd54b9545f0abc88d72dfe3e4f90..48562b323419199ab9e66b00c5871bc3da3253fb 100644
--- a/src/mol-canvas3d/helper/bounding-sphere-helper.ts
+++ b/src/mol-canvas3d/helper/bounding-sphere-helper.ts
@@ -50,12 +50,12 @@ export class BoundingSphereHelper {
 
         this.parent.forEach((r, ro) => {
             const objectData = this.objectsData.get(ro)
-            const newObjectData = updateBoundingSphereData(this.scene, r.boundingSphere, objectData, ColorNames.tomato)
+            const newObjectData = updateBoundingSphereData(this.scene, r.values.boundingSphere.ref.value, objectData, ColorNames.tomato)
             if (newObjectData) this.objectsData.set(ro, newObjectData)
 
             if (ro.type === 'mesh' || ro.type === 'lines' || ro.type === 'points') {
                 const instanceData = this.instancesData.get(ro)
-                const newInstanceData = updateBoundingSphereData(this.scene, r.invariantBoundingSphere, instanceData, ColorNames.skyblue, {
+                const newInstanceData = updateBoundingSphereData(this.scene, r.values.invariantBoundingSphere.ref.value, instanceData, ColorNames.skyblue, {
                     aTransform: ro.values.aTransform,
                     transform: ro.values.transform,
                     uInstanceCount: ro.values.uInstanceCount,
diff --git a/src/mol-gl/renderable.ts b/src/mol-gl/renderable.ts
index ea90276e73d925c6261b00dbffeceba0f8d5362e..f61ca5f5bdadf2ff118757df8cb22bdca3ffedfa 100644
--- a/src/mol-gl/renderable.ts
+++ b/src/mol-gl/renderable.ts
@@ -7,8 +7,6 @@
 import { Program } from './webgl/program';
 import { RenderableValues, Values, RenderableSchema } from './renderable/schema';
 import { RenderVariant, RenderItem } from './webgl/render-item';
-import { Sphere3D } from 'mol-math/geometry';
-import { Vec3 } from 'mol-math/linear-algebra';
 import { ValueCell } from 'mol-util';
 import { idFactory } from 'mol-util/id-factory';
 
@@ -24,9 +22,6 @@ export interface Renderable<T extends RenderableValues> {
     readonly id: number
     readonly values: T
     readonly state: RenderableState
-    readonly boundingSphere: Sphere3D
-    readonly invariantBoundingSphere: Sphere3D
-    readonly z: number
 
     render: (variant: RenderVariant) => void
     getProgram: (variant: RenderVariant) => Program
@@ -35,28 +30,10 @@ export interface Renderable<T extends RenderableValues> {
 }
 
 export function createRenderable<T extends Values<RenderableSchema>>(renderItem: RenderItem, values: T, state: RenderableState): Renderable<T> {
-    const boundingSphere: Sphere3D = Sphere3D.create(Vec3.zero(), 0)
-    const invariantBoundingSphere: Sphere3D = Sphere3D.create(Vec3.zero(), 0)
-
     return {
         id: getNextRenderableId(),
         values,
         state,
-        get boundingSphere () {
-            if (values.boundingSphere) {
-                Sphere3D.copy(boundingSphere, values.boundingSphere.ref.value)
-            }
-            return boundingSphere
-        },
-        get invariantBoundingSphere () {
-            if (values.invariantBoundingSphere) {
-                Sphere3D.copy(invariantBoundingSphere, values.invariantBoundingSphere.ref.value)
-            }
-            return invariantBoundingSphere
-        },
-        get z () {
-            return boundingSphere.center[2]
-        },
 
         render: (variant: RenderVariant) => {
             if (values.uPickable) {
diff --git a/src/mol-gl/scene.ts b/src/mol-gl/scene.ts
index 316a8e38650c4598c02fe638f045e6f7f9ec1dcc..d744286b1f619c027f43c5ef2dbeb3260ed98a81 100644
--- a/src/mol-gl/scene.ts
+++ b/src/mol-gl/scene.ts
@@ -18,15 +18,15 @@ function calculateBoundingSphere(renderables: Renderable<RenderableValues & Base
     boundaryHelper.reset(0.1);
 
     for (let i = 0, il = renderables.length; i < il; ++i) {
-        const r = renderables[i]
-        if (!r.boundingSphere.radius) continue;
-        boundaryHelper.boundaryStep(r.boundingSphere.center, r.boundingSphere.radius);
+        const boundingSphere = renderables[i].values.boundingSphere.ref.value
+        if (!boundingSphere.radius) continue;
+        boundaryHelper.boundaryStep(boundingSphere.center, boundingSphere.radius);
     }
     boundaryHelper.finishBoundaryStep();
     for (let i = 0, il = renderables.length; i < il; ++i) {
-        const r = renderables[i]
-        if (!r.boundingSphere.radius) continue;
-        boundaryHelper.extendStep(r.boundingSphere.center, r.boundingSphere.radius);
+        const boundingSphere = renderables[i].values.boundingSphere.ref.value
+        if (!boundingSphere.radius) continue;
+        boundaryHelper.extendStep(boundingSphere.center, boundingSphere.radius);
     }
 
     Vec3.copy(boundingSphere.center, boundaryHelper.center);
@@ -35,16 +35,18 @@ function calculateBoundingSphere(renderables: Renderable<RenderableValues & Base
     return boundingSphere;
 }
 
-function renderableSort(a: Renderable<any>, b: Renderable<any>) {
+function renderableSort(a: Renderable<RenderableValues & BaseValues>, b: Renderable<RenderableValues & BaseValues>) {
     const drawProgramIdA = a.getProgram('draw').id
     const drawProgramIdB = b.getProgram('draw').id
+    const zA = a.values.boundingSphere.ref.value.center[2]
+    const zB = a.values.boundingSphere.ref.value.center[2]
 
     if (drawProgramIdA !== drawProgramIdB) {
         return drawProgramIdA - drawProgramIdB; // sort by program id to minimize gl state changes
-    } else if (a.z !== b.z) {
+    } else if (zA !== zB) {
         return a.state.opaque
-            ? a.z - b.z // when opaque draw closer elements first to minimize overdraw
-            : b.z - a.z // when transparent draw elements last to maximize partial visibility
+            ? zA - zB // when opaque draw closer elements first to minimize overdraw
+            : zB - zA // when transparent draw elements last to maximize partial visibility
     } else {
         return a.id - b.id;
     }
@@ -60,7 +62,7 @@ interface Scene extends Object3D {
     remove: (o: RenderObject) => void
     has: (o: RenderObject) => boolean
     clear: () => void
-    forEach: (callbackFn: (value: Renderable<any>, key: RenderObject) => void) => void
+    forEach: (callbackFn: (value: Renderable<RenderableValues & BaseValues>, key: RenderObject) => void) => void
 }
 
 namespace Scene {