Cesium中Entity与Primitive绘制对象的效率对比

前面总结完了entity与primitive两个接口的用法：entity用法简单，primitive用法复杂。我们会有这样的疑问：entity已经封装的如此完美，调用如此便捷，为何还要primitive接口呢？区别就是加载效率。primitive更接近webgl底层，没有entity各种各样的附加属性，因此在加载时效率会更高。为了直观感受两者区别，我们分别用entity和primitive方式绘制3150个圆。

1、entity方式

        for (var lon = -180.0; lon < 180.0;lon += 4.0) {
            for(var lat = -70.0; lat < 70.0; lat += 4.0) {
                viewer.entities.add({
                    position:Cesium.Cartesian3.fromDegrees(lon, lat),
                    ellipse:{
                        semiMinorAxis:10000.0,
                        semiMajorAxis:10000.0,
                        //height:200000.0,
                        material:Cesium.Color.GREEN
                    }
                });
            }
        }

查看浏览器内存消耗情况：

image.png

2、primitive方式

        var instances = [];
        for(var lon = -180.0; lon < 180.0; lon += 4.0) {
            for(var lat = -70.0; lat < 70.0; lat += 4.0) {
                varellipse = new Cesium.EllipseGeometry({
                    center:Cesium.Cartesian3.fromDegrees(lon, lat),
                    semiMajorAxis:10000.0,
                    semiMinorAxis:10000.0,
                    vertexFormat:Cesium.VertexFormat.POSITION_ONLY
                });
                vargeometry = Cesium.EllipseGeometry.createGeometry(ellipse);
                varellipseInstance = new Cesium.GeometryInstance({
                    geometry:geometry,
                    attributes:{
                        color:Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.RED)
                    }
                });
                instances.push(ellipseInstance);
            }
        }
 
        viewer.scene.primitives.add(newCesium.Primitive({
            geometryInstances:instances,
            appearance:new Cesium.PerInstanceColorAppearance()
        }));

查看浏览器内存消耗情况：

image.png

我们可以看到primitive内存消耗远低于entity，加载时间也是远低于entity。
当添加对象超过1w时entity方式直接导致浏览器崩溃。