DEV Community


Discussion on: Create a 3D product landing page with ThreeJs and React

andrewbridge profile image
Andrew Bridge

This is an interesting tutorial, using some exciting technologies, but I think it's probably worth adding in some pretty hefty caveats.

While the tutorial promises to enable us to "create your own highly performant 3D sites", the resulting demo downloads 70MB of data before it can run. That's huge! On my connection it took 30 seconds to load 46 separate requests from a cold cache, and most of that was for the unoptimised 3D model assets. There are lots of users across the world that don't have the fast, unlimited data connections available to developers, and a whole website of pages like this would burn through data limits and take forever to load (and likely accrue some unhappy users in the process!).

The glitching text effect, while a nice touch, makes the text unselectable which has possible accessibility implications too.

It's a great design prototype but this tutorial positions the final demo as something that could be production ready. It would need a huge amount of additional work to get it ready for any sort of performant, production use case. Particularly if you planned to have a page like this for each product.

Sorry for to be so negative, it's a great concept, but as web developers we need to keep the web fast, lightweight and accessible to all!