Needle Engine

Needle Engine is a fast web engine for complex and simple 3D applications alike.
It is flexible, extensible and has built-in support for collaboration and XR! It is built around the glTF standard for 3D assets.

  • Powered by three.js
  • WebXR support & iOS Quicklook support for interactive AR
  • Builtin Networking
  • Advanced PBR Rendering
  • Animate Everything
  • Animation Statemachines & Timeline Animations
  • Lightmaps
  • Physics
  • Postprocessing
  • Custom Components and Scripting
  • Automatic Texture & Mesh LOD Generation
  • Progressive Texture and Mesh Loading
    Higher resolution assets are loaded on demand
  • Dynamic Content Loading & Multi-Scene support
  • Integrations for Unity or Blender
  • Commercial & Educational Licenses
  • Hosting and asset optimization
  • More features

Needle Engine Changelog

Powerful integrations for Unity and Blender allow artists and developers to collaborate and manage web applications inside battle-tested 3d editors. Needle Engine integrations allow you to use editor features for exporting models, author materials, animate and sequence animations, bake lightmaps and more.

Follow the Getting Started Guide to download and install Needle Engine.
You can also find a list of sample projects that you can try live in the browser and download to give your project a headstart.
For writing custom components read the Scripting Guide or try Needle Engine on StackBlitz


Contact ✒️

🌵 NeedleGithubTwitterDiscordForumYoutube



Recent Changes

  • Bump three dependency to fix issue caused by KTX2Exporter
  • Add: Much faster loading for skyboxes and environment maps when using presets. E.g. <needle-engine environment-image="studio"></needle-engine>. Supported values are studio, blurred-skybox, quicklook, quicklook-ar
  • Change: TransformControls now also enable fastMode on the SyncedTransform component
  • Change: The mobile javascript console now needs to be explictly enabled using the ?console flag. This change has been made to improve the local development experience. Previously the javascript console would be initialized in local development environments but stay invisible until e.g. an error would be detected. This did sometimes cause performance issues when very large objects would be logged in development
  • Update @needle-tools/gltf-progressive dependency which adds a waitForFirstCapture bool option to awaitLoading(<opts>). With this you can call manager.awaitLoading({waitForFirstCapture:true}) to get a promise that does not resolve until the next requested LOD levels have finished to load.
    Here is an example deployed to Needle Cloud + here is a example on Stackblitz which makes use of this feature to add a custom loading overlay.
  • Fix: When using Needle Engine in Gemini Editor the webrtc dependency caused issues due to Gemini making getUserMedia read-only.
    Example React Shopping App built by Gemini with Needle Engine (Code on Stackblitz)
  • Fix: When using pre-bundled Needle Engine (e.g. from jsdelivr) the mesh-bvh worker path was not correctly resolved
  • Change: <needle-engine> CSS z-index setting where the <needle-menu> element would be rendered above elements outside the <needle-engine> component. This would cause issues where e.g. a sidebar should overlay the page.
  • Change: Reduce default z-index for Needle loading logo
  • Change: Clamp devicePixelRatio to 2 by default. This can be overriden by setting the Needle Engine Context's devicePixelRatio to e.g. window.devicePixelRatio
  • Update @needle-tools/gltf-progressive dependency to expose overrideLodLevel. This can be used to override which LOD level will be loaded instead of calculating the LOD level based on screen coverage:
    For example context.lodsManager.manager!.overrideLodLevel = 0; will always load the highest quality mesh + texture