Viewer API: Poor performance and [Violation] 'requestAnimationFrame' handler took 127ms in console

Development and API
#1

Hello all, i’ve been using sketchfab for awhile now but recently started to experiment with the API. I’m having a performance issue while tinkering on a project based on the Annotation Sync experiment: https://labs.sketchfab.com/experiments/annotations-sync/

My version: https://devonbbarker.github.io/SanPedranaAnnotated/

As you can see the performance is terrible and the console is throwing a consistant warning
[Violation] ‘requestAnimationFrame’ handler took XXXms on every move of the camera.

The model otherwise runs great in the standard player. Could anyone point this newbie in the right direction where to start debudding?

Thanks!

#2

The 3D model used has 6608 different geometries, which makes for the slow render times.
The “standard player” does a lot of things under the hood to optimize rendering, notably merging geometries (into 106 geoms in the case of that model). This optimization is disabled when using Viewer API because it would prevent moving geoms independently.

Ideally you would
If in your case you don’t need the geometries to be independant, you can:

  1. Do that merging of geometry per material inside the 3d modeler used to generate the model. (Best solution)
  2. re-enable the same optimisation as standard player during the api setup call.
client.init( uid, {
    success: function onSuccess( api ){ ...},
    error: function onError() {... },
    graph_optimizer: 1,
} );
1 Like
#3

Awesome thanks Paul! That model was a sketchup export and the exporter made a mess of the geometry. I’ll try both of your suggestions :+1:

2 Likes