# Tutorials and tips **URL:** https://forum.babylonjs.com/c/tutorials-and-tips/13.md [Latest](https://forum.babylonjs.com/latest.md) · [Categories](https://forum.babylonjs.com/categories.md) · [Tags](https://forum.babylonjs.com/tags.md) --- ## [About the Tutorials and tips category](https://forum.babylonjs.com/t/about-the-tutorials-and-tips-category/18550)
**Author:** [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Replies:** 0\ **Last updated:** [February 19, 2021, 6:55pm UTC](https://forum.babylonjs.com/t/about-the-tutorials-and-tips-category/18550 "2021-02-19T18:55:25Z")
Use this category to share tutorials or tips --- ## [Quick pipeline: AI-generated textures into a PBRMaterial](https://forum.babylonjs.com/t/quick-pipeline-ai-generated-textures-into-a-pbrmaterial/64375)
**Author:** [@marlowfinch42](https://forum.babylonjs.com/u/marlowfinch42)\ **Replies:** 0\ **Last updated:** [October 22, 2026, 7:01am UTC](https://forum.babylonjs.com/t/quick-pipeline-ai-generated-textures-into-a-pbrmaterial/64375 "2026-10-22T07:01:43Z")
Short write-up of a pipeline that saves a lot of time when a scene needs decent surface detail and there is no texture artist in the loop. 1. Generate the plates, not the model. Ask for flat, evenly lit, seamless-ish su… --- ## [How to Vite with Babylon.js (Game Tutorial Series)](https://forum.babylonjs.com/t/how-to-vite-with-babylon-js-game-tutorial-series/33845)
**Author:** [@wavetro](https://forum.babylonjs.com/u/wavetro)\ **Replies:** 25\ **Last updated:** [October 9, 2026, 2:32pm UTC](https://forum.babylonjs.com/t/how-to-vite-with-babylon-js-game-tutorial-series/33845 "2026-10-09T14:32:44Z")
NOTE: A more general-purpose (and beginner-friendly) version of this guide is now available on the Babylon Docs! Hi! Are you allergic to Webpack like I am? Do you hate dealing with its clunky config files? Thankfully the… --- ## [Creating a lightmap in blender and use it in Babylon](https://forum.babylonjs.com/t/creating-a-lightmap-in-blender-and-use-it-in-babylon/43606)
**Author:** [@lb\_artworks](https://forum.babylonjs.com/u/lb_artworks)\ **Replies:** 7\ **Last updated:** [September 17, 2026, 3:00pm UTC](https://forum.babylonjs.com/t/creating-a-lightmap-in-blender-and-use-it-in-babylon/43606 "2026-09-17T15:00:13Z")
Hi all as promised in a previous thread I have prepared a video tutorial on how to have the whole process of going from the lightmap creation in blender to the setup in Babylon. For beginers as myself, is difficutl to f… --- ## [\[Proposal\] Adding Official Chinese Translation for Babylon.js Website and Documentation](https://forum.babylonjs.com/t/proposal-adding-official-chinese-translation-for-babylon-js-website-and-documentation/63941)
**Author:** [@song\_yu](https://forum.babylonjs.com/u/song_yu)\ **Replies:** 4\ **Last updated:** [August 24, 2026, 7:12pm UTC](https://forum.babylonjs.com/t/proposal-adding-official-chinese-translation-for-babylon-js-website-and-documentation/63941 "2026-08-24T19:12:40Z")
Hi Babylon.js Team and Community, I would like to propose adding official Chinese translations for the Babylon.js website and core documentation. Reasoning: China has the largest developer population in the world (ove… --- ## [Float32Array\[\] works like number\[\]\[\] for CreateGreasedLine with multiple seperate lines](https://forum.babylonjs.com/t/float32array-works-like-number-for-creategreasedline-with-multiple-seperate-lines/63957)
**Author:** [@Hypofridge](https://forum.babylonjs.com/u/Hypofridge)\ **Replies:** 2\ **Last updated:** [August 18, 2026, 10:21am UTC](https://forum.babylonjs.com/t/float32array-works-like-number-for-creategreasedline-with-multiple-seperate-lines/63957 "2026-08-18T10:21:27Z")
The title is what it says it. Float32Array\[\] works like number\[\]\[\], probably because both are still arrays after all, with usual index stuff and length props. Why would this be useful? I dont know. Kimi K2.6 Instant Hig… --- ## [\[WebGPU\] CascadedShadowGenerator/ShadowGenerator: shadow missing (x\<0) or mirrored (z\>0) depending on DirectionalLight direction sign — repro for #18653](https://forum.babylonjs.com/t/webgpu-cascadedshadowgenerator-shadowgenerator-shadow-missing-x-0-or-mirrored-z-0-depending-on-directionallight-direction-sign-repro-for-18653/63767)
**Author:** [@Enrique\_Velasquez](https://forum.babylonjs.com/u/Enrique_Velasquez)\ **Replies:** 9\ **Last updated:** [August 10, 2026, 2:56pm UTC](https://forum.babylonjs.com/t/webgpu-cascadedshadowgenerator-shadowgenerator-shadow-missing-x-0-or-mirrored-z-0-depending-on-directionallight-direction-sign-repro-for-18653/63767 "2026-08-10T14:56:04Z")
Hi @Evgeni\_Popov @sebavan — here is the minimal Playground repro that was requested on GitHub issue #18653. Repro (WebGPU): https://playground.babylonjs.com/#Z6CF57#0 Switch the engine to WebGPU (top toolbar), then pre… --- ## [Dramatic increase in WebGPU startup time (whenReady)](https://forum.babylonjs.com/t/dramatic-increase-in-webgpu-startup-time-whenready/63620)
**Author:** [@Joe\_Kerr](https://forum.babylonjs.com/u/Joe_Kerr)\ **Replies:** 3\ **Last updated:** [June 12, 2026, 9:52am UTC](https://forum.babylonjs.com/t/dramatic-increase-in-webgpu-startup-time-whenready/63620 "2026-06-12T09:52:33Z")
Hi everyone, Thought I’d share this to potentially save you some headaches. :face\_with\_head\_bandage: I have been migrating from WebGL to WebGPU and encountered a massive increase :collision: in my game startup time. Fr… --- ## [WebXR Optimization](https://forum.babylonjs.com/t/webxr-optimization/29315)
**Author:** [@Khoa\_Pham](https://forum.babylonjs.com/u/Khoa_Pham)\ **Replies:** 15\ **Last updated:** [April 14, 2026, 12:53pm UTC](https://forum.babylonjs.com/t/webxr-optimization/29315 "2026-04-14T12:53:06Z")
Hi, I’m trying to learn how to optimize my WebXR experience with BabylonJS. I noticed the guys at SketchFab seems to be able to output very high FPS with seemingly lower rendering resolution. I tried to engine.setHardwar… --- ## [Pong: Single player vs AI in TypeScript and Vite](https://forum.babylonjs.com/t/pong-single-player-vs-ai-in-typescript-and-vite/59978)
**Author:** [@Corysia](https://forum.babylonjs.com/u/Corysia)\ **Replies:** 5\ **Last updated:** [March 20, 2026, 1:44am UTC](https://forum.babylonjs.com/t/pong-single-player-vs-ai-in-typescript-and-vite/59978 "2026-03-20T01:44:39Z")
I made a small Pong game to share as a simple Babylon.JS example. Source is available here on GitHub as well as a playable demo. I’m having a hard time beating the UI, but a friend sent me a video where he did. … --- ## [\[BROKEN\] Method of snapping callout labels to screen edges](https://forum.babylonjs.com/t/broken-method-of-snapping-callout-labels-to-screen-edges/61630)
**Author:** [@qwiglydee](https://forum.babylonjs.com/u/qwiglydee)\ **Replies:** 0\ **Last updated:** [December 1, 2025, 9:35pm UTC](https://forum.babylonjs.com/t/broken-method-of-snapping-callout-labels-to-screen-edges/61630 "2025-12-01T21:35:14Z")
Hi. I managed to make callout labels that snap to screen edges like this: Playground implementation: https://playground.babylonjs.com/#X9DCCM#13 The idea is to make a ray from center of screen to projected positio… --- ## [Real-Time Parametric Geometry Editing in Babylon.js](https://forum.babylonjs.com/t/real-time-parametric-geometry-editing-in-babylon-js/61361)
**Author:** [@Rayan\_Farhat](https://forum.babylonjs.com/u/Rayan_Farhat)\ **Replies:** 29\ **Last updated:** [November 23, 2025, 3:52pm UTC](https://forum.babylonjs.com/t/real-time-parametric-geometry-editing-in-babylon-js/61361 "2025-11-23T15:52:28Z")
Hi all, One limitation in Babylon.js is that once you create a mesh, its geometry isn’t easily editable in real time—you lose the original primitive parameters. I wrote a short article explaining how to solve this prob… --- ## [Survey of PointerEvents and gesture libraries](https://forum.babylonjs.com/t/survey-of-pointerevents-and-gesture-libraries/61444)
**Author:** [@HiGreg](https://forum.babylonjs.com/u/HiGreg)\ **Replies:** 2\ **Last updated:** [November 17, 2025, 6:45pm UTC](https://forum.babylonjs.com/t/survey-of-pointerevents-and-gesture-libraries/61444 "2025-11-17T18:45:31Z")
@georgie, this might be relevant as you look into genericised camera inputs. It might be interesting to allow a user to create a CameraInputs class heavily using one or more of the libraries mentioned below. At minimim, … --- ## [\[Solution (upd)\] Tracking and picking skinned animated objects with pausing and rewinding](https://forum.babylonjs.com/t/solution-upd-tracking-and-picking-skinned-animated-objects-with-pausing-and-rewinding/61326)
**Author:** [@qwiglydee](https://forum.babylonjs.com/u/qwiglydee)\ **Replies:** 0\ **Last updated:** [November 7, 2025, 2:57am UTC](https://forum.babylonjs.com/t/solution-upd-tracking-and-picking-skinned-animated-objects-with-pausing-and-rewinding/61326 "2025-11-07T02:57:32Z")
Hi. There are some issues with animated objects because of skeletal animation. Main issue is that absolute position and bounding box of original mesh are not updated on every frame, which quite makes sense for performa… --- ## [Serving draco decoder locally and hosted (with webpack)](https://forum.babylonjs.com/t/serving-draco-decoder-locally-and-hosted-with-webpack/61222)
**Author:** [@qwiglydee](https://forum.babylonjs.com/u/qwiglydee)\ **Replies:** 2\ **Last updated:** [October 30, 2025, 9:39pm UTC](https://forum.babylonjs.com/t/serving-draco-decoder-locally-and-hosted-with-webpack/61222 "2025-10-30T21:39:48Z")
Hi. As you may know, the KHR\_draco\_mesh\_compression is hard-coded to use a ‘default decoder’, and the default decoder is soft-coded to load files from https://cdn.babylonjs.com which is unfortunately not always availble… --- ## [Create a UI with BJS 2D GUI in 3 simple lessons (New #Lesson2 available)](https://forum.babylonjs.com/t/create-a-ui-with-bjs-2d-gui-in-3-simple-lessons-new-lesson2-available/29723)
**Author:** [@mawa](https://forum.babylonjs.com/u/mawa)\ **Replies:** 22\ **Last updated:** [October 24, 2025, 8:41am UTC](https://forum.babylonjs.com/t/create-a-ui-with-bjs-2d-gui-in-3-simple-lessons-new-lesson2-available/29723 "2025-10-24T08:41:41Z")
Hello BJS users and welcome to newcomers, In BJS, there’s this awesome ability to create a fully integrated UI straight from BJS. It is continueously worked and improved and just recently there is also an all new GUI Ed… --- ## [Why is Babylon Native so tough, can anyone help](https://forum.babylonjs.com/t/why-is-babylon-native-so-tough-can-anyone-help/61091)
**Author:** [@loopaq](https://forum.babylonjs.com/u/loopaq)\ **Replies:** 4\ **Last updated:** [October 23, 2025, 11:42pm UTC](https://forum.babylonjs.com/t/why-is-babylon-native-so-tough-can-anyone-help/61091 "2025-10-23T23:42:16Z")
babylon native is too tough, documentation just shows you how to build playground app ,not your own code. i tried i could only build and see playground app that cube thing only, how do i convert my playground code app in… --- ## [PhysicsV2 Car Simulation Template](https://forum.babylonjs.com/t/physicsv2-car-simulation-template/53801)
**Author:** [@Tr909](https://forum.babylonjs.com/u/Tr909)\ **Replies:** 18\ **Last updated:** [October 18, 2025, 11:16am UTC](https://forum.babylonjs.com/t/physicsv2-car-simulation-template/53801 "2025-10-18T11:16:31Z")
Hi All, I’ve created a car simulation example with Havok/PhysicsV2 that I think would be a great starting point for anyone interested! It implements: Motorised joints for powered wheels and steering Stiffness and damp… --- ## [Using NPE to build advanced particle systems](https://forum.babylonjs.com/t/using-npe-to-build-advanced-particle-systems/60614)
**Author:** [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Replies:** 1\ **Last updated:** [September 23, 2025, 12:01am UTC](https://forum.babylonjs.com/t/using-npe-to-build-advanced-particle-systems/60614 "2025-09-23T00:01:46Z")
Hey dear community! Today I want to show you how you can use NPE to build advanced effects with almost no code — and have fun doing it! It’s also the perfect excuse to walk you through how to optimize your code in this… --- ## [Babylon.js + Colyseus, New Tutorial on Multiplayer](https://forum.babylonjs.com/t/babylon-js-colyseus-new-tutorial-on-multiplayer/27994)
**Author:** [@lpsandaruwan](https://forum.babylonjs.com/u/lpsandaruwan)\ **Replies:** 7\ **Last updated:** [August 23, 2025, 6:49am UTC](https://forum.babylonjs.com/t/babylon-js-colyseus-new-tutorial-on-multiplayer/27994 "2025-08-23T06:49:44Z")
Dear BabylonJS team, First of all, thank you for the Babylon.js, the most awesome 3D engine. We(Colyseus team) have created a tutorial, a step by step guidance for multiplayer networking using Colyseus. And also have op… --- ## [Create diffusion waves through post-processing](https://forum.babylonjs.com/t/create-diffusion-waves-through-post-processing/59661)
**Author:** [@pangdong007](https://forum.babylonjs.com/u/pangdong007)\ **Replies:** 1\ **Last updated:** [July 24, 2025, 7:06am UTC](https://forum.babylonjs.com/t/create-diffusion-waves-through-post-processing/59661 "2025-07-24T07:06:58Z")
I created a diffusion wave using post-processing. When I zoom in or out with the mouse wheel, the diffusion wave will deform. I can’t find the reason, so I asked if you could help me take a look Here is my post-pr… --- ## [GLTF2Export export gltf model Problems likely to be encountered：skeleton error](https://forum.babylonjs.com/t/gltf2export-export-gltf-model-problems-likely-to-be-encountered-skeleton-error/59476)
**Author:** [@xiehangyun](https://forum.babylonjs.com/u/xiehangyun)\ **Replies:** 6\ **Last updated:** [July 16, 2025, 4:06pm UTC](https://forum.babylonjs.com/t/gltf2export-export-gltf-model-problems-likely-to-be-encountered-skeleton-error/59476 "2025-07-16T16:06:07Z")
I had some problems with the GLTF2Export exporter, and after finding the cause decided to leave a post documenting it to help anyone experiencing the same problem. The following is an example of problem reproduction. … --- ## [NME: issue when sampling array of texture](https://forum.babylonjs.com/t/nme-issue-when-sampling-array-of-texture/59482)
**Author:** [@CrashMaster](https://forum.babylonjs.com/u/CrashMaster)\ **Replies:** 1\ **Last updated:** [July 10, 2025, 6:28pm UTC](https://forum.babylonjs.com/t/nme-issue-when-sampling-array-of-texture/59482 "2025-07-10T18:28:04Z")
Hey there! This was going to be a question but I solved my problem when I was writing it! So I am experimenting with texture arrays in NME, and I kept getting weird layer boundaries: The solution was to flag frag… --- ## [End-to-end testing with Playwright](https://forum.babylonjs.com/t/end-to-end-testing-with-playwright/58244)
**Author:** [@CrashMaster](https://forum.babylonjs.com/u/CrashMaster)\ **Replies:** 3\ **Last updated:** [May 8, 2025, 6:39am UTC](https://forum.babylonjs.com/t/end-to-end-testing-with-playwright/58244 "2025-05-08T06:39:50Z")
Hello everyone! I wrote a small tutorial for setting up Playwright with any BabylonJS project to catch visual regressions with screenshot comparisons. The focus is on getting the simplest setup to work, on any machine … --- ## [Adjust Inspector Width](https://forum.babylonjs.com/t/adjust-inspector-width/58915)
**Author:** [@roland](https://forum.babylonjs.com/u/roland)\ **Replies:** 7\ **Last updated:** [June 17, 2025, 8:26am UTC](https://forum.babylonjs.com/t/adjust-inspector-width/58915 "2025-06-17T08:26:36Z")
Just a quickie: css #inspector #embed { width: 600px !important; } --- ## [How to fully recover a playground that is stuck in an infinite loop (Chrome)?](https://forum.babylonjs.com/t/how-to-fully-recover-a-playground-that-is-stuck-in-an-infinite-loop-chrome/58887)
**Author:** [@Joe\_Kerr](https://forum.babylonjs.com/u/Joe_Kerr)\ **Replies:** 4\ **Last updated:** [June 9, 2025, 5:32pm UTC](https://forum.babylonjs.com/t/how-to-fully-recover-a-playground-that-is-stuck-in-an-infinite-loop-chrome/58887 "2025-06-09T17:32:47Z")
Hi everyone, OMG. I have been working on some code in the playground. I almost had just lost some hours of work because of a really stupid mistake that got me stuck in an infnite while-loop :man\_facepalming: Credits to… --- ## [The Battle: Strassen vs AlphaEvolve vs Babylon. The winner will surprise you!](https://forum.babylonjs.com/t/the-battle-strassen-vs-alphaevolve-vs-babylon-the-winner-will-surprise-you/58686)
**Author:** [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Replies:** 8\ **Last updated:** [June 2, 2025, 7:10pm UTC](https://forum.babylonjs.com/t/the-battle-strassen-vs-alphaevolve-vs-babylon-the-winner-will-surprise-you/58686 "2025-06-02T19:10:36Z")
I love how clickbait my title is :grinning\_face\_with\_smiling\_eyes: Anyway! Yesterday, I fell headfirst into a glorious rabbit hole. I wanted to test the new matrix multiplication algorithm discovered by Google’s AlphaEv… --- ## [Parametric Fun with Babylon.js + Bitbybit 🚀](https://forum.babylonjs.com/t/parametric-fun-with-babylon-js-bitbybit/58784)
**Author:** [@bitbybit-dev](https://forum.babylonjs.com/u/bitbybit-dev)\ **Replies:** 2\ **Last updated:** [June 2, 2025, 5:45pm UTC](https://forum.babylonjs.com/t/parametric-fun-with-babylon-js-bitbybit/58784 "2025-06-02T17:45:56Z")
Hi community, I’ve recently added a dedicated Babylon.js documentation section for open-source parts of Bitbybit, which you can explore here: :page\_facing\_up: Docs are also on GitHub One of the featured apps include… --- ## [Best Practices for Optimizing Babylon.js Scenes (not just) on Lower-End Devices](https://forum.babylonjs.com/t/best-practices-for-optimizing-babylon-js-scenes-not-just-on-lower-end-devices/58688)
**Author:** [@roland](https://forum.babylonjs.com/u/roland)\ **Replies:** 27\ **Last updated:** [May 31, 2025, 3:14pm UTC](https://forum.babylonjs.com/t/best-practices-for-optimizing-babylon-js-scenes-not-just-on-lower-end-devices/58688 "2025-05-31T15:14:41Z")
Hey! When creating the engine (use WebGPU is available) ask for a high-performance device. Drains more battery power but who cares if it’s a game?! :smiley: new WebGPUEngine(canvas, { powerPreference: "high-perfor… --- ## [Using RecastJS on NodeJS or Browser in ESM or CJS](https://forum.babylonjs.com/t/using-recastjs-on-nodejs-or-browser-in-esm-or-cjs/58709)
**Author:** [@ylacaute](https://forum.babylonjs.com/u/ylacaute)\ **Replies:** 1\ **Last updated:** [May 28, 2025, 9:42pm UTC](https://forum.babylonjs.com/t/using-recastjs-on-nodejs-or-browser-in-esm-or-cjs/58709 "2025-05-28T21:42:38Z")
Hello ! I (once again) lost a few hours trying to understand why RecastJS wouldn’t load in an Angular app (v19). I got the following error message: Cannot set properties of undefined (setting 'Recast') I finally foun… [Next page](https://forum.babylonjs.com/c/tutorials-and-tips/13.md?page=1)