Loading video...
Video Failed to Load
Live link: Built to showcase what's possible with real-time WebGPU rendering using #threejs. Just a 6.3 MB download, yet the lighting looks baked—until you grab the sun and watch everything update in real time. I hope you like it 🤗
129,775 views • 3 months ago •via X (Twitter)
72 Comments

Sorry I don't like it that much. Maybe thats not what you expected to hear by a total stranger. But let me tell you this, I just love it!

@aliuagon_ hahaha. Thanks, buddy haha. How is the performance for you? Acceptable?

on my m1 pro macbook its doing fine, although there is some glitter that reflects which is acceptable for me :) I have so many questions for this one, its the thing that I am actually building myself and you just made my head explode with inspiration!

Thank you so much. M1 was my target device so I'm happy that it is good on that hehe. I love inspirational projects. I plan to open source parts of this. Although it is mostly threejs default results. I'm just controlling the DPR during movement and higher resolutions. This is the key aspect here. This can't run at 2 or 3 dpr. There are just too many pixels and post processing passes to render. I'm using 9 post processing passes 😬

Awesome work. I noticed complete black screen on iPad with only the UI elements showing and not the experience itself. Have a look. 😊

Thanks. I tested it on my iPhone 13 and it is running at 60 FPS. I also tested in iPadOS simulator. Maybe it is something specific to iPad, which I can't test as I don't have one usable. Mine is iPad 1, first generation lol. But thanks anyway.

@threejs

Good work man . Loved the Vr Opera House seat Good Concept👊🏾.

Ohh so kind of you. Thanks ☺️. Yeah, that prpj3ct is getting an updated version too hehe.

Wow, this is so freaking coool!!

Amazing app! Does the app need to know every coordinates of every location for the shadows to be precise?

Thanks ;). Yes. I did not implement it in this version, but it can ;)

Great, thank you for letting us know!

Beautiful!

Thanks 🙏🏻☺️

What is in those 6.3MB? It's too small for even a meagre web-site?

6.3mb is 3d models, threejs, @greensock, music, etc. Without music, the download transfer is 4.8mb actually.

Amazing work

I'm running on a M1 Mac. The performance doesn't seem to be stable even at 1080p. I switched to the lowest preset, but it still drops fps as soon as I move the camera. Apart from that, it looks really good for something running on web.

Thanks. Yeah, this is intentional. I drop the FPS to hold performance. So you see a quality switch indeed.

What did you use to generate the assets?

Blender, blood, sweat and tears haha. I'm kidding. This model was bought and customized by me.

🔥🔥🔥

Noice!

Thanks ☺️

Isn’t this the technology Alibaba used in its early days? At least six months ago.

I dont think so. I mean, this seems to be AI generated images. Mine is real time rendering using webgpu.

This is very … illuminating.

Want to build something like this one day 🔥🔥

Awesome. You can start here

Thanks Anderson!

Very nice!

Thanks buddy. How is the performance for you?

Thank you. Nice 👍

Insane. Crazy to see what we can do / see with just a browser nowadays.

How can you do that bro?

Magic ehhe. I'm kidding eheh. That's basically threejs default with a good amount of time spent adjusting every parameter + 25 years of experience hehe.

I have to wait 5 more years experience to catch you :)

hehehe. You are doing great buddy. Just experiment as much as you can with crazy stuff. This is what I did. I just started early because I'm older hahah.

这也太棒了吧!

谢谢 😍

yee this slaps

Wow! I need something like this for I’ve shipped 3d virtual tours with gaussian splat method but this would take things to a whole new level!

Wait, so basically what’s it for again :)

Just for fun hehe. But might become a product in the future hehe.

As usual, you never disappoint! This looks great😍😍

Thank you so so much ❤️. So kind of you 🤩

Incredible work man!

will open source?

I already opened source parts of it. I will probably make it open source after the threejs conference. Let's see if it is not too complex. But most of it is threejs raw results that you can replicate using threejs examples page. Take a look:

thanku!I'm particularly interested in the day-night transition system.

There are some examples on that in threejs examples page as well. Thick the Probes webgpu example. It is basically a directional light being controlled by Javascript changing rotation and azimute.

thanks!

That lighting looks baked but it's all real time, wild

Thanks buddy ☺️🙏🏻

🫡👏

This looks incredible. How are you keeping the customizable colors so accurate while still making it look photorealistic? Since this is a home decor customizer, are the rendered colors the same as the original input colors?

Thwnks buddy. To be honest, I don't love the colors hehe. I had to make them super saturated to emphasize the GI aspect. But the SDGI is the key element for realism here. You can turn it off in the settings so you can see how it looks without it. Day and night difference.

I am working on a project where you can make customizers for 3D printed products. Incredibly hard to get true colors, photorealistic products and environments… I will definitely stay tuned into this, keep up the good work. Here’s a customizer on my shop

Hunnn.. did you scale the screen during the loader? Maybe your resolution was too high? Thanks for sharing it. I will debug it ;)

No, it was all black screen then I wanted to see if there was any errors in the console. I do have a very old 2Gb Vram card so my limits may be lower of what you was expecting.

Hunn okay hehe. Yeah. Maybe this is just too heavy for that :). But thanks for sharing it anyway!

out of curiosity, what setup do you have?

I've been developing this one on both the MacBook Neo and the MacBook Air M5 baseline. But my day-to-day development is on a Mac Studio M2 with 64 GB of RAM and 38GPU cores. Not fair, hahah.

what the

so cool

@Andersonmancini is this only usable for indoors? What about outdoors?

It works outdoors as well: You can see it in action here:

This looks so unreal 🤩

haha. Thanks heheh. Still far away from unreal, but close enough to ditch baked lights IF the performance can hold 😛. How is the performance for you, my friend?

Oh, I just watched the video, PC is quite busy at the moment 😅

Damn
