165 lines
12 KiB
HTML
165 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>YBlog - Pas de CoffeeScript pour moi (malheureusement)</title>
|
||
<meta name="keywords" content="Coffeescript" />
|
||
|
||
<link rel="shortcut icon" type="image/x-icon" href="../../../../Scratch/img/favicon.ico" />
|
||
<link rel="stylesheet" type="text/css" href="../../../../css/y.css" />
|
||
<link rel="stylesheet" type="text/css" href="/css/legacy.css" />
|
||
<link rel="alternate" type="application/rss+xml" title="RSS" href="/rss.xml" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<link rel="apple-touch-icon" href="../../../../Scratch/img/about/FlatAvatar@2x.png" />
|
||
<!--[if lt IE 9]>
|
||
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
|
||
<![endif]-->
|
||
<!-- IndieAuth -->
|
||
<link href="https://twitter.com/yogsototh" rel="me">
|
||
<link href="https://github.com/yogsototh" rel="me">
|
||
<link href="mailto:yann.esposito@gmail.com" rel="me">
|
||
<link rel="pgpkey" href="../../../../pubkey.txt">
|
||
</head>
|
||
<body lang="fr" class="article">
|
||
<div id="content">
|
||
<div id="header">
|
||
<div id="choix">
|
||
<span id="choixlang">
|
||
<a href="../../../../Scratch/en/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/">Anglais</a>
|
||
</span>
|
||
<span class="tomenu"><a href="#navigation">↓ Menu ↓</a></span>
|
||
<span class="flush"></span>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="titre">
|
||
<h1>Pas de CoffeeScript pour moi (malheureusement)</h1>
|
||
|
||
</div>
|
||
<div class="flush"></div>
|
||
<div id="afterheader" class="article">
|
||
<div class="corps">
|
||
<div>
|
||
<img src="../../../../Scratch/img/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/main.png" alt="Title image" />
|
||
</div>
|
||
<div class="encadre">
|
||
<p><em>Mise à jour :</em> Je pense que je vais finallement changer d’avis. Pourquoi ? Tout d’abord, je viens de découvrir un convertisseur javascript vers coffeescript, ensuite Denis Knauf m’a laissé un commentaire et m’a appris l’existence d’une fonction <code>CoffeeScript.eval</code>. De plus, il faut voir CoffeeScript comme javascript avec une syntaxe similaire à Ruby et pas comme un langage similaire à Ruby.</p>
|
||
</div>
|
||
<div class="intro">
|
||
<p><span class="sc"><abbr title="Trop long; pas lu">tlpl</abbr>: </span> Qu’est-ce qui n’allait pas avec Coffeescript? La meta-programmation, il faut le “vendre” aux autres, une nouvelle étape de compilation intermédiaire sans fournir les avantages de Cappuccino, la sensation que c’est un peu instable.</p>
|
||
</div>
|
||
<p>Le commentaire le mieux classé de <a href="http://news.ycombinator.com/item?id=2053956">la question suivante</a> posée sur HackerNews mentionnait <a href="http://coffeescript.org">CoffeeScript</a>. Récemment j’ai beaucoup programmé en javascript. Après avoir essayé <a href="http://sproutcore.com">Sroutcore</a>, <a href="http://cappuccino.org">Cappuccino</a>, <a href="http://wiht.link/backbonejs-intro">backbone.js</a> <em>&</em> <a href="http://javascriptmvc.com">javascriptMVC</a>, Je me suis décidé à créer mon propre framework MVC minimal pour client javascript.<a href="#fn1" class="footnote-ref" id="fnref1"><sup>1</sup></a></p>
|
||
<p>Je me suis battu avec l’horrible syntaxe de javascript. C’était comme revenir des années dans le passé :</p>
|
||
<ul>
|
||
<li>une syntaxe à la Java très verbeuse ;</li>
|
||
<li>une syntaxe follement verbeuse et étrange pour la programmation orientée objet ;</li>
|
||
<li>pas de manière naturelle de se référer à l’instance d’une classe ;</li>
|
||
<li>etc…</li>
|
||
</ul>
|
||
<p>J’étais tellement ennuyé par tous ces point qu’il était arrivé un moment où je commençais à vouloir faire mon propre CoffeeScript.</p>
|
||
<p>J’ai fini une première version de mon framework MVC en javascript et j’ai appris l’existence de CoffeeScript. Merci à git, j’ai immédiatement créé une nouvelle branche dans le seul but d’essayer CoffeeScript.</p>
|
||
<p>Voici mon expérience :</p>
|
||
<ol type="1">
|
||
<li>J’ai dû installer <code>node.js</code> et utiliser <code>npm</code> simplement pour utiliser CoffeeScript. Ce n’était pas très difficile, mais pas aussi facile que ce que j’aurai aimé.</li>
|
||
<li>Les fichier javascript existants ne sont pas compatible avec coffee.</li>
|
||
<li>Il n’y a pas script pour aider à transformer les anciens fichiers javascripts en fichier coffee. Du coups j’ai dû faire ça manuellement. Merci à <a href="http://vim.org">vim</a>, il ne fut pas très difficile de transformer 90% des fichiers avec des expressions régulières. L’option <code>--watch</code> de coffee était très utile pour debugger cette transformation. Cependant, il m’a fallu écrire mon propre script pour que tous mes fichiers soient <em>watchés</em> dans tous les sous-répertoires.</li>
|
||
<li>Quelque chose à laquelle je n’avais pas pensé. J’ai fait un peu de meta-programmation en javascript en utilisant <code>eval</code>. Mais pour que celà fonctionne correctement, il faut que la chaîne de caractère que je passe à <code>eval</code> soit codée en javascript et pas en coffee. C’est un peu comme écrire dans deux langages différents au même endroit. Ça ne me parraissait vraiment pas agréable.</li>
|
||
</ol>
|
||
<h2 id="conclusion">Conclusion</h2>
|
||
<p>Avantages :</p>
|
||
<ul>
|
||
<li>Code plus lisible : CoffeeScript résoud la majorité des problèmes de syntaxes de javascript</li>
|
||
<li>Concision : j’ai gagné 14% de lignes, 22% de mots et 14% de caractères.</li>
|
||
</ul>
|
||
<p>Inconvénients :</p>
|
||
<ul>
|
||
<li>Ajout d’une nouvelle étape de compilation avant de pouvoir vérifier le comportement de mon site</li>
|
||
<li>Facilité d’utilisation : il m’a fallu créer un script pour gérer la génératio automatique des fichiers</li>
|
||
<li>Il faut apprendre un autre langage proche de ruby</li>
|
||
<li>La meta-programmation devient une expérience désagréable</li>
|
||
<li>Je dois convaincre les personnes travaillant avec moi :
|
||
<ul>
|
||
<li>d’installer <code>node.js</code>, <code>npm</code> et CoffeeScript ;</li>
|
||
<li>de se souvenir de lancer un script à chaque session de codage ;</li>
|
||
<li>d’apprendre un autre language proche de ruby.</li>
|
||
</ul></li>
|
||
</ul>
|
||
<p>Les deux derniers points étant de mon point de vue les plus problématiques.</p>
|
||
<p>Mais même si j’avais à travailler seul, je n’utiliserai certainement pas CoffeeScript. Il s’agit d’un tier dont la moindre mise à jour pourrait rendre mon code inutilisable. Cette situation m’est déjà arrivée plusieurs fois et c’est très désagrable. Beaucoup plus que coder avec une mauvaise syntaxe.</p>
|
||
<h2 id="digression">Digression</h2>
|
||
<p>Je suis attristé. J’espérais tant pouvoir programmer Javascript avec une touche de Ruby. En fin de compte, cette solution n’est pas pour moi. Je vais devoir utiliser l’<em>horrible</em> syntaxe javascript pour l’instant. À la limite j’aurai préféré un script Ruby2Js par exemple<a href="#fn2" class="footnote-ref" id="fnref2"><sup>2</sup></a>. Mais il me semble que ça serait un travail très difficile rien que pour simuler l’accès à la classe courante.</p>
|
||
<p>Typiquement <code>@x</code> est transformé en <code>this.x</code>. Mais le code suivant ne fait pas ce que j’attendrai de lui.</p>
|
||
<div class="sourceCode" id="cb1"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb1-1" title="1">-> </a>
|
||
<a class="sourceLine" id="cb1-2" title="2"><span class="kw">class</span> <span class="dt">MyClass</span></a>
|
||
<a class="sourceLine" id="cb1-3" title="3"> <span class="st">foo: </span>-></a>
|
||
<a class="sourceLine" id="cb1-4" title="4"> alert(<span class="st">'ok'</span>)</a>
|
||
<a class="sourceLine" id="cb1-5" title="5"></a>
|
||
<a class="sourceLine" id="cb1-6" title="6"> <span class="st">bar: </span>-></a>
|
||
<a class="sourceLine" id="cb1-7" title="7"> $(<span class="st">'#content'</span>).load( <span class="st">'/content.html'</span>, ( -> <span class="ot">@foo</span>(x) ) )</a>
|
||
<a class="sourceLine" id="cb1-8" title="8"> <span class="co"># Ça n'appellera pas MyClass.foo</span></a></code></pre></div>
|
||
<p>La seule façon de résoudre ce problème est avec le code suivant :</p>
|
||
<div class="sourceCode" id="cb2"><pre class="sourceCode ruby"><code class="sourceCode ruby"><a class="sourceLine" id="cb2-1" title="1">-> </a>
|
||
<a class="sourceLine" id="cb2-2" title="2"><span class="kw">class</span> <span class="dt">MyClass</span></a>
|
||
<a class="sourceLine" id="cb2-3" title="3"> <span class="st">foo: </span>-></a>
|
||
<a class="sourceLine" id="cb2-4" title="4"> alert(<span class="st">'ok'</span>)</a>
|
||
<a class="sourceLine" id="cb2-5" title="5"></a>
|
||
<a class="sourceLine" id="cb2-6" title="6"> <span class="st">bar: </span>-></a>
|
||
<a class="sourceLine" id="cb2-7" title="7"> <span class="dv">self</span>=this</a>
|
||
<a class="sourceLine" id="cb2-8" title="8"> $(<span class="st">'#content'</span>).load( <span class="st">'/content.html'</span>, ( -> <span class="dv">self</span>.foo(x) ) )</a></code></pre></div>
|
||
<p>Sachant celà, la notation <code>@</code> perd tout son intérêt pour moi.</p>
|
||
<section class="footnotes">
|
||
<hr />
|
||
<ol>
|
||
<li id="fn1"><p>Je sais que ce n’est certainement ni la meilleure ni la plus productive des décisions. Mais j’aime bien fabriquer les choses pour savoir comment tout fonctionne dans le détail.<a href="#fnref1" class="footnote-back">↩</a></p></li>
|
||
<li id="fn2"><p>Je sais qu’il existe un projet <code>rb2js</code>, mais il ne résoud pas le problème dont je parle.<a href="#fnref2" class="footnote-back">↩</a></p></li>
|
||
</ol>
|
||
</section>
|
||
</div>
|
||
<div id="afterarticle">
|
||
<div id="social">
|
||
<a href="/rss.xml" target="_blank" rel="noopener noreferrer nofollow" class="social">RSS</a>
|
||
·
|
||
<a href="https://twitter.com/home?status=http%3A%2F%2Fyannesposito.com/Scratch/fr/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/%20via%20@yogsototh" target="_blank" rel="noopener noreferrer nofollow" class="social">Tweet</a>
|
||
·
|
||
<a href="http://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fyannesposito.com/Scratch/fr/blog/2011-01-03-Why-I-sadly-won-t-use-coffeescript/" target="_blank" rel="noopener noreferrer nofollow" class="social">FB</a>
|
||
<br />
|
||
<a class="message" href="../../../../Scratch/fr/blog/Social-link-the-right-way/">Ces liens sociaux préservent votre vie privée</a>
|
||
</div>
|
||
<div id="navigation">
|
||
<a href="../../../../">Accueil</a>
|
||
<span class="sep">¦</span>
|
||
<a href="../../../../Scratch/fr/blog">Blog</a>
|
||
<span class="sep">¦</span>
|
||
<a href="../../../../Scratch/fr/softwares">Logiciels</a>
|
||
<span class="sep">¦</span>
|
||
<a href="../../../../Scratch/fr/about">Auteur</a>
|
||
</div>
|
||
<div id="totop"><a href="#header">↑ Top ↑</a></div>
|
||
<div id="bottom">
|
||
<div>
|
||
Published on 2011-01-03
|
||
</div>
|
||
<div>
|
||
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
|
||
</div>
|
||
<div>
|
||
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.en_US">Yann Esposito©</a>
|
||
</div>
|
||
|
||
<div>
|
||
Done with
|
||
<a href="http://www.vim.org" target="_blank" rel="noopener noreferrer nofollow"><strike>Vim</strike></a>
|
||
<a href="http://spacemacs.org" target="_blank" rel="noopener noreferrer nofollow">spacemacs</a>
|
||
<span class="pala">&</span>
|
||
<a href="http://nanoc.ws" target="_blank" rel="noopener noreferrer nofollow"><strike>nanoc</strike></a>
|
||
<a href="http://jaspervdj.be/hakyll" target="_blank" rel="noopener noreferrer nofollow">Hakyll</a>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</body>
|
||
</html>
|