A temporary demo that implements a multi-building LOD mechanism.

Open World Zone — Wed, 31 Dec 2025 14:51:25 +0000

My little 3D project has actually been continuously updated, and last month I named it Open World Zone.

Currently, there are three directions for optimization: content filling, multi-model management, and performance optimization.

This time, it's a demo for multi-model management, which I've separated out because the other two parts aren't fully developed yet:

(The latest demo can switch between different models based on the protagonist's position.)

https://ow.ccgxk.com/demo/dev001/ ow.ccgxk.com/demo/dev001/

I want to turn it into an infinitely large three-dimensional world.

As soon as the browser opens, there is no loading time—it launches instantly. Lightning fast!
Even low-configuration computers run it smoothly and effortlessly.
It supports multiple users online, offers decent freedom, and the world is incredibly enticing to explore.
You can even place your own notes, images, and more, build your own models, and upload them to this shared world.
An extremely lightweight, high-performance shared world.
How wonderful.

Actually, building the model is incredibly simple. But with only storage capacity for 1 million model files and a smooth threshold of 50,000 models on my computer, how to make it load on demand, delete on demand, and not exceed this threshold is not as easy as imagined.

Just like a computer's mechanical hard drive, it's essentially a large disc with a single line. How can it store 3GB, delete 5GB, then add 200MB and delete 1.5GB, all in an orderly manner.

I went through several solutions before settling on one.

In the end, this ABC scheme was left (read the code for details).
I won’t go into the details of the process. However, this seemingly simple mechanism truly stumped both Gemini and me. It took a whole month, and by mid-December, it finally started to look decent.

This demo is quite simple. It contains 4,000 library buildings.(Now I can confidently say that, theoretically, I can perfectly manage an endless array of models.)

When you enter a building, the interior tables and chairs are loaded (at that point, there will be screen walls and other elements to block the view, making it feel as if they were always there).
When you move a certain distance away from the building, it turns pink (at that point, it becomes a simplified exterior wall with fewer models).
At a greater distance from the building, the entire structure is abstracted into an independent cube (which I refer to as the skyline).

That's how it is for now.

Don't be disappointed. I think it's better to optimize this pain point sooner rather than later.

Additionally, I have very little time. I have to work during the day and socialize on weekends, leaving me with less than three hours each evening to study this. There's no other way.

Just say it simply.

Briefly introduce the history of openworld.js

Open World Zone — Wed, 31 Dec 2025 14:42:31 +0000

These past few days, I've been working on multi-models. Actually, my idea is to implement as many large-scale models as possible.

WebGL itself starts to lag after 80,000 instance models, so I try to implement dynamic loading as much as possible, allowing distant content to be loaded dynamically as needed when the main character moves far away.

In fact, it's quite counterintuitive—building a model is simple. For example, this library only took me 3 to 5 days to code. But figuring out how to achieve its current form took me nearly a month!

This is what it currently looks like: https://ow.ccgxk.com/demo/dev001/

I'd like to start by saying something from before.

I first published this project around October 18, 2025, on Zhihu, a Chinese website similar to Quora. The link is here: https://www.zhihu.com/question/389957213/answer/1962681678376984942. It suddenly seems to have become very popular.

So I thought, what if I created a three-dimensional world that could accommodate a lot of buildings?

So I started researching, on and off, until December 2025, when I finally managed to get it to this point. To be honest, I was very disappointed, but I guess I didn't give up.

My project is written using WebGL.

Initially, it came from a framework by a "code golf" expert: https://xem.github.io/W. When I saw this framework, I was amazed that it could realize such a world per second in just 2kb.

In May 2025, I started researching. I was just a JavaScript newbie. But I learned a lot, little by little.

Then I added the cannon.js physics engine. My goal from the beginning was very clear: a very small game engine. So I worked on compressing the size of cannon.js, and it worked quite well; my current project uses a very small version of cannon.js, only 29kb!

Afterwards, I made many optimizations to the interaction and instantiation aspects. Then, on July 2025, I released an example of an online note-taking system: https://git.ccgxk.com/myWorkSpace/webgl_show/cyber_city/cbcity.html.

Those colorful blocks filled me with longing. However, my development progress was very slow because I had too many trivial matters in my life.

Then, on August 2025, I created a simple program to add blocks. At the end of September 2025, I started thinking about whether to build a library. And so, on October 2025, my library was finally completed!

That is the past.

Then in mid-November, I wanted to create my own brand, so I registered the domain name openworld.zone. But procrastination kept getting in the way, and by the end of December 2025, which is almost 2026, it was still not done.

I hate my procrastination, but thankfully, this project has been progressing smoothly for the past six months. So be it...

DEV Community: Open World Zone

A temporary demo that implements a multi-building LOD mechanism.

Briefly introduce the history of openworld.js