Hi!
I’m running into issues trying to handle large Base
objects with Speckle on a C# backend and loading them on a React frontend using the SpeckleOfflineLoader
.
The goal is to serialize a large Base
object, save it as JSON, and load it on the frontend for offline viewing. Originally, I used:
Backend
using Speckle.Core.Models;
using Speckle.Core.Serialisation;
Base baseObj = ...;
var serializer = new BaseObjectSerializerV2();
var serialized = serializer.Serialize(baseObj);
File.WriteAllText(jsonPath, $"[{serialized}]");
Frontend
import { SpeckleOfflineLoader } from '@speckle/viewer';
const jsonContent = await fetch('/model.json').then(res => res.json());
const loader = new SpeckleOfflineLoader(viewer.getWorldTree(), jsonContent);
await viewer.loadObject(loader, true);
The problem
Once the Base
object got large, serialization started failing — specifically with an OutOfMemoryException
. Also, there’re string limitations on the browser side. So I tried chunking the object by extracting its elements
and writing each one as a separate file like this:
var baseElements = baseObj["elements"] as List<Base>;
var serializer = new BaseObjectSerializerV2();
for (int i = 0; i < baseElements.Count; ++i)
{
var chunk = baseObj.ShallowCopy();
chunk["elements"] = new List<Base> { baseElements[i] };
var serialized = serializer.Serialize(chunk);
File.WriteAllText(@$"{directory}\{i}.json", $"[{serialized}]");
}
Frontend loading multiple chunks:
import { SpeckleOfflineLoader } from '@speckle/viewer';
for (const file of files) {
const loader = new SpeckleOfflineLoader(viewer.getWorldTree(), file);
await viewer.loadObject(loader, true);
}
Everything looks fine at first — the chunks load into the viewer and display as expected, but not for all models.
Also, when I call isolateObjects
, it doesn’t isolate only the object with that ID. Instead, it also shows unrelated objects, even though the viewer’s internal filter state doesn’t include them. Probably, it’s not the only problem, generally it has weird behaviour.
It feels like something is off with how the chunks are being merged or how the viewer identifies objects across them.
Is this a valid way to chunk a large Base
object for offline use?
Is there an official or recommended way to split a large Base
object into manageable pieces that still behave correctly in the viewer?
Thanks in advance!