Discussion :

[Doksuri]

Bonjour, je suis tombe sur un concept que je trouve genial, mais que j'ai du mal a implementer (code simple/concis)
un service va commencer par initialiser un tableau qui stockera les commandes a executer quand le script principal sera telecharge
par exemple monService = monService || {cmd:[] } ainsi, on peux ajouter ce qu'on veut : monService.cmd.push(() => { console.log('ok'); });.
et quand monService sera telecharge, il executera tout ce qu'il y aura dans monService.cmd.

jusque la ca va, mais meme apres telechargement du service, on pourra toujours faire monService.cmd.push(() => console.log('re'); }); et celui-ci sera quand meme execute

comment implementeriez-vous ca : un setInterval degeux qui verifie le contenu de monService.cmd ?
un observer sur l'array ?
autre ?

les solutions que je trouve sur internet me semblent completement dysproportionnes par rapport au probleme

[mathieu]

quand le script principal sera telecharge

vous parlez du moment o� le script est t�l�charg� par le navigateur ?

on pourra toujours faire

qui est ce "on" ?

[Doksuri]

vous parlez du moment o� le script est t�l�charg� par le navigateur ?

=> oui

en gros, dans l'ordre chronologique, ca ferait ca :

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
monService.cmd.push(() => { console.log('1'); });
monService.cmd.push(() => { console.log('2'); });
<script src="monService.js"></script>
/* monService.js execute tout ce qu'il y a dans monService.cmd (1 & 2) */
monService.cmd.push(() => { console.log('3'); });
/* monservice.js execute la nouvelle commande (3)*/

[mathieu]

et qu'est ce que vous souhaitez obtenir comme r�sultat ?

[Doksuri]

bah, ce que j'ai explique dans mon dernier message : la chronologie

pouvoir ajouter des commande avant & apres qu'un script soit telecharger, mais sans passer par un timeout degeu, ni par une solutions spagetti

voici ce que j'essaye de faire (j'ai volontairement mis un long timeout que vous puissiez comrendre comment ca fonctionne)

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
monService = monService || {cmd:[]};
monService.cmd.push(() => { console.log('before 1'); });
monService.cmd.push(() => { console.log('before 2'); });
/* simulation fin telechargement monService.js */
var monService = {
    cmd:monService.cmd || [],
    checkQueue:function() {
        for(let i=0; i<this.cmd.length; ++i) {
            this.cmd[0]();
            this.cmd.shift();
        }
    },
    init:function() {
        monServiceLoop = setInterval(() => {
            this.checkQueue();
        }, 1E3);
    }
};
monService.init();
/* fin monService.js */
 
/* continuite de mon code */
monService.cmd.push(() => { console.log('after 1'); });
monService.cmd.push(() => { console.log('after 2'); });

[NoSmoking]

Bonjour,
j'aurais mis une m�thode add plut�t qu'un push direct.

Quand est-ce que les � cmd � sont ex�cut�es,

• une fois initialis�e ;
• ex�cut�e qu'une que fois toutes sont initialis�es ;
• apr�s que celles en cours sont termin�es.

Pour moi elles ex�cuteront bien dans l'ordre !

[Doksuri]

c'est pas l'ordre qui me pause probleme, mais l'execution apres chargement du script (dans mon exemple, c'est les after qui me posent probleme)

[NoSmoking]

Si on en revient � :

comment implementeriez-vous ca

je ferais � premi�re vu quelque chose comme :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
const Service = {
  queue: [],
  isStart: false,
  add: function (callback) {
    this.queue.push(callback);
    if( this.isStart) {
      this.action();
    }
    return this;
  },
  action: function () {
    while (this.queue[0]) {
      this.queue[0]();
      this.queue.shift();
    }
  },
  start: function () {
    this.isStart = true;
    this.action();
    return this;
  },
  stop: function () {
    this.isStart = false;
    return this;
  },
}

avec une utilisation du type :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
Service
  .add(() => { console.log('service 1'); })
  .add(() => { console.log('service 2'); })
  .add(() => { console.log('---------'); });
Service.start();
Service
  .add(() => { console.log('service 3'); })
  .add(() => { console.log('service 4'); });

Je ne sais pas si c'est ce que tu cherches � faire ou un truc dans ce style !

[Doksuri]

ton script fonctionne uniquement si le fichier qui contient ton Service a ete charge avant les appels a Service.add()

ce que j'essaye de faire, c'est pouvoir stocker des commandes en attendant que le service soit charge, qu'il les charge (quand le service est charge), puis que les nouvelles commandes (post chargement) soit executees

(mon probleme est si tordu que ca ?)

[Watilin]

pouvoir ajouter des commande avant & apres qu'un script soit telecharger, mais sans passer par un timeout degeu, ni par une solutions spagetti

Moi �a me fait penser � Cron, o� � la boucle principale des navigateurs et de la plupart des jeux vid�o. On a une � routine � qui consulte le tableau p�riodiquement (typiquement, 60 fois par seconde) et sa p�riode est fixe, ce qui donne un certain nombre de garanties. Vouloir asservir le d�clenchement de cette routine � ce qui se passe dans le tableau, c�est � mon avis se compliquer la vie. Donc je pense que dans le cas pr�sent, un timeout n�est pas d�gueu, c�est un cas d�utilisation tout � fait justifi�.

[Doksuri]

Donc je pense que dans le cas pr�sent, un timeout n�est pas d�gueu, c�est un cas d�utilisation tout � fait justifi�.

ok, je vais donc rester sur cette formule (meme si elle ne me plait pas trop)

[NoSmoking]

ce que j'essaye de faire, c'est pouvoir stocker des commandes en attendant que le service soit charge,

c'est quand m�me pas bien orthodoxe

Il existe une solution d'� �coute � en passant par un new Proxy qui pourrait dans ce cas te convenir.

Le principe �tant d'encapsuler ton tableau monService.cmd dans un Proxy qui va intercepter les actions sur celui-ci et ce une fois ton init r�alis� et apr�s traitement des donn�es d�j� pr�sentes.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
var monService = {
  cmd: monService.cmd || [],
 
  init: function() {
    // on traite les éléments déjà stockés
    while (this.cmd[0]) {
      this.cmd[0]();
      this.cmd.shift();
    };
    // on encapsule l'array dans un Proxy
    this.cmd = new Proxy(this.cmd, {
      set: function(target, prop, val) {
        if ("function" === typeof val) {
          val();
          target.unshift();
        }
        return true;
      },
    })
  }
};

Le peu que je viens de tester semble fonctionner.

[Doksuri]

Il existe une solution d'� �coute � en passant par un new Proxy qui pourrait dans ce cas te convenir.

Le principe �tant d'encapsuler ton tableau monService.cmd dans un Proxy qui va intercepter les actions sur celui-ci et ce une fois ton init r�alis� et apr�s traitement des donn�es d�j� pr�sentes.

genial ! c'etait typiquement un truc comme ca que je cherchais ! merci