<p dir="auto">After an object was removed from scene, it is still referenced by renderItems.  I clear renderItems as below. But the object may be referenced by opaque or transparent. Once I clear opaque and transparent, nothing is rendered(only background color)! I don't how to get it fixed. Could you please double check if the original code is correct and if not how to fix it?</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="`function WebGLRenderList() {

	var renderItems = [];
	var renderItemsIndex = 0;

	var opaque = [];
	var transparent = [];

	function init() {

		renderItemsIndex = 0;
		opaque.length = 0;
		transparent.length = 0;

		# renderItems = [];
	}`"><pre class="notranslate"><code class="notranslate">`function WebGLRenderList() {

	var renderItems = [];
	var renderItemsIndex = 0;

	var opaque = [];
	var transparent = [];

	function init() {

		renderItemsIndex = 0;
		opaque.length = 0;
		transparent.length = 0;

		# renderItems = [];
	}`
</code></pre></div>
<h5 dir="auto">Three.js version</h5>
<ul dir="auto">
<li>r88</li>
</ul>
<h5 dir="auto">Description of the problem</h5>
<p dir="auto">The created objects (mesh/material/geometry) are not released, after disposed in Three.js R87, while all released in Three.js R86, with the same code.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var container;

var camera, scene, renderer;

init();
animate();

function init() {
	container = document.createElement( 'div' );
	document.body.appendChild( container );

	camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
	camera.position.z = 100;

	scene = new THREE.Scene();

	renderer = new THREE.WebGLRenderer();
	renderer.setPixelRatio( window.devicePixelRatio );
	renderer.setSize( window.innerWidth, window.innerHeight );
	container.appendChild( renderer.domElement );
}

function animate() {
	requestAnimationFrame( animate );
	renderer.render( scene, camera );
}

var planes = [];
function testplanes(){
	for(var i=0; i&lt;100; i++){
		var m = new THREE.Mesh( 	new THREE.PlaneBufferGeometry( 1, 1 ), 
									new THREE.MeshBasicMaterial( {color: 0x010101*i } ));
		m.position.x = -50+i;
		scene.add( m );
		planes.push(m);
	}
}			

function delplanes(){
	for(var i=0; i&lt;100; i++){
		scene.remove(planes[i]);	
		planes[i].geometry.dispose();
		planes[i].material.dispose();
		planes[i] = null;
	}	
}"><pre class="notranslate"><code class="notranslate">var container;

var camera, scene, renderer;

init();
animate();

function init() {
	container = document.createElement( 'div' );
	document.body.appendChild( container );

	camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
	camera.position.z = 100;

	scene = new THREE.Scene();

	renderer = new THREE.WebGLRenderer();
	renderer.setPixelRatio( window.devicePixelRatio );
	renderer.setSize( window.innerWidth, window.innerHeight );
	container.appendChild( renderer.domElement );
}

function animate() {
	requestAnimationFrame( animate );
	renderer.render( scene, camera );
}

var planes = [];
function testplanes(){
	for(var i=0; i&lt;100; i++){
		var m = new THREE.Mesh( 	new THREE.PlaneBufferGeometry( 1, 1 ), 
									new THREE.MeshBasicMaterial( {color: 0x010101*i } ));
		m.position.x = -50+i;
		scene.add( m );
		planes.push(m);
	}
}			

function delplanes(){
	for(var i=0; i&lt;100; i++){
		scene.remove(planes[i]);	
		planes[i].geometry.dispose();
		planes[i].material.dispose();
		planes[i] = null;
	}	
}
</code></pre></div>
<p dir="auto">Typing testplanes() in console, then typing delplanes();<br>
100 Meshes, 100 MeshBasicMaterial, and 100 PlaneBufferGeometry, remain in memory,  with memory profiling of heap snapshot,  in Three.js R87.  While all released in Three.js R86.</p>
<h5 dir="auto">Three.js version</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Dev</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r87</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> ...</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Chrome</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Firefox</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Internet Explorer</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Windows</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> macOS</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Linux</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Android</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> iOS</li>
</ul>
<h5 dir="auto">Hardware Requirements (graphics card, VR Device, ...)</h5>