Structurer un projet Javascript

Bonjour à tous,

Ce sujet fait suite à un début de réflexion dans le cadre de mon travail, et je n'ai pas trouvé de réponses pertinentes après une rapide recherche.

Dans mon entreprise, nous utilisons Mootools comme bibliothèque Javascript, mais au final je pense que la préoccupation qui a donné naissance à ce topic est totalement indépendante de la bibliothèque utilisée, d'où sa présence sur ce forum.

En fait, je cherche à établir au fur et à mesure des besoins, une bibliothèque de classes Javascript réutilisables pour les besoins les plus communs (formulaires dynamiques avec création de champ à la volée, menus déroulants, automatisation des liste select "ajaxo-remplissables" basées sur des conventions de nommage des classes...). Bref, c'est une petite bibliothèque qui compte bien grandir, et je me heurte à quelques réflexions sur l'organisation de ce projet.

L'idéal pour le développement serait d'avoir un fichier par classe, organisées par modules (par exemple ma classe de génération de formulaire pourrait être dans MyCompany/Forms/Dynamic.js, et la classe serait définie comme MyCompany.Forms.Dynamic.

Le problème est qu'en production, on utilise un seul fichier Js compacté, pour des raisons de performances. Multiplier les balises scripts serait donc un cauchemar à organiser, et une perte énorme de performances.

Pour le moment, on utilise un seul fichier (mycompany.js) qu'on utilise en développement, et qu'on concatène avec les bibliothèques et compacte "à la main" à chaque mise en production. Ce n'est ni très pratique, ni bien organisé : quand la bibliothèque va grossir, retrouver le code à modifier dans un seul fichier Js va être une horreur...

Et je me suis dit que bon, je ne devais pas être le premier à me poser la question, alors avant de réfléchir à une organisation, voire à créer un "compilateur" maison à base de directive require artisanale dans le code source, il était de bon ton de questionner un peu les gens sur leurs pratiques :mouarf:

Comment faîtes-vous pour organiser vos projets Javascript ? Scripts maisons, IDE disposant de fonctionnalités de ce genre, prêtre vaudou ?

Merci d'avance ! :D

J'aurais tendance à dire qu'il ne fait pas vouloir être plus royaliste que le roi.
Que sont Mootloos ou Jquery et autres sinon des librairies dans lesquelles ont été empilées des fonctions.
Il est vrai qu'avec JQuery par exemple on peut rajouter des addons...
Mais je dirais pourquoi ne pas tout simplement regrouper les fonctions soit par thème si tu tiens vraiment a travailler avec des modules ...
Mon pragmatisme exacerbé m'aurait guidé vers un seul fichier tronc commun en m'inspirant de ce qui existe... JQUERY y'a tout dedans et on mets une seule balise src pointant vers la librairie qui comporte ajax même si on n'utilise pas ajax sur la page par exemple. Il y a un tas de truc dont une majorités de gens ne servent pas dans JQuery , en tout cas pas sur une seule et même page; personne ne songe cependant a décomposer jquery pour ne mettre en src que les fonctions qui vont servir. Je ne pense pas que le client tapes de la main droite sur son clavier et déclenche le chronomètre de la main gauche pour quelques millisecondes.
C'est un peu le principe de qui peut le plus peut le moins. Honnêtement compiler à chaque fois une librairie sur mesure me semble pouvoir poser plus de problèmes et cas de modification sur la page qui ferait appel à une fonction ne figurant pas dans la compil ...

Merci pour la réponse, et j'approuve à 200%. J'avais également réfléchi au problème, et j'étais arrivé à la conclusion qu'il vaut mieux tout compacter dans un seul fichier, libs + code propriétaire, car les optimiser par page serait ingérable, et sûrement même contre-productif (il ne faut pas oublier le cache navigateur qui en principe fait tout de même son rôle... Si le Javascript est le même sur chaque page, il n'ira pas le télécharger à chaque fois).

En fait ma question portait plus sur l'organisation des fichiers en développement : comment organiser ses fichiers pour conserver une certaine lisibilité et une organisation correcte, sans que chaque mise en production mette des heures ou ne provoque de régression.

Pour illustrer, voici comment je fonctionne actuellement :
En développement j'ai deux balises scripts : mootools.js et mycompany.js, de telle sorte que chaque modification soit directement testable en environnement de développement.

J'utilise également un petit script bash qui concatène mootools.js et mycompany.js, et qui le compacte pour l'utiliser en production.

Ce que j'aimerais, c'est m'approcher au maximum d'une solution qui ne complique pas trop le développement à long terme (maintenir une bonne organisation (une classe = un fichier), et ne pas compliquer les tests en environnements de développement) tout en pouvant facilement passer à un seul fichier compacté pour la production (un seul fichier js, identique sur toutes les pages).

J'espère que je suis plus clair, faut dire le sujet n'est pas le plus simple non plus :aie:

Arf, désolé !
Je suis tellement orienté implémentation javascript, je n'avais pas saisi que tu étais en amont au niveau du projet. Je comprends maintenant la problématique d'organisation évoquée.
Si je devais avec les moyens du bord gérer un gros projet de ce genre, j'imagine que je m'orienterais vers une solution php mysql me permettant de gérer une multitude de bouts de fichiers js qui pourraient etre indexés ou référencés par un système des balises commentaires spécifiques afin de pouvoir faire un référencement dans un base table. Je pense que ce système me permettrait à la fois de pouvoir gerer les multiples versions des differents composants de librairies mais egalement au moyen de php la compiler rapidement.

Merci pour la réponse ! Ca se rapproche de ce que je pensais : pas de solutions miracles... Je vais donc me lancer dans une solution de "builder" maison.

A tout hasard quand tu dis "si je devais avec les moyens du bord", cela signifie-t-il qu'il existe des solutions payantes pour résoudre ces problèmes ? Si oui, je suis preneur de quelques noms / pistes, car si elles apportent une réelle plus-value dans l'organisation et la pérennité du projet, la dépense pourra sans problème être budgété.

Il existe sans doute des solutions toutes faites et vraisemblablement payantes...
Et certainement très paramétrables sauf là ou tu aurais besoins de les paramétrer...
Comme j'ai l'habitude de ne jamais trouver ce qui correspond a mes besoins, j'ai tendance à le faire par moi même.
Je pense que php mysql est tout à fait adapté a ce genre de projet tu peux parser les balises commentaire js dans des fichiers séparés, voire mettre directement le code dans la table.

Bon et bien, j'ai épuisé tous mes prétextes de ne pas mettre la main à la pâte :mouarf:

Merci pour ces infos, ça me confirme qu'il n'existe pas encore de solutions qui fait école pour le développement de gros projets Javascript, il va falloir me créer la mienne ;)