Issue with v2.3.0 and above

[rodrigoalcarazdelaosa]

[:LABEL:] Could be a bug introduced in v2.3.0?

Description On my Hugo website (source here, using this shortcode), I'm showing several 3D models (the one that appears first, just below the 2D molecule shown here, is this one). They show fine using v2.2.1 and lower, but from v2.30 and above I can't get them to work on my recent machine (MacBook Pro from 2023). They simply don't appear, but I can't see any errors in my console or anything. Several users navigating to my site have reported the same, using many different computer configurations and browsers.

Could this be related to the fairly significant changes in the rendering pipeline that may cause problems with older devices introduced in v2.3.0?

Relevant Context If you want/need to build my site locally, you'll need to install Hugo Extended and Go, and just use the view.sh script. After that you want to navigate to http://localhost:1313/recursos-fisica-quimica/apuntes/formulacion-nomenclatura-quimica/organica/. I'm loading the 3Dmol.js script at the end of my head.

Please let me know if you need anything else from me. Thank you very much.

[dkoes]

In the hopes you can save me debugging time - any idea why view.sh is failing complaining about the version of go despite the right version being installed?

Error: command error: failed to load modules: failed to download modules: failed to execute 'go [mod download -modcacherw]': failed to execute binary "go" with args [mod download -modcacherw]: go: go.mod requires go >= 1.23 (running go 1.22.6)
 *errors.errorString
dkoes@jedi:~/git/fisiquimicamente$ go version
go version go1.23.1 linux/amd64
dkoes@jedi:~/git/fisiquimicamente$ hugo version
hugo v0.134.1-2f89169baa87a9db47e288b60705f4e99e21a945+extended linux/amd64 BuildDate=2024-09-05T10:17:50Z VendorInfo=snap:0.134.1

[rodrigoalcarazdelaosa]

In the hopes you can save me debugging time - any idea why view.sh is failing complaining about the version of go despite the right version being installed?

No idea but you can try manually changing this line to go 1.22 and see if that helps.

[dkoes]

I've reproduced some problems. The main issue is incorrect handling of background alpha with the new rendering pipeline, although this results in "ghost" molecules rather than no molecules for me. The other issue I noticed was that the spin animation was super slow due to all the viewers updating at the same time even though they were hidden (with the old code, we were limited by the maximum supported number of webgl contexts so there were limited numbers of active viewers, now that we aren't limited by the webgl context limit the overhead of updating all the animations on the page got too much). I've fixed this by pausing animations on hidden viewers.

The background alpha issue is going to take more time/thought, but I will try to prioritize it since it is a significant regression.

[rodrigoalcarazdelaosa]

Thank you so much for your time, David. For the time being I'll stick to v2.2.1, so I'm not in a hurry in any way.

[rodrigoalcarazdelaosa]

I've fixed this by pausing animations on hidden viewers.

Related to this, could it be possible to lazyload models, so only those visible in the current screen are actually shown?

[JamMaster1999]

Hello, I have been using 3DMol.js for the past 6 months and recently upgraded from 2.0.1 to 2.4.0 and I noticed a huge performance drop. Even the simplest molecules drop frames during rotation or spinning with mouse or otherwise. Is this part of the same issue? If not, should I create a separate issue?

I reverted back to 2.0.1 for now.

Thanks for all your great work.

[dkoes]

What platform are you using? Does disabling antialiasing make the problem go away? https://3dmol.org/doc/ViewerSpec.html#antialias

[dkoes]

@JamMaster1999 It would be really helpful if you could provide more information on the problems you are having, such as what operating system and browser you are using and if disabling antialiasing resolves the issues.

[ceriottm]

Enthusiastic 3dmol.js users here. We use it as a structure panel in chemiscope. Everything works great until 2.3.0 included, but if we update to 2.4.0 we get an entirely empty viewer. No errors to be seen in the logs. I don't think we use transparency.

[dkoes]

@ceriottm - This is related to the broken background transparency in 2.4.0. In viewer.ts you create viewer like this:

        const viewer = $3Dmol.createViewer(this._root, {
            antialias: true,
            defaultcolors: $3Dmol.elementColors.Jmol,
            backgroundColor: '0xffffff',
            backgroundAlpha: 0,
            disableFog: true,
            orthographic: true,
        });

If you remove the backgroundAlpha or set it to 1 you get the viewer back. This is a serious regression, but I've just been overloaded with other things. I'll try to figure out a fix today.

[ceriottm]

Aaah! Thanks, this makes sense. No worries we can happily live on 2.3.0 until you find the time - I just reported this in case having another problematic case helped, but it looks like you know exactly what the problem is. We'll be happy to test once you have a fix ready.

[dkoes]

Version 2.4.2 should fully fix the background transparency issue and it also fixes problems with orthographic rendering of sticks (when zoomed in) that I noticed when using chemiscope.

[ceriottm]

Can confirm this fixes the problem for chemiscope. Thanks, we'll update to this latest version, looks like it has a lot of nice improvements, and feels snappier.

[dkoes]

Closing as I believe the root problem with transparent backgrounds has been solved. @JamMaster1999 - please file a new issue if you are willing to provide the specifics of your problems.