Large js project

Question

What is the best way to structure a large vanilla js-based project? After some reading and trying, it worked organising the codes I wanted within a function each and loading them as one would load a library.
- would modules be any better and how does this work?
- how would one load the different css each code needs?
If any of the codes needs to load sound or images, how to be selective and economical on memory?
(Please, dont point me to what can be googled, I hope for answers out of experience).

Answer 1

Get started from learning webpack.
https://webpack.js.org/guides/getting-started/

If you go through this tutorial, the first 4 topics basically can clear most of your doubts.

Answer 2

Martin Taylor Calviղ thank you for your answers, I may find more info reading the documentation you give me but I was not really asking how to bundle apps. I am using apache cordova, I am sure I have lots to learn but it works. It was more a questiin about performance and good practice from personal experience. and whether my solutiion of organising my codes as a library should be avoided as a bad idea and why.

Answer 3

Martin Taylor I have read all this cordova documentation, my question is not on how to organise the build but how to structure the code itself. It works but I do not know if I am doing it the sensible way. like many things I have taught myself (tying shoe laces, writing or knitting) the algorithms I invented worked but there were excellent reasons why the established way was better (the knots on my sneakers needed Alexander's sword)

Answer 4

Under HTML5/CSS3 you can use media-queries to select, for example one image with better resolution in desktop, and other lower for mobiles for example.

https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries

On Html its limited to source tag inside picture tag. CSS is more flexible, equal that Javascript using DOM

Answer 5

David Ordás gracias pero la verdad es que mi pregunta no tiene que ver con nada de lo que me estais respondiendo. Asi como tengo claro como se organiza un proyecto grande en cpp o python, en web el paso de una single page application a un codigo que ejecute una u otra de 10 animacionoes diferentes es algo que no encuentro explicado en ningun sitio. Como gestionarlo? Lo estoy programando igualmente como si los codigos de las animaciones fueran una libreria pero tiene que haber protocolos estandar que deberia conocer.