Intersection of dynamically drawn object with already rendered object/object's of scene

Hello Forum,
I have been facing following issue,
I am creating a text with mouseClick event on the Rectangular shapes, But sometimes the rendered text getting clipped inside the Rectangular shape, hence I am not able to see the text clearly. It’s like half text is outside the shape and half of the text in inside the shape.
And there are like 10000 (approximately) of shapes in the scene.

To think of solution I came up with using the intersection in three.js and translating text in particular direction until the intersection is gone.
The above one is just one of the approach that I came up with suggestion’s/approaches are welcomed.

Now since the text is getting created on random rectangular shape hence I don’t have the second intersecting object to use the mesh.intersect(mesh, tolerance) API.

So I tried checking intersection of text with scene.children.

But this is time consuming.

Let me know your thoughts/solutions.

*** Shape can be anything Rectangular is just for understanding the problem statement.

Thanks !!.