Performance with small polygons in 3D mode

[Andries Olivier]

I've noticed a massive performance drop zooming / panning about 10 000 polygons (just material and outline color) in 3D mode. When I switch to 2D, user actions such as zooming / panning is seamless with a good frame rate. The data is fairly small polygons and only visible below 200 meters. These geometries are added as entities (not primitives) as interaction such as selection is required. Must be stated that for testing purposes, we only used one data source and manually added the geometries as entities. Secondly, we switched over to czml, streaming packets, and yet get the same sluggish behavior. Must be noted that it is only on very low zoom levels (below 200 meters). Data is just added, without any blocking callbacks / events on a entity. Also, standard configuration of the viewer and scene is used, without terrain modeling. 

Current configuration:

      Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(0.0, -90.0, 45.0, 90.0);

      _viewer = new Cesium.Viewer("cesiumContainer", {

            timeline: false,

            animation: false,

            baseLayerPicker: false, 

            mapMode2D: Cesium.MapMode2D.ROTATE,

            homeButton: false,

            fullscreenButton: false,

            geocoder: false,

            selectionIndicator: true,

            infoBox: false,

            sceneModePicker: false,

            navigationHelpButton: false,

            imageryProvider: basemapProvider,

            navigationInstructionsInitiallyVisible: false

        });

        var imageryLayers = _viewer.scene.imageryLayers;

        var layer = imageryLayers.get(0);

        layer.brightness = 1.66;

        layer.contrast = 0.98;

        layer.hue = 0;

        layer.saturation = 0.12;

        layer.gamma = 0.64;

        _viewer.scene.debugShowFramesPerSecond = true;

        _viewer.scene.skyBox.show = false;

        _viewer.scene.sun.show = false;

        _viewer.scene.moon.show = false;

        _viewer.scene.skyAtmosphere.show = false;

        _viewer.scene.globe.enableLighting = false;

        _viewer.scene.globe.baseColor = Cesium.Color.BLACK;

        _viewer.scene.globe.showWaterEffect = false;

        _viewer.scene.fog.enabled = false;

For example, here a sample of a polygon:

var viewer = new Cesium.Viewer('cesiumContainer');

var smallPolygon = viewer.entities.add({

    name : 'Red polygon on surface',

    polygon : {

        hierarchy : Cesium.Cartesian3.fromDegreesArray([

            27.2747099421817, -25.60108977515325,

            27.274709150589174, -25.601113652028488,

            27.27472252196618, -25.601136392020674,

            27.2747224601031, -25.601174664970276,

            27.274735483425083, -25.601175777853587,

            27.274747320254114, -25.60117171169012,

            27.27480902991559, -25.60115443613326,

            27.274851417384834, -25.6011371336864,

            27.274900758640445, -25.601117841325756,

            27.27492124935889, -25.60111084328236,

            27.274939898269473, -25.601108118286657,

            27.274993484092036, -25.60109052394304,

            27.275028164504903, -25.60108537673233,

            27.275054080340446, -25.601086997906502,

            27.275062098454974, -25.601128153198367,

            27.27506835401938, -25.60112990161953,

            27.27507483777725, -25.601126964799768,

            27.275071461303934, -25.601056554555057,

            27.2750718196103, -25.60102172018674,

            27.27507936103499, -25.60101116291679,

            27.275096311518336, -25.601001418392602,

            27.275094710012627, -25.60098889246872,

            27.27508925501885, -25.60097157163726,

            27.275087367389122, -25.600951463897686,

            27.275089145387877, -25.600928009415334,

            27.27508313718588, -25.60083858504905,

            27.275076372390273, -25.600845476722813,

            27.2750666706811, -25.600855360391964,

            27.275066491536432, -25.600890185397396,

            27.27506937018571, -25.600951858820245,

            27.275070524925716, -25.60099101408948,

            27.275071156207044, -25.600994081082547,

            27.275053781858926, -25.600995694291356,

            27.27505117223284, -25.60097328612354,

            27.27503839350152, -25.60097029527289,

            27.275015390831466, -25.60097580866637,

            27.274996161847223, -25.600977343249827,

            27.27498403908589, -25.600982601483853,

            27.274925681804482, -25.60099879664417,

            27.274879334314992, -25.601016927978836,

            27.274872789605293, -25.601023683161305,

            27.27485514686277, -25.601031082041924,

            27.274826020267152, -25.601040181455424,

            27.274819749228648, -25.60104472460128,

            27.274800623388007, -25.601047838622282,

            27.274754225821276, -25.60105714198523,

            27.2747369454194, -25.601057571626473,

            27.274733949365757, -25.60105580632495,

            27.2747099421817, -25.60108977515325]),

        material: Cesium.Color.WHITE.withAlpha(0.5),

        height: 0,

        outline: true,

        outlineColor: Cesium.Color.WHITE

    }

});

