diff --git a/rendering/cases/multiple-layers/expected.png b/rendering/cases/multiple-layers/expected.png
index cfd9539cb2..1de3ad3f72 100644
Binary files a/rendering/cases/multiple-layers/expected.png and b/rendering/cases/multiple-layers/expected.png differ
diff --git a/rendering/cases/multiple-layers/main.js b/rendering/cases/multiple-layers/main.js
index 3757625468..c5dd78ae69 100644
--- a/rendering/cases/multiple-layers/main.js
+++ b/rendering/cases/multiple-layers/main.js
@@ -4,8 +4,10 @@ import {Vector as VectorLayer, Tile as TileLayer} from '../../../src/ol/layer.js
 import {Vector as VectorSource, XYZ} from '../../../src/ol/source.js';
 import GeoJSON from '../../../src/ol/format/GeoJSON.js';
 import {Style, Stroke} from '../../../src/ol/style.js';
+import Feature from '../../../src/ol/Feature.js';
+import Point from '../../../src/ol/geom/Point.js';
 
-new Map({
+const map = new Map({
   layers: [
     new TileLayer({
       source: new XYZ({
@@ -14,6 +16,7 @@ new Map({
       })
     }),
     new VectorLayer({
+      zIndex: 1,
       style: new Style({
         stroke: new Stroke({
           color: 'rgba(255,255,255,0.5)',
@@ -33,4 +36,11 @@ new Map({
   })
 });
 
+const unmanaged = new VectorLayer({
+  source: new VectorSource({
+    features: [new Feature(new Point([0, 0]))]
+  })
+});
+unmanaged.setMap(map);
+
 render();
diff --git a/src/ol/layer/Base.js b/src/ol/layer/Base.js
index 0921af2c2b..3754ba1049 100644
--- a/src/ol/layer/Base.js
+++ b/src/ol/layer/Base.js
@@ -83,19 +83,20 @@ class BaseLayer extends BaseObject {
   }
 
   /**
+   * @param {boolean=} opt_managed Layer is managed.
    * @return {import("./Layer.js").State} Layer state.
    */
-  getLayerState() {
+  getLayerState(opt_managed) {
     /** @type {import("./Layer.js").State} */
     const state = this.state_ || /** @type {?} */ ({
       layer: this,
-      managed: true
+      managed: opt_managed === undefined ? true : opt_managed
     });
     state.opacity = clamp(Math.round(this.getOpacity() * 100) / 100, 0, 1);
     state.sourceState = this.getSourceState();
     state.visible = this.getVisible();
     state.extent = this.getExtent();
-    state.zIndex = this.getZIndex() || 0;
+    state.zIndex = this.getZIndex() || (state.managed === false ? Infinity : 0);
     state.maxResolution = this.getMaxResolution();
     state.minResolution = Math.max(this.getMinResolution(), 0);
     this.state_ = state;
diff --git a/src/ol/layer/Layer.js b/src/ol/layer/Layer.js
index 7981a0f288..1c9f916c47 100644
--- a/src/ol/layer/Layer.js
+++ b/src/ol/layer/Layer.js
@@ -212,12 +212,7 @@ class Layer extends BaseLayer {
     if (map) {
       this.mapPrecomposeKey_ = listen(map, RenderEventType.PRECOMPOSE, function(evt) {
         const renderEvent = /** @type {import("../render/Event.js").default} */ (evt);
-        const layerState = this.getLayerState();
-        layerState.managed = false;
-        if (this.getZIndex() === undefined) {
-          layerState.zIndex = Infinity;
-        }
-        renderEvent.frameState.layerStatesArray.push(layerState);
+        renderEvent.frameState.layerStatesArray.push(this.getLayerState(false));
       }, this);
       this.mapRenderKey_ = listen(this, EventType.CHANGE, map.render, map);
       this.changed();
diff --git a/src/ol/renderer/Composite.js b/src/ol/renderer/Composite.js
index fa1e3b2716..6d2ef225ab 100644
--- a/src/ol/renderer/Composite.js
+++ b/src/ol/renderer/Composite.js
@@ -94,7 +94,7 @@ class CompositeMapRenderer extends MapRenderer {
       if (element) {
         const zIndex = layerState.zIndex;
         if (zIndex !== element.style.zIndex) {
-          element.style.zIndex = zIndex;
+          element.style.zIndex = zIndex === Infinity ? Number.MAX_SAFE_INTEGER : zIndex;
         }
         this.children_.push(element);
       }