Is the indexdb caching can store only one model in a scene?

Hello friends
I’m trying to use indexdb caching as written in this document.I find that,if there is only one model in the scene,it can be stored correctly:


I can delete the glb file on server side,then the model can still be loaded from the hard disk.
But when the models comes more,things changed:

Only the last model which contains a string of numbers in the uri can be stored in the indexdb!

When page refresh,the other models are still loaded from the web server.
My loading code is:

BABYLON.SceneLoader.ImportMesh("","../TESTMAP2/ASSETS/wrjtiles-mg-tc/", "Tile_+000_+001-19-tc.glb", scene
            , function (newMeshes, particleSystems, skeletons) {
                console.log("mesh1",newMeshes.length);
                var mesh=newMeshes[0];             
            });

And my Tile_+000_+001-19-tc.glb.manifest is:

{
  "version" : 2,
  "enableSceneOffline" : true,
  "enableTexturesOffline" : true
}

Did I do anything wrong?

cc @RaananW and @jelster as they are both amazing with Indexed DB

How dare you call me amazing at this… I’m more like minimally competent. At best. :laughing::grin::slightly_smiling_face:

A quick hypothesis (with lots of probably wrong assumptions) for the behavior you’re seeing is that with regards to caches and unique URI’s, the Tile assets are all considered to be unique from each other due to differences in querystrings and file names.

I’ll have some time later today to look more closely though

HTH

This is already infinitely more than me so totally amazing in comparison and you even have a book speaking of it :slight_smile:

As the IndexedDB doesn’t have proper support for GLBs yet I’d look into an alternative solution like Using Service Workers - Web APIs | MDN (mozilla.org)

2 Likes

Thank you for your help!I have learn the document you provided to solve this problem.
In my attempt,the first step is to build a local area network https server with mkcert.I found that the load speed of http and https Is similar:


(The upper is http,the under is https)
The second step is to write a sw.js to manage the glbs.Benefited from the sw cache the load speed is greatly improved:

Thank you again!

2 Likes

Nice!

Fwiw, The npm package workbox is nice for quickly setting up a SW with prefetch if you haven’t already considered it - helps avoid having to write lots of boilerplate code!