viewer.zoomTo(viewer.entities);

Just a few questions on this:

1. I've read through the documentation / forums and tried various performance tweaking, but still get slow user interaction with regards to panning / zooming. Since the user experience in 2D is great, what would cause this in 3D? Don't think it's related to the amount of data (geometries). Should I rather switch to primitives, and discard entities?
2. There is a bug on the mouse wheel when zooming in on these smaller polygons, where it just all the sudden snaps to the opposite side of the globe. Any tips to prevent this? The delta on the mouse-wheel on such a low levels is also not ideal.
3. What would cause this semi-transparent circle in the center of the screen? See attached image. Is it part of some internal diagnostics? Verified on Firefox and Chrome (latest versions)

I'm using the latest version (1.30)..

Any advice / tips for improvement will be appreciated.

Andries

[Hannah Pinkos]

Hello,

1. I've read through the documentation / forums and tried various performance tweaking, but still get slow user interaction with regards to panning / zooming. Since the user experience in 2D is great, what would cause this in 3D? Don't think it's related to the amount of data (geometries). Should I rather switch to primitives, and discard entities?

I'm surprised you're seeing better performance in 2D than 3D.  I haven't seen that issue before.  I don't think switching to primitives would give you any better performance, the entity layer uses the primitive layer optimally.  You can try using a higher granularity to see if that helps.

2. There is a bug on the mouse wheel when zooming in on these smaller polygons, where it just all the sudden snaps to the opposite side of the globe. Any tips to prevent this? The delta on the mouse-wheel on such a low levels is also not ideal.

 

We just fixed this bug and it will be included in the 1.31 release available on March 1st

3.What would cause this semi-transparent circle in the center of the screen? See attached image. Is it part of some internal diagnostics? Verified on Firefox and Chrome (latest versions)

 

That circle looks like a multi-frustum artifact to me.  I haven't seen something like that come up recently in our testing, do you have a code example that reproduces that?

Best,

Hannah

[Andries Olivier]

Hi Hannah,

Appreciate the feedback. Before we start tweaking settings such granularity on polygons, please look at the file (GeoJSON, about 10Mb) shared for illustration purposes. Unfortunately the file size is slightly bigger than allowed in the forums.. What is important is than cesium struggles with the actual geometries, and is not related to the data source itself (ie  GeoJSON, CZML, or manually adding entities and / or primitives). The link to the file below contains about 10K polygons, which are pretty small:

https://drive.google.com/drive/folders/0B6E-SIBD0O8kSGE0WVBRNDE3N00?usp=sharing 

This affects general user interaction such as panning and zooming in 3D, and is very sluggish and slow. When switching to 2D, general performance is much better. Although I do get the occasional error zooming:

An error occurred while rendering. Rendering has stopped.

RangeError: Maximum call stack size exceeded

RangeError: Maximum call stack size exceeded

    at updateMembers (http://.../CesiumUnminified/Cesium.js:141796:27)

    at Camera.get (http://.../CesiumUnminified/Cesium.js:142047:17)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168381:31)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

    at createPotentiallyVisibleSet (http://.../CesiumUnminified/Cesium.js:168525:13)

So in essence:

3D:

Slow performance (not loading, but navigation interaction) and issues with computing multiple frustums 

2D:

Maximum call stack size exceeded

I've used the default initialization settings for the viewer and globe and everything is pretty much stock standard compared the sandcastle demos, without any callbacks / events.

Any advice would greatly be appreciated.

Regards,

Andries

[Hannah Pinkos]

Hi Andries,

Yes, I do see the same performance problems with that GeoJSON file.  With that many polygons, I think it's reaching the limits of the browser memory which is why performance is slow.

For large datasets like this, the better solution will be to use the 3D Tiles vector format.  You can learn more about 3D tiles in this forum post: https://groups.google.com/d/msg/cesium-dev/tCCooBxpZFU/7hxT_E4pGgAJ

Best,

Hannah

[Andries Olivier]

Ok, thanks for the heads-up. Pitty the 3D Tiles vector format is still in progress.. 

Just find it strange that in the older versions (1.28) , using the same data sets, I didn't have any issues. Something have definitely changed (1.30) and is causing performance issues. This includes the behavior noticed on multiple frustum artifacts.

Cheers, 

Andries

[Hannah Pinkos]

Oh sorry, I didn't realize this was a regression.  That's something we can try to look into.  However, I checked out 1.28 and I see about the same performance on my computer.  What browser, OS and graphics card are you using?

-Hannah

[Andries Olivier]

Hi Hannah,

I've performed extensive profiling / testing on versions ranging from 1.26 to 1.31, and can confirm that the issue is not related to any breaking changes or enhancements from cesium. Initially I thought it was the amount of polygons rendered, but even reducing them to about 50 polygons (with a constant height), my fps drop to 10 - 15 zooming to lower levels. They do have transparency (30%) on the material with a solid outline color. What I find very strange is that testing the rendering remotely on other machines, with a similar spec, the performance is great with an average 60 fps.This means the issue is isolated to my machine and not related to cesium.

What really bothers me as well is the circle I get dead center in the middle of my screen zooming in / out. I've attached the webgl report for illustration. This has been tested on the latest version of chrome and firefox, yielding the same results. 

Machine Specifications:

Windows 10 (64 bit)

16GB RAM

AMD Radeon HD 7570M

Chrome settings with /gpu flag:

Graphics Feature Status

• Canvas: Hardware accelerated
• Flash: Hardware accelerated
• Flash Stage3D: Hardware accelerated
• Flash Stage3D Baseline profile: Hardware accelerated
• Compositing: Hardware accelerated
• Multiple Raster Threads: Enabled
• Native GpuMemoryBuffers: Software only. Hardware acceleration disabled
• Rasterization: Hardware accelerated
• Video Decode: Hardware accelerated
• Video Encode: Hardware accelerated
• VPx Video Decode: Hardware accelerated
• WebGL: Hardware accelerated
• WebGL2: Hardware accelerated

Driver Bug Workarounds

• clear_uniforms_before_first_program_use
• disable_discard_framebuffer
• disable_dxgi_zero_copy_video
• disable_framebuffer_cmaa
• disable_nv12_dxgi_video
• exit_on_context_lost
• force_cube_complete
• scalarize_vec_and_mat_constructor_args
• texsubimage_faster_than_teximage

Problems Detected

• Some drivers are unable to reset the D3D device in the GPU process sandbox
  Applied Workarounds: exit_on_context_lost
• TexSubImage is faster for full uploads on ANGLE
  Applied Workarounds: texsubimage_faster_than_teximage
• Clear uniforms before first program use on all platforms: 124764, 349137
  Applied Workarounds: clear_uniforms_before_first_program_use
• Always rewrite vec/mat constructors to be consistent: 398694
  Applied Workarounds: scalarize_vec_and_mat_constructor_args
• ANGLE crash on glReadPixels from incomplete cube map texture: 518889
  Applied Workarounds: force_cube_complete
• Framebuffer discarding can hurt performance on non-tilers: 570897
  Applied Workarounds: disable_discard_framebuffer
• NV12 DXGI video hangs or displays incorrect colors on AMD drivers: 623029, 644293
  Applied Workarounds: disable_dxgi_zero_copy_video, disable_nv12_dxgi_video
• Limited enabling of Chromium GL_INTEL_framebuffer_CMAA: 535198
  Applied Workarounds: disable_framebuffer_cmaa
• Native GpuMemoryBuffers have been disabled, either via about:flags or command line.
  Disabled Features: native_gpu_memory_buffers

Version Information

Data exported	3/2/2017, 6:55:09 PM
Chrome version	Chrome/56.0.2924.87
Operating system	Windows NT 10.0.14393
Software rendering list version	0
Driver bug list version	9.24
ANGLE commit id	a4aaa2de57dc
2D graphics backend	Skia/56 bf2d9e02d58ea01f1c239f7e2fc024cba140ccb1
Command Line Args	Files (x86)\Google\Chrome\Application\chrome.exe" --flag-switches-begin --enable-gpu-rasterization --ignore-gpu-blacklist --flag-switches-end

Driver Information

Initialization time	55
In-process GPU	false
Sandboxed	false
GPU0	VENDOR = 0x1002, DEVICE= 0x6841
Optimus	false
AMD switchable	false
Desktop compositing	Aero Glass
Diagonal Monitor Size of \\.\DISPLAY1	15.5"
Driver vendor	Advanced Micro Devices, Inc.
Driver version	15.201.1301.0
Driver date	8-19-2015
Pixel shader version	5.0
Vertex shader version	5.0
Max. MSAA samples	8
Machine model name
Machine model version
GL_VENDOR	Google Inc.
GL_RENDERER	ANGLE (AMD Radeon HD 7570M Direct3D11 vs_5_0 ps_5_0)
GL_VERSION	OpenGL ES 3.0 (ANGLE 2.1.0.a4aaa2de57dc)
GL_EXTENSIONS	GL_ANGLE_depth_texture GL_ANGLE_framebuffer_blit GL_ANGLE_framebuffer_multisample GL_ANGLE_instanced_arrays GL_ANGLE_lossy_etc_decode GL_ANGLE_pack_reverse_row_order GL_ANGLE_robust_client_memory GL_ANGLE_texture_compression_dxt3 GL_ANGLE_texture_compression_dxt5 GL_ANGLE_texture_usage GL_ANGLE_translated_shader_source GL_CHROMIUM_bind_generates_resource GL_CHROMIUM_bind_uniform_location GL_CHROMIUM_copy_compressed_texture GL_CHROMIUM_copy_texture GL_CHROMIUM_sync_query GL_EXT_blend_minmax GL_EXT_color_buffer_float GL_EXT_color_buffer_half_float GL_EXT_debug_marker GL_EXT_discard_framebuffer GL_EXT_disjoint_timer_query GL_EXT_draw_buffers GL_EXT_frag_depth GL_EXT_map_buffer_range GL_EXT_occlusion_query_boolean GL_EXT_read_format_bgra GL_EXT_robustness GL_EXT_sRGB GL_EXT_shader_texture_lod GL_EXT_texture_compression_dxt1 GL_EXT_texture_filter_anisotropic GL_EXT_texture_format_BGRA8888 GL_EXT_texture_norm16 GL_EXT_texture_rg GL_EXT_texture_storage GL_EXT_unpack_subimage GL_KHR_debug GL_NV_EGL_stream_consumer_external GL_NV_fence GL_NV_pack_subimage GL_NV_pixel_buffer_object GL_OES_EGL_image GL_OES_EGL_image_external GL_OES_EGL_image_external_essl3 GL_OES_compressed_ETC1_RGB8_texture GL_OES_depth32 GL_OES_element_index_uint GL_OES_get_program_binary GL_OES_mapbuffer GL_OES_packed_depth_stencil GL_OES_rgb8_rgba8 GL_OES_standard_derivatives GL_OES_texture_float GL_OES_texture_float_linear GL_OES_texture_half_float GL_OES_texture_half_float_linear GL_OES_texture_npot GL_OES_vertex_array_object
Disabled Extensions
Window system binding vendor	Google Inc. (adapter LUID: 00000000009163d7)
Window system binding version	1.4 (ANGLE 2.1.0.a4aaa2de57dc)
Window system binding extensions	EGL_EXT_create_context_robustness EGL_ANGLE_d3d_share_handle_client_buffer EGL_ANGLE_d3d_texture_client_buffer EGL_ANGLE_surface_d3d_texture_2d_share_handle EGL_ANGLE_query_surface_pointer EGL_ANGLE_window_fixed_size EGL_ANGLE_keyed_mutex EGL_ANGLE_surface_orientation EGL_ANGLE_direct_composition EGL_NV_post_sub_buffer EGL_KHR_create_context EGL_EXT_device_query EGL_KHR_image EGL_KHR_image_base EGL_KHR_gl_texture_2D_image EGL_KHR_gl_texture_cubemap_image EGL_KHR_gl_renderbuffer_image EGL_KHR_get_all_proc_addresses EGL_KHR_stream EGL_KHR_stream_consumer_gltexture EGL_NV_stream_consumer_gltexture_yuv EGL_ANGLE_flexible_surface_compatibility EGL_ANGLE_stream_producer_d3d_texture_nv12 EGL_ANGLE_create_context_webgl_compatibility EGL_CHROMIUM_create_context_bind_generates_resource
Direct rendering	Yes
Reset notification strategy	0x8252
GPU process crash count	0

Compositor Information

Tile Update Mode	One-copy
Partial Raster	Enabled

GpuMemoryBuffers Status

ATC	Software only
ATCIA	Software only
DXT1	Software only
DXT5	Software only
ETC1	Software only
R_8	Software only
RG_88	Software only
BGR_565	Software only
RGBA_4444	Software only
RGBX_8888	Software only
RGBA_8888	Software only
BGRX_8888	Software only
BGRA_8888	Software only
YVU_420	Software only
YUV_420_BIPLANAR	Software only
UYVY_422	Software only

Diagnostics

0 b3DAccelerationEnabled true b3DAccelerationExists true bAGPEnabled true bAGPExistenceValid true bAGPExists true bCanRenderWindow true bDDAccelerationEnabled true bDriverBeta false bDriverDebug false bDriverSigned false bDriverSignedValid false bNoHardware false dwBpp 32 dwDDIVersion 11 dwHeight 900 dwRefreshRate 60 dwWHQLLevel 0 dwWidth 1600 iAdapter 0 lDriverSize 1498112 lMiniVddSize 0 szAGPStatusEnglish Enabled szAGPStatusLocalized Enabled szChipType AMD Radeon Graphics Processor (0x6841) szD3DStatusEnglish Enabled szD3DStatusLocalized Enabled szDACType Internal DAC(400MHz) szDDIVersionEnglish 11.2 szDDIVersionLocalized 11.2 szDDStatusEnglish Enabled szDDStatusLocalized Enabled szDXVAHDEnglish Not Supported szDXVAModes ModeMPEG2_A ModeMPEG2_C szDescription AMD Radeon HD 7570M szDeviceId 0x6841 szDeviceIdentifier {D7B71EE2-2B01-11CF-F076-A337BEC2C535} szDeviceName \\.\DISPLAY1 szDisplayMemoryEnglish 4844 MB szDisplayMemoryLocalized 4844 MB szDisplayModeEnglish 1600 x 900 (32 bit) (60Hz) szDisplayModeLocalized 1600 x 900 (32 bit) (60Hz) szDriverAssemblyVersion 15.201.1301.0 szDriverAttributes Final Retail szDriverDateEnglish 8/19/2015 2:00:00 AM szDriverDateLocalized 8/19/2015 02:00:00 szDriverLanguageEnglish English szDriverLanguageLocalized English szDriverModelEnglish WDDM 1.3 szDriverModelLocalized WDDM 1.3 szDriverName aticfx64.dll,aticfx64.dll,aticfx64.dll,amdxc64.dll szDriverNodeStrongName oem18.inf:cb0ae4147bfe0e8d:ati2mtag_R476:15.201.1301.0:pci\ven_1002&dev_6841&subsys_17a9103c szDriverSignDate Unknown szDriverVersion 8.17.0010.1404 szKeyDeviceID Enum\PCI\VEN_1002&DEV_6841&SUBSYS_17A9103C&REV_00 szKeyDeviceKey \Registry\Machine\System\CurrentControlSet\Control\Video\{203F55A9-F377-4A88-A131-3BF60253E0CF}\0000 szManufacturer Advanced Micro Devices, Inc. szMiniVdd unknown szMiniVddDateEnglish Unknown szMiniVddDateLocalized unknown szMonitorMaxRes Unknown szMonitorName Generic PnP Monitor szNotesEnglish No problems found. szNotesLocalized No problems found. szOverlayEnglish Not Supported szRankOfInstalledDriver 00D10001 szRegHelpText Unknown szRevision Unknown szRevisionId 0x0000 szSubSysId 0x17A9103C szTestResultD3D7English Not run szTestResultD3D7Localized Not run szTestResultD3D8English Not run szTestResultD3D8Localized Not run szTestResultD3D9English Not run szTestResultD3D9Localized Not run szTestResultDDEnglish Not run szTestResultDDLocalized Not run szVdd unknown szVendorId 0x1002

Log Messages

• GpuProcessHostUIShim: The GPU process exited normally. Everything is okay.

My graphics card driver is up to date with the latest version using hardware acceleration. We develop low level graphics for desktop applications using DX11 / DX12 and have not had any issues on my machine. We really like cesium and would like to use it, but I'm pulling my hair out at the moment and would like any advice / guidance. Unfortunately my knowledge with WebGL is a bit limited.

What I did not mention is that I've also added the WebGL Inspector as an extension in chrome for diagnostics, and what makes me bash my head on the table is that the moment I enable the inspector in the browser, the problems go away (fps goes up, performance is great and the dreaded circle in the center disappears). If I disable it again, I'm stuck with the same issues.

Not sure what to look for next? Any other tools I can use, or perhaps something you noticed in the information I provided above?

Cheers,

Andries

[Hannah Pinkos]

Sorry, but I'm not sure what is causing that artifact.  I wasn't able to reproduce that problem on my machine.  I'll see if someone else on the team with an AMD graphics card is able to see this.

-Hannah

[Andries Olivier]

Attached gpu settings as document, since information got truncated in previous post..

[Andries Olivier]

Hannah, the issue can also be reproduced in sandcastle on v1.31 using one of the existing samples:

Spheres and Ellipsoids

I've attached a screen shot as illustration.. Something is interfering with the frustum artifacts and causing performance issues.

[Andries Olivier]

Attachments does not like spaces in the file name. Re-uploaded.

[Dan Bagnell]

Hi Andries,

Have you tried updating your graphics card driver? The GPU settings you posted has a driver date of 8-19-2015.

Dan

[Sean Lilley]

I've also experienced a lot of slowness for a couple months now. I have an AMD graphics card and with bootcamp the drivers are stuck at about that same date. One thing that helps a lot for me is using Chrome Canary, which leads me to think there is some strange regression when using regular Chrome + old AMD drivers.

[Andries Olivier]

The support on this forum is fantastic! Thanks for all the feedback.

Earlier I tried disabling OIT (Order Independent Translucency), which removed the dreaded circle (perhaps causing issues with the frustum artifacts) and upping the fps drastically, but this caused issues with zooming to lower levels using the mouse wheel. Could be a problem with calculating the z-buffer / depth on my machine.. I know three.js had similar issues.

I followed Sean's advice, and indeed after installing / using Chrome Canary, all my issues disappeared. Excellent performance..

Thanks all!