I know this is a very general question and there maybe several answer to it. I’ve been playing around with Babylon.js and web development for the last few weeks and and its a really great platform, so far my impression is that:
Babylon.JS playground is mainly for prototyping and trying things to watch at runtime
For developing a more complicated project, whith more than one class in it, I should use an IDE, like visual studio and do the development locally and then check it on a localhost or web.
Please share your preferred workflow.
This question arises from a battle neck I had, when writing code in the playground.
First, writing BABYLON. each time I need a class is redundant, and so I was looking for other workflow, and found this tutorial:
and I think this tutorial is somewhat close to what I need.
but, when looking at the logic, in the src file, I see it is TypeScript, and I know that Babylon.js also works with JavaScript so why use TS files? (I guess this is a more philosophical question).
Yep, it’s all very subjective. Each of us here probably has a different way to deal with developing a large project.
I’ll start from the end -
Oh, once you go TS you never go back :-).
First - Babylon is written in TypeScript. It would be much harder doing everything in vanilla JS. Second - project is structured better (IMO) when you use typescript. A bit of type safety and a little less duck-typing will only do good for a large project. And third - why not? Typescript is a superset of javascript. It is not some random language or different syntax. it is practically the same. With Type Safety and an extra compilation step
About developing a larg(er) project - I agree with you. Though it is practically the same editor as vscode (monaco editor), the playground is not suitable for a large multi-classed project (thou you could put them all in a single file. Not recommended…). This would be my recommendation for a “getting started” project:
Dont know if this adresses your question, but i have had good experiences using npm for package handling and webpack for bundling. (has nothing to do with babylonjs in particular)
Also github offers now to publish stuff using ‘github-pages’. Once set up properly, the app will be built and hosted automatically which is pretty handy.
During development, the app can be bundled and hosted/tested locally as well.
We do our projects in JS and VSCode, running locally (using servez).
Me as I am not a programmer, got into the flow and I can handle the projects, e.g. bringing in content and modifying it.
I also wrote some smaller projects JS in PG just to get a basic understanding.
I also use the graphical editors, I love Mr. Inspector!
TS or JS? Never did TS.
And … Our team has the best programmer in the world, hehe.!
best.
werner
TypeScript isn’t just great for preventing runtime issues, but it also offers a solid foundation for implementing design patterns principles that I find crucial for creating scalable and maintainable code. VSCode + Typescript + Vite.js + Github is the fast way for me!. I came to this conclusion by applying an incremental and iterative development methodology to a sequence of more than 10 mini projects. The first of them was done on the playground and was part of an academic article that I published in a journal, the second was made in JS in a single file, the last ones are composed of more than 30 modules that form a reusable core for my specific dev case.
It doesn’t work as expected, but Vite’s other features reduce and minify the final file size. Below is the result for a build of my Carnot Game:
dist/assets/babylon-loaders-BwPuEUBH.js 1,374.08 kB │ gzip: 342.46 kB
dist/assets/core-2p-xLsrR.js 4,304.58 kB │ gzip: 934.04 kB
The babylon.js core is less than 1 Mb (gzip), which is already a very small size in my opinion. To reduce it, I recommend doing a custom build of Babylon.js or researching more about vite.config.js settings.
