Code Test(2)

L'exemple d'animation ci-bas est tiré (et adapté) du tuto difficulté moyenne de MSoft
portant sur le svg. J'en ai tiré quelques enseignements.

Le svg se place 'inline' (le texte en continu) ou en 'block' pour le visuel. Le code crée
les éléments visuels avc les règles du CSS. On a la liberté du créer des animations à la
vitesse voulue, par 'delay',qui est le multiplicateur sur le cycle normal de la machine.
Et on se sert du requestAnimationFrame - et ainsi du stop cette fonction - pour faire
avancer les choses. On remarque que la fonction s'autorise de l'intérieur (calls itself),
jusqu'à épuisement.

J'ai bien testé la vitesse en y ajoutant un facteur Math.random(); et, comme on pouvait
s'y attendre, le ballon se déplace alors d'une façon totalement erratique. Ce qui nous
emmène à constater que cette façon de procéder crée vraiment un mouvement régulier.
L'explication de la démarche revient à l'idée que l'on ne demande pas explicitement un
changement donné dans la position de la balle, mais on crée un vecteur vitesse que le cpu
est chargé d'interpréter. On invoque ici la notion d'analyse dimensionnelle: ne peuvent
se répondre que des notions de nature similaire en ce qui a trait au temps et à l'espace. (Lord Rayleigh, 1872)

Dans le premier cas, le ballon va se déplacer à une vitesse différente chaque fois que l'on joue l'animation.

 

 

Dans le deuxième cas, le déplacement du ballon sera d'une pertubé et erratique, car cette instruction se trouve dans la boucle. La commande return exige que le calcul soit fait et la function exécutée et que le résultat soit renvoyé au cycle d'exécution. (Notion  du langage c).

Reste à ajouter de la complexité, par exemple, par une interaction avec l'utilisateur.