The Level Of Detail LOD Object in threejs is an Object3d class based object that can be composed of a collection of mesh objects where each mesh object is a differing degree of detail for the same LOD Object. It is then possible to set a camera distance for each of these mesh objects that are added to the LOD object so that as an object moves away from the camera the level of detail will go down. Therefore the use of LOD objects is one way to help go about reduce the volume of work that needs to be done when rendering a frame, therefore helping to improve Frame Rate.
The Lod Object should be used in conjunction with some kind of constant value, or set of constant values and user details to define a max render distance. LOD Objects are great for objects that in in that render distance, but there is also still what should happen when an object goes out of that render distance as well. Speaking of that there is of course the near and far values of camera objects.
The visible boolean of Object3d based objects is another related feature of threejs that comes to mind when it comes to LOD Objects. Where LOD can be used to set level of details between the camera, and a max distance of the camera, and the far value of a camera object can be used to set the max render distance, the visible boolean can be used to make it so that certain objects in the range will just not render at all.
A LOD Object is just like that of a Mesh, Camera, or Group object in the sense that it is an Object3d class based object. Which means that once one has a LOD object it can be added as a child of the main scene object of a project. Also just as with any object3d Object setting the position, rotation, and so forth is the same as any other sense the position, rotation, and quaternion properties are all Object3d class properties.
However what sets LOD apart from many other Objects is how to go about adding Mesh objects to the LOD. There is not just the add method, but now also the addLevel method as well and there are two very important differences to these methods. The add method is a common Object3d class method that is used to add an object as a child of a parent object, where the addLevel method of the LOD class is used to set a Level of detail object for the parent object.
For this basic example I am adding three mesh objects to an LOD Object by way of the add level method. When calling the add level method I pass the mesh object as the first argument, and then a distance value that is the distance from that camera at which the given mesh object will be used to define the level of detail. So with that said when creating the geometry for these mesh objects I am using the Sphere geometry constructor and passing differing values for the number of width and height segments.
When this example is up and running the LOD object moved back and forth along the z axis, and as it move further away from the camera the level of detail does indeed go down. As it moves back closer to the camera the detail then goes back up just as I would exspect. So then that is the basic idea of this LOD object then working just fine. From this point forward there is then just maybe working out a few more demos of this feature of the Librray that is just more of the same then.
The use of LOD objects is then one of many features that help to increase performance, along with other features such as the visible boolean of the Object3d class. There are a lot of little details though with the use of LOD, and many other features, such as what is a good max render distance, and how many levels of detail there should be. There is trying to come up with some kind of decent fixed constant value, but of course this is something that should be part of a graphics menu allowing users to adjust this between a min and max constant value.
There might be a lot more to write about when it comes to all kinds of little tricks with this also. For example when it comes to rendering trees there is having a hide detail geometry, and medium detail geometry, and then a plain old 2d image of the tree used to skin a plain geometry that is always facing the camera.