{"id":14948,"library":"super-three","title":"super-three: JavaScript 3D Library (Abandoned Fork)","description":"`super-three` is a JavaScript 3D graphics library, initially based on the widely adopted `three.js` project, designed for rendering interactive 3D content in web browsers using WebGL and WebGPU. While the provided metadata indicates version `0.181.0`, public NPM data shows this package was last updated approximately two years ago, making it an effectively abandoned fork. In contrast, the official `three` package (which `super-three` is derived from) is actively maintained with frequent updates (e.g., `0.183.2` as of April 2026). `super-three` aimed to leverage the `three.js` API for creating scenes, cameras, lights, and objects, supporting various geometries, materials, and post-processing effects. Its original differentiators would have been alignment with `three.js`'s ease of use, broad browser compatibility, and access to a rich ecosystem. However, due to its abandonment, it lacks current features, performance improvements, and critical bug fixes found in the actively maintained `three.js` library.","status":"abandoned","version":"0.181.0","language":"javascript","source_language":"en","source_url":"https://github.com/supermedium/three.js","tags":["javascript","three","three.js","3d","virtual-reality","augmented-reality","webgl","webgl2"],"install":[{"cmd":"npm install super-three","lang":"bash","label":"npm"},{"cmd":"yarn add super-three","lang":"bash","label":"yarn"},{"cmd":"pnpm add super-three","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"`super-three`, like modern `three.js`, primarily uses ES Modules. While `require` might work in some environments, it's not the recommended or tree-shaking friendly approach. Using `* as THREE` imports the entire library namespace.","wrong":"const THREE = require('super-three');","symbol":"THREE (namespace)","correct":"import * as THREE from 'super-three';"},{"note":"For tree-shaking and explicit imports, specific classes and modules should be imported directly from the top-level package. Avoid direct paths into `build/` for core modules as they might change.","wrong":"import { WebGLRenderer } from 'super-three/build/super-three.module.js';","symbol":"Named exports (e.g., Scene, WebGLRenderer)","correct":"import { Scene, PerspectiveCamera, WebGLRenderer, BoxGeometry, MeshNormalMaterial, Mesh } from 'super-three';"},{"note":"Loaders and other community-contributed examples or add-ons are located under `examples/jsm/` and require the full relative path, including the `.js` extension, for correct ES Module resolution.","wrong":"import { GLTFLoader } from 'super-three/src/loaders/GLTFLoader.js';","symbol":"Add-ons / Examples (e.g., GLTFLoader)","correct":"import { GLTFLoader } from 'super-three/examples/jsm/loaders/GLTFLoader.js';"}],"quickstart":{"code":"import * as THREE from 'super-three';\n\nconst width = window.innerWidth, height = window.innerHeight;\n\n// init\nconst camera = new THREE.PerspectiveCamera( 70, width / height, 0.01, 10 );\ncamera.position.z = 1;\n\nconst scene = new THREE.Scene();\n\nconst geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );\nconst material = new THREE.MeshNormalMaterial();\n\nconst mesh = new THREE.Mesh( geometry, material );\nscene.add( mesh );\n\nconst renderer = new THREE.WebGLRenderer( { antialias: true } );\nrenderer.setSize( width, height );\nrenderer.setAnimationLoop( animate );\ndocument.body.appendChild( renderer.domElement );\n\n// animation\nfunction animate( time ) {\n\tmesh.rotation.x = time / 2000;\n\tmesh.rotation.y = time / 1000;\n\n\trenderer.render( scene, camera );\n}","lang":"javascript","description":"This quickstart initializes a basic 3D scene with a camera, a rotating cube, and a WebGL renderer, appending the canvas to the document body for animation."},"warnings":[{"fix":"Migrate to the official `three` package (npmjs.com/package/three) for an actively maintained and up-to-date 3D library. Be aware of potential API changes when migrating from an older `super-three` version to the latest `three.js`.","message":"This `super-three` package is an abandoned fork based on an older version of `three.js` (0.181.0, last updated ~2 years ago). It will not receive updates, security patches, or new features present in the actively maintained `three.js` library (e.g., 0.183.2+). Using it means missing out on performance improvements, bug fixes, and critical updates, and may introduce compatibility issues with newer ecosystems.","severity":"breaking","affected_versions":">=0.181.0"},{"fix":"Always use `import` statements (e.g., `import * as THREE from 'super-three';`) and for loaders/addons, import from `super-three/examples/jsm/...`. Configure your build system (Webpack, Rollup, Vite) to correctly handle ES Modules.","message":"`three.js` (and thus `super-three`) strongly encourages and primarily ships ES Modules. Importing CommonJS builds or older UMD bundles can lead to larger bundle sizes, broken tree-shaking, and compatibility issues with modern build tools.","severity":"gotcha","affected_versions":">=0.100.0 (approximate three.js equivalent)"},{"fix":"Call the `.dispose()` method on `Geometry`, `Material`, and `Texture` instances when they are no longer in use. For materials, iterate through their textures and dispose of each one. Remove objects from the scene to release references.","message":"`three.js` objects like `Geometry`, `Material`, and `Texture` allocate resources on the GPU. If not explicitly disposed of when no longer needed, they can lead to significant memory leaks, especially in single-page applications or long-running experiences. This behavior applies to `super-three` as well.","severity":"gotcha","affected_versions":"*"},{"fix":"Ensure you use the exact relative import path, e.g., `import { GLTFLoader } from 'super-three/examples/jsm/loaders/GLTFLoader.js';`. Note the `.js` extension is often required in ES Module environments.","message":"Loaders (e.g., `GLTFLoader`) and other examples/add-ons are located in `super-three/examples/jsm/`. Incorrect paths or attempting to `require` them can lead to module resolution errors due to differences in module systems or file extensions.","severity":"gotcha","affected_versions":"*"}],"env_vars":null,"search_vec":"'0.181.0':45 '0.183.2':85 '2026':89 '3d':5,15,30,162 'abandon':7,63,141 'access':132 'activ':79,155 'adopt':23 'ago':58 'aim':93 'align':121 'api':98 'approxim':55 'april':88 'augment':167 'augmented-r':166 'base':19 'broad':128 'browser':34,129 'bug':150 'camera':102 'compat':130 'content':31 'contrast':66 'creat':100 'critic':149 'current':144 'data':48 'deriv':76 'design':26 'differenti':117 'due':138 'e.g':84 'eas':125 'ecosystem':136 'effect':62,114 'featur':145 'fix':151 'fork':8,64 'found':152 'frequent':82 'geometri':108 'graphic':16 'howev':137 'improv':147 'indic':43 'initi':18 'interact':29 'javascript':4,14,159 'lack':143 'last':53 'leverag':95 'librari':6,17,158 'light':103 'maintain':80,156 'make':59 'materi':109 'metadata':42 'npm':47 'object':105 'offici':68 'origin':116 'packag':51,70 'perform':146 'post':112 'post-process':111 'process':113 'project':25 'provid':41 'public':46 'realiti':165,168 'render':28 'rich':135 'scene':101 'show':49 'super':2,10,73,91 'super-thre':1,9,72,90 'support':106 'three':3,11,69,74,92,160 'three.js':24,97,123,157,161 'two':56 'updat':54,83 'use':35,127 'various':107 'version':44 'virtual':164 'virtual-r':163 'web':33 'webgl':36,169 'webgl2':170 'webgpu':38 'wide':22 'would':118 'year':57","created_at":"2026-04-20T18:44:27.518904+00:00","updated_at":"2026-04-20T18:44:27.518904+00:00","problems":[{"fix":"For ES Modules, use `import * as THREE from 'super-three';`. If using CommonJS, `const THREE = require('super-three');` (though ES Modules are the preferred and modern approach). Ensure your build system correctly bundles `super-three`.","cause":"Attempting to access `THREE` globally or from a CommonJS `require` call in an environment where it's not exposed, or when using ES Modules without the correct `import * as THREE` statement.","error":"Uncaught TypeError: THREE is not defined"},{"fix":"Ensure your bundler (Webpack, Rollup, Vite) is correctly configured to resolve `super-three` from `node_modules`. For direct browser use without a bundler, consider using an import map or a CDN version that exposes `THREE` globally.","cause":"A browser environment trying to resolve a bare module specifier (`super-three`) without a module map or import map, or a build system not correctly configured to resolve modules from `node_modules`.","error":"Failed to resolve module specifier \"super-three\". Relative references must start with \"./\", \"../\", or \"/\"."},{"fix":"Implement `webglcontextlost` and `webglcontextrestored` event listeners on `renderer.domElement` to gracefully handle context loss and attempt to reinitialize the scene. Optimize resource usage (geometries, textures, shaders) to reduce GPU pressure.","cause":"GPU drivers crashing, browser tab being backgrounded for too long, or excessive memory/resource usage leading to the browser discarding the WebGL context.","error":"WebGL: Context Lost"},{"fix":"Ensure you have `@types/three` installed and that its version is compatible with the `super-three` version (or the `three.js` version it was forked from). Use type assertions (e.g., `(mesh as any).someProperty`) if you are intentionally extending types or adding dynamic properties, or declare custom interfaces to extend `three.js` types properly.","cause":"TypeScript compiler error indicating an attempt to access a property or method not declared in the `three.js` (or `super-three`) type definitions for the specific object. This often happens when properties are dynamically added, or type casting is missing.","error":"Property 'someProperty' does not exist on type 'Mesh<...>'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":"https://threejs.org/","github":"https://github.com/supermedium/three.js","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/super-three","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework","ai-ml"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-18","install_tag":null}}