1- # Node.js 3D Core
1+ # Node3D Core
22
33This is a part of [ Node3D] ( https://github.com/node-3d ) project.
44
@@ -11,65 +11,65 @@ npm install @node-3d/core
1111```
1212
1313> This package uses precompiled Node.js addons. ** There is no compilation** during ` npm install ` .
14- The addons are compiled for: Windows x64, Linux x64/ARM64, macOS ARM64.
14+ > The addons are compiled for: Windows x64, Linux x64/ARM64, macOS ARM64.
1515
1616![ Example] ( examples/screenshot.png )
1717
18- * WebGL/OpenGL on ** Node.js** with support for web libs, such as ** three.js** .
19- * Multi-window apps, low-level window control with [ @node-3d/glfw ] ( https://github.com/node-3d/glfw ) .
20- * Modern OpenGL functions also available, see [ @node-3d/webgl ] ( https://github.com/node-3d/webgl ) .
21- * Image loading/saving in popular formats with [ @node-3d/image ] ( https://github.com/node-3d/image ) .
18+ - WebGL/OpenGL on ** Node.js** with support for web libs, such as ** three.js** .
19+ - Multi-window apps, low-level window control with [ @node-3d/glfw ] ( https://github.com/node-3d/glfw ) .
20+ - Modern OpenGL functions also available, see [ @node-3d/webgl ] ( https://github.com/node-3d/webgl ) .
21+ - Image loading/saving in popular formats with [ @node-3d/image ] ( https://github.com/node-3d/image ) .
2222
2323## API
2424
2525### ` init(opts?: TInitOpts): TCore3D `
2626
2727Initializes Node3D, creates the first ` BrowserDocument ` , wires browser-like globals, and returns:
2828
29- * ` doc ` - the created ` BrowserDocument ` , also assigned to ` globalThis.document ` and ` globalThis.window ` .
30- * ` loop ` - shortcut for ` doc.loop ` .
31- * ` raf ` - shortcut for ` doc.requestAnimationFrame ` .
29+ - ` doc ` - the created ` BrowserDocument ` , also assigned to ` globalThis.document ` and ` globalThis.window ` .
30+ - ` loop ` - shortcut for ` doc.loop ` .
31+ - ` raf ` - shortcut for ` doc.requestAnimationFrame ` .
3232
3333` init() ` is cached. Repeated calls return the first result and do not create another document.
3434
3535Options are mostly ` BrowserDocument ` window options, plus:
3636
37- * ` isGles3 ` - request an OpenGL ES 3 style context and shader behavior, closest to WebGL.
38- * ` isWebGL2 ` - expose the context as WebGL2 to browser-style libraries.
39- * ` isVisible ` - pass ` false ` to create an initially hidden window.
37+ - ` isGles3 ` - request an OpenGL ES 3 style context and shader behavior, closest to WebGL.
38+ - ` isWebGL2 ` - expose the context as WebGL2 to browser-style libraries.
39+ - ` isVisible ` - pass ` false ` to create an initially hidden window.
4040
4141### ` addThreeHelpers(three): void `
4242
4343Patches a Three.js module instance for Node3D:
4444
45- * Makes ` three.FileLoader.load() ` read files through Node.js.
46- * Adds ` three.Texture.fromId(id) ` so Three.js textures can wrap existing GL texture IDs.
45+ - Makes ` three.FileLoader.load() ` read files through Node.js.
46+ - Adds ` three.Texture.fromId(id) ` so Three.js textures can wrap existing GL texture IDs.
4747
4848Call this once before creating Three.js loaders/materials that depend on those behaviors.
4949
5050### Core Exports
5151
5252` @node-3d/core ` implements the browser-like runtime and lightweight scene helpers:
5353
54- * ` BrowserDocument ` / ` Document ` - browser-compatible document/window object backed by a GLFW window.
55- * ` BrowserWindow ` / ` Window ` - browser-style window API layered on top of native GLFW window behavior.
56- * ` Screen ` - high-level Three.js screen helper with renderer, scene, camera, events, and snapshots.
57- * ` Surface ` - nested render surface for rendering a scene into a texture.
58- * ` Points ` - point cloud drawable backed by GL buffers.
59- * ` Lines ` - line, segment, or loop drawable backed by GL buffers.
60- * ` Tris ` - triangle drawable backed by GL buffers.
61- * ` Rect ` - 2D rectangle drawable.
62- * ` Brush ` - mouse/paint-style rectangle helper.
63- * ` Color ` - RGBA color helper accepting CSS hex strings, integers, arrays, vectors, and color objects.
64- * ` Vec2 ` , ` Vec3 ` , ` Vec4 ` - small vector helpers used by core drawables and geometry utilities.
54+ - ` BrowserDocument ` / ` Document ` - browser-compatible document/window object backed by a GLFW window.
55+ - ` BrowserWindow ` / ` Window ` - browser-style window API layered on top of native GLFW window behavior.
56+ - ` Screen ` - high-level Three.js screen helper with renderer, scene, camera, events, and snapshots.
57+ - ` Surface ` - nested render surface for rendering a scene into a texture.
58+ - ` Points ` - point cloud drawable backed by GL buffers.
59+ - ` Lines ` - line, segment, or loop drawable backed by GL buffers.
60+ - ` Tris ` - triangle drawable backed by GL buffers.
61+ - ` Rect ` - 2D rectangle drawable.
62+ - ` Brush ` - mouse/paint-style rectangle helper.
63+ - ` Color ` - RGBA color helper accepting CSS hex strings, integers, arrays, vectors, and color objects.
64+ - ` Vec2 ` , ` Vec3 ` , ` Vec4 ` - small vector helpers used by core drawables and geometry utilities.
6565
6666### Package Re-exports
6767
6868` @node-3d/core ` also re-exports lower-level packages commonly needed by apps:
6969
70- * ` Image ` from [ @node-3d/image ] ( https://github.com/node-3d/image ) .
71- * ` gl ` from [ @node-3d/webgl ] ( https://github.com/node-3d/webgl ) .
72- * ` glfw ` from [ @node-3d/glfw ] ( https://github.com/node-3d/glfw ) .
70+ - ` Image ` from [ @node-3d/image ] ( https://github.com/node-3d/image ) .
71+ - ` gl ` from [ @node-3d/webgl ] ( https://github.com/node-3d/webgl ) .
72+ - ` glfw ` from [ @node-3d/glfw ] ( https://github.com/node-3d/glfw ) .
7373
7474### Testing
7575
@@ -83,9 +83,11 @@ npm install --save-dev pixelmatch
8383``` typescript
8484import { matchScreenshot } from ' @node-3d/core/testing' ;
8585
86- assert .ok (await matchScreenshot (' ui' , {
87- doc ,
88- }));
86+ assert .ok (
87+ await matchScreenshot (' ui' , {
88+ doc ,
89+ }),
90+ );
8991```
9092
9193By default, baselines are read from ` test/__screenshots__ ` and diffs are written to ` test/__diff__ ` .
@@ -98,23 +100,23 @@ window mode changes.
98100
99101Important members:
100102
101- * ` renderer ` , ` scene ` , ` camera ` , ` document ` , ` canvas ` , ` context `
102- * ` width ` , ` height ` , ` w ` , ` h ` , ` size `
103- * ` title ` , ` icon ` , ` fov ` , ` mode `
104- * ` draw() ` - renders ` scene ` with ` camera `
105- * ` snapshot(name?) ` - saves the current framebuffer
103+ - ` renderer ` , ` scene ` , ` camera ` , ` document ` , ` canvas ` , ` context `
104+ - ` width ` , ` height ` , ` w ` , ` h ` , ` size `
105+ - ` title ` , ` icon ` , ` fov ` , ` mode `
106+ - ` draw() ` - renders ` scene ` with ` camera `
107+ - ` snapshot(name?) ` - saves the current framebuffer
106108
107109### Drawable Helpers
108110
109111The lightweight drawable classes are useful when you need simple geometry without writing
110112Three.js setup code each time:
111113
112- * ` Points ` - point cloud drawable backed by GL buffers.
113- * ` Lines ` - line, segment, or loop drawable.
114- * ` Tris ` - triangle drawable.
115- * ` Rect ` - 2D rectangle helper.
116- * ` Brush ` - mouse/paint-style helper built on rectangles.
117- * ` Surface ` - nested render surface.
114+ - ` Points ` - point cloud drawable backed by GL buffers.
115+ - ` Lines ` - line, segment, or loop drawable.
116+ - ` Tris ` - triangle drawable.
117+ - ` Rect ` - 2D rectangle helper.
118+ - ` Brush ` - mouse/paint-style helper built on rectangles.
119+ - ` Surface ` - nested render surface.
118120
119121They are intentionally small wrappers around Three.js objects and raw GL resources.
120122
@@ -126,10 +128,10 @@ against the current monitor refresh rate.
126128
127129` vsync ` and ` swapInterval ` values follow this policy:
128130
129- * ` false ` or ` 0 ` renders unpaced with ` glfwSwapInterval(0) ` .
130- * ` true ` uses the synced path.
131- * negative numbers request adaptive sync where available, otherwise normal sync.
132- * positive numbers request normal sync.
131+ - ` false ` or ` 0 ` renders unpaced with ` glfwSwapInterval(0) ` .
132+ - ` true ` uses the synced path.
133+ - negative numbers request adaptive sync where available, otherwise normal sync.
134+ - positive numbers request normal sync.
133135
134136For synced paths, the native layer gates render callbacks in all window modes:
135137windowed, borderless, and fullscreen. Callbacks still receive actual monotonic
@@ -141,11 +143,11 @@ fixed-step accumulator in their own simulation code.
141143
142144Examples are organized by source:
143145
144- * ` examples/core/ ` contains Node3D-authored examples, diagnostics, stress tests,
146+ - ` examples/core/ ` contains Node3D-authored examples, diagnostics, stress tests,
145147 and shared helpers.
146- * ` examples/three/ ` contains examples copied or closely adapted from official
148+ - ` examples/three/ ` contains examples copied or closely adapted from official
147149 Three.js examples.
148- * ` examples/pixi/ ` contains examples copied or closely adapted from official
150+ - ` examples/pixi/ ` contains examples copied or closely adapted from official
149151 Pixi examples.
150152
151153Future vendor examples should use their own directory, such as
@@ -162,7 +164,11 @@ import * as THREE from 'three';
162164import { Screen , addThreeHelpers , init } from ' @node-3d/core' ;
163165
164166const { loop } = init ({
165- isGles3: true , vsync: true , autoEsc: true , autoFullscreen: true , title: ' Crate' ,
167+ isGles3: true ,
168+ vsync: true ,
169+ autoEsc: true ,
170+ autoFullscreen: true ,
171+ title: ' Crate' ,
166172});
167173addThreeHelpers (THREE );
168174const screen = new Screen ({ three: THREE , fov: 70 , z: 2 });
@@ -188,33 +194,31 @@ Example Notes:
1881941. You can run TypeScript examples directly with Node.js 24.
1891951. ` loop` is a convenience method, you can use ` requestAnimationFrame` too.
1901961. ` autoFullscreen` option enables "CTRL+F", "CTRL+SHIFT+F", "CTRL+ALT+F" to switch
191- window modes.
197+ window modes.
1921981. ` Screen` helps with **three.js**-oriented resource management, but is not required.
1931991. **three.js** uses VAO, so if not using ` Screen` , handling the window mode changes
194- (which creates a separate OpenGL context) is up to you.
195- Basically, ` doc .on (' mode' , () => {... })` -
196- here you should re-create ` THREE .WebGLRenderer ` . See the current
197- [Screen implementation](ts/objects/screen.ts).
198-
200+ (which creates a separate OpenGL context) is up to you.
201+ Basically, ` doc .on (' mode' , () => {... })` -
202+ here you should re-create ` THREE .WebGLRenderer ` . See the current
203+ [Screen implementation](ts/objects/screen.ts).
199204
200205## OpenGL Features
201206
2022071. This is real **native OpenGL**, and you have direct access to GL resource IDs. This may be
203- useful for resource sharing and compute interop:
204- * [CUDA-GL interop](https://docs.nvidia.com/cuda/cuda-runtime-api/group__CUDART__OPENGL.html).
205- * [OpenCL-GL interop](https://registry.khronos.org/OpenCL/sdk/3.0/docs/man/html/clEnqueueAcquireGLObjects.html) - see [example](examples/core/boids).
206- * [Context sharing](https://www.glfw.org/docs/latest/context_guide.html#context_sharing).
208+ useful for resource sharing and compute interop:
209+ - [CUDA-GL interop](https://docs.nvidia.com/cuda/cuda-runtime-api/group__CUDART__OPENGL.html).
210+ - [OpenCL-GL interop](https://registry.khronos.org/OpenCL/sdk/3.0/docs/man/html/clEnqueueAcquireGLObjects.html) - see [example](examples/core/boids).
211+ - [Context sharing](https://www.glfw.org/docs/latest/context_guide.html#context_sharing).
2072121. The flag ` isGles3` lets you use a **GL ES 3** preset, which is closest to "real" WebGL.
208- If set to ` false ` , WebGL stuff (such as three.js) will still work, but now with some hacks.
209- However, if you are planning to use non-WebGL features (e.g. **OpenGL 4.5** features),
210- you might want it off, and then select a specific context version manually.
213+ If set to ` false ` , WebGL stuff (such as three.js) will still work, but now with some hacks.
214+ However, if you are planning to use non-WebGL features (e.g. **OpenGL 4.5** features),
215+ you might want it off, and then select a specific context version manually.
2112161. The flag ` isWebGL2` impacts how web libraries recognize the WebGL version.
212- But it doesn't really change the capabilities of the engine.
217+ But it doesn't really change the capabilities of the engine.
2132181. **Offscreen rendering** is possible on Windows and Linux, as demonstrated by the tests
214- running in GitHub Actions. There are test cases that generate and compare screenshots.
219+ running in GitHub Actions. There are test cases that generate and compare screenshots.
2152201. OpenGL **context sharing** is enabled. You can obtain ` HDC , HWND , CTX ` for Windows and whatever
216- those are called on Linux and macOS. See [@node-3d/glfw](https://github.com/node-3d/glfw).
217-
221+ those are called on Linux and macOS. See [@node-3d/glfw](https://github.com/node-3d/glfw).
218222
219223## License
220224
0 commit comments