URL: https://linuxfr.org/users/axioplase/journaux/javascript-golf-et-graphismes Title: Javascript, golf, et graphismes Authors: Axioplase ıɥs∀ Date: 2017年12月29日T17:10:50+01:00 License: CC By-SA Tags: demoscène, javascript et golf Score: 45 Bonjour Nal, En ce dernier dredi de 2017, j'ai décidé de t'écrire une dernière fois pour te faire part de ma découverte de [Dwitter](https://www.dwitter.net). Dwitter est un petit site sur lequel on peut poster du code en Javascript pour faire des animations, ou des jolies nimages. Et il faut le faire en 140 caractères ou moins, d'où le "golf" (une pratique rigolote qui consiste à écrire les programmes les plus petits). On vous demande d'écrire le corps d'une fonction "u(t)", où "t" représente le temps écoulé depuis le début du programme, en secondes. La fonction "u" est appelée 60 fois par seconde. Pour simplifier les choses un peu, les auteurs du site ont raccourci le nom de quelques fonctions (cos et sin) et déjà configuré un canvas, ce qui permet de grappiller quelques caractères supplémentaires. Voici comment on s'y prend: Code original ```javascript c.width=1920; // efface l'écran for (i = 0; i< 1920; i++) { // pour toute la largeur x.fillStyle=R((960*(1+S(i/10)))/5,255-(960*(1+S(i/10)))/4,255-(960*(1+S(i/10)))/9); // jolies couleurs x.fillRect(i,540+200*Math.sin(10*t+i/20)*Math.cos(t+S(i/300)),20,20); // jolie suite de points } ``` Variables intermédiaires, change l'ordre de la boucle principale ```javascript c. for (i = w; i> 0; i--) { f = (960*(1+S(i/10))); x.fillStyle=R(f/5,255-f/4,(255-f)/9); x.fillRect(i,540+200*Math.sin(10*t+i/20)*Math.cos(t+S(i/300)),20,20); } ``` Substitutions sin/cos, et remplace 10 par 9 (personne ne verra la différence) ```javascript c.width=w=1920; for (i = w; i> 0; i--) { f = (960*(1+S(i/9))); x.fillStyle=R(f/5,255-f/4,(255-f)/9); x.fillRect(i,540+200*S(9*t+i/20)*C(t+S(i/300)),20,20); } ``` Dirime les espaces, point-virgules et parenthèses ```javascript c.width=w=1920;for(i=w;i>0;i--)f=(960*(1+S(i/9))),x.fillStyle=R(f/5,255-f/4,(255-f)/9),x.fillRect(i,540+200*S(9*t+i/20)*C(t+S(i/300)),20,20) ``` Et voila le [produit final](https://www.dwitter.net/d/4681) en exactement 140 caractères ! Après, il y a des gens qui font des trucs de fou, et c'est rigolo de comprendre comment ils y sont arrivés : [motif mouvant](https://www.dwitter.net/d/701), [raytracer(?)](https://www.dwitter.net/d/1112), [fractal](https://www.dwitter.net/d/697) Allez, Nal, à l'an prochain !