Skip to content

Goldenboy

Goldenboy · Reading · 02

No build step

An interactive 3D page normally arrives as a project with a toolchain. This one arrives as a document. Here is what that removes, how you work with it, and what it costs you.

01What a build step is actually for

An interactive 3D page normally arrives as a project, not a page. The toolchain exists to do four things: resolve module imports into something a browser can load, bundle and minify the result, hash asset filenames for cache-busting, and copy textures and models into a public directory. Every one of those is a build-time answer to a question about where things live.

None of those questions exist once everything is already in the document. There are no imports to resolve because there are no separate modules; no asset paths to rewrite because there are no separate assets; no cache-busting problem beyond the filename of the page itself.

02What ships instead

The renderer, the scene, the interaction and the imagery are inlined into one document at authoring time. Object 01 carries Three.js r185 inside it — the version it was authored against is the version it will run forever, because there is no resolution step that could hand it a different one.

Node or npm required to run it
none
node_modules / lockfile
none
Bundler, transpiler, CI
none
Commands between file and live site
one upload
Version drift
impossible — the renderer is inside the file

This is not a claim that toolchains are bad. It is a claim about what a finished page needs: a build step is infrastructure for work in progress, and a delivered artifact is not work in progress.

03How you edit one

Open the file in any editor. The authored strings — wordmark, headline, lede, and the six annotation labels bound to the six petals of Object 01's shell — sit as plain constants near the top of the inline script, not buried in minified output. Change them, save, reload the file from disk. There is no watcher to start and nothing to rebuild.

Because the file you edit is the file you deploy, there is no class of bug where the built output differs from what you tested. What you opened is what the visitor gets, byte for byte.

04How you deploy one

# the entire deployment
cp object.html /var/www/site/index.html

Or drag it into any static host's dashboard. It is equally happy as one route inside an existing site, or in a sized iframe with an accessible title. Serve it with Cache-Control: public, max-age=0, must-revalidate if you intend to edit it in place — a single-file page busts its cache by name or not at all.

05What you give up

06What still has to be right in the file

Dropping the toolchain does not drop the responsibilities. Both objects carry a responsive layout for desktop and mobile, a reduced-motion path for visitors who ask for one, and — for the WebGL object — a still fallback for devices that cannot render it. Those are authored into the document, and they are what separates a self-contained page from a demo that only works on the machine it was made on.

The format itself, and how to verify a file is genuinely self-contained, is covered on the single-file page. What you receive versus a template or a commission is compared here.

FAQQuestions

Do I need Node or npm installed?
No. There is nothing to install and nothing to run. The file is opened in an editor to change text, and uploaded to a host to publish it.
Will it break when Three.js releases a new version?
No. Object 01 carries Three.js r185 inside the document, so the renderer it was authored against is the renderer it runs. There is no resolution step that could substitute a different version.
Can I use it inside a React or Next.js project?
Yes, in one of two ways: serve it as a static file from your public directory and link to it, or embed it in an iframe with an accessible title. It does not need to be ported into your component tree, and there is no benefit to doing so.
How do I change the copy?
The wordmark, headline, lede and the six annotation labels are plain constants near the top of the inline script. Edit them, save, reload the file from disk, then upload the same file you were just looking at.