MooTools Vs. JQuery

moovsjqNegli ultimi anni i framework javascript hanno avuto una forte espansione ed è ormai impensabile la realizzazione di un sito/applicazione web che faccia un uso del javascript che vada oltre il banale, senza l’utilizzo di uno di questi framework.

In questo articolo voglio mostrare le differenze tra due di questi framework, che come avrete capito dal titolo sono MooTools e JQuery. Il motivo per cui ho scelto di mettere a confronto proprio queste due librerie è per mostrare come mai ritengo MooTools superiore a jQuery, che al momento è senza dubbio il framework più diffuso.

Fama immeritata

Per qualche ragione a me ignota MooTools ha la fama di essere un framework complicato da usare, o per un target di utenti più esperti. In realtà, e illustrerò con esempi, il codice javascript scritto con MooTools è nella maggioranza dei casi di più facile lettura e ha una semantica più intuitiva, senza per questo essere più complicato o lungo da scrivere.

Diversi negli obiettivi

Va chiarito, a dirla tutta, che i due contendenti non si pongono gli stessi obiettivi e per questo alcune loro scelte fatte in fase di design del linguaggio sono state influenzate dal diverso utilizzo immaginato per la libreria.

Nel dettaglio jQuery si prefigge l’obiettivo di manipolare il DOM in maniera semplice e rapida scrivendo poco codice, mentre MooTools ha ambizioni più ampie: Estendere il linguaggio javascript per permettere la scrittura di codice Object Oriented anche se sappiamo bene che JavaScript è un linguaggio prototipato.

Il fatto che forse non viene considerato quando si sceglie il framework in base a queste premesse, è che l’obiettivo di MooTools non esclude che questo sia anche semplice e di rapido utilizzo per manipolare il DOM.

Il codice scritto con jQuery non è poi tanto meno…

…non tanto da giustificare la grossa perdita di leggibilità del codice comunque. jQuery ha infatti questo brutto vizio di avere funzioni che fanno cose completamente diverse a seconda dei parametri che gli vengono passati.

A livello logico posso anche accettare il fatto che se chiamo la funzione $('element').click() senza parametri, invece che impostare un evento, lo “triggero”, ma il codice diventa molto meno chiaro da leggere e, soprattutto, diventa molto più facile sbagliare.

Di contro…

Il codice scritto con MooTools è facile da leggere

La sua sintassi è proprio pensata per essere compresa con un’occhiata anche da chi non ha dimestichezza col framework.

$(document).ready(function() {
  $('#element').css('color','blue').click(function() {
    alert($('#element').css('color'));
  });
});
//[...]
$('#element').click();
window.addEvent('domready', function() {
  document.id('element').setStyle('color','blue').addEvent('click', function() {
    alert(document.id('element').getStyle('color'));
  });
});
//[...]
document.id('element').fireEvent('click');

Da notare che avrei potuto usare $('element') in MooTools al posto di document.id('element') che però trovo molto più chiaro. Allo stesso modo avrei potuto usare jQuery('#element') in jQuery che invece non rende in alcun modo più evidente il significato del codice.

Il paradigma ad oggetti non ha rivali

Come già detto in precedenza, MooTools, aka My Object Oriented (JavaScript) Tools, da la possibilità di seguire il paradigma di programmazione orientata agli oggetti in javascript con gli ovvi vantaggi derivati dalle sue proprietà: Incapsulazione, Ereditarietà e Polimorfismo. Non riesco a immaginare di poter programmare una qualsiasi funzionalità che vada oltre un “Hello World” in semplice programmazione strutturata.

var Cat = Class({
  razza: "Gatto",
  verso: "Miao",

  speak: function() {
    return "Il "+this.razza+" fa "+this.verso;
  }
});

var Dog = Class({
  Extends: Cat,
  razza: "Cane",
  verso: "Bau",

  initialize: function(razza) {
    if (razza)
      this.razza = razza;
  }
});

var cat = new Cat();
var dog = new Dog();
var mydog = new Dog("Pitbull");

cat.speak(); // Il Gatto fa Miao
dog.speak(); // Il Cane fa Bau
mydog.speak(); // Il Pitbull fa Bau

Il bello è che questo modello viene applicato anche ai prototipi base del JavaScript consendendoci di estendere il linguaggio base.

Immaginiamo per esempio di aver bisogno di una funzione che ci permette di verificare se una stringa inizi con un’altra stringa specificata. In javascript semplice scriveremmo il seguente codice:

function starts_with(s1, s2) {
  return s1.substr(0,s2.length)==s2;
}

var foo="abcdef";
starts_with(foo, "abc"); //True

In MooTools invece possiamo estendere la “classe” String, aggiungendo il metodo che ci serve:

String.implement({
  startsWith: function(s) {
    return this.substr(0,s.length)==s;
  }
});

var foo="abcdef";
foo.startsWith("abc"); //True

Molto più pulito non trovate?

I plugin scritti per MooTools sono quindi solitamente delle classi che racchiudono tutte le funzionalità e che possono a loro volta essere estesi per aggiungere/modificare a seconda delle proprie esigenze, mentre in jQuery i plugin non sono altro che delle funzioni dichiarate all’interno del namespace globale jQuery.fn e non è possibile riprodurre la funzione startsWith in jQuery. Un altro esempio:

jQuery.fn.colorize = function(color) {
  this.each(function() {
    this.css('color', color);
  });
  return this;
};

Conclusioni

Ci sarebbe molto altro da dire su entrambi i framework ma in definitiva trovo che MooTools lasci molta più libertà allo sviluppatore e allo stesso tempo offra molto di più. jQuery invece consente di scrivere meno codice a discapito della leggibilità e dispone di molti più plugin già pronti, grazie al fatto che il suo uso è molto più diffuso e quindi la comunità conta di più sviluppatori che, IMHO, non hanno capito niente.

Post-Scriptum

Al di là delle affermazioni provocatorie trovo che jQuery sia un ottimo framework javascript, sicuramente meglio di molti altri rappresentanti della concorrenza come Prototype, ma MooTools è troppo meglio!

Lascia un commento

Tutti i campi sono obbligatori.
L'indirizzo email non verrà pubblicato

 

Commenti

  1. avatarFabio

    Ottimo, ero proprio in cerca di questo tipo di confronto e la tua analisi mi è stata davvero utile, bravo

    sai cosa mi sarebbe piaciuto trovare in fondo al post? un link che punti a qualcuno in giro per il web che sostenga la tesi opposta… sarebbe davvero il massimo.

  2. Pingback: Ereditarietà multipla in MooTools - blog.artera.net

  3. avatarPaolo

    Ciao.
    Chissà se qualcuno ancora leggerà questo mio commento tre anni dopo.

    Sinora conoscevo solo jquery ma mi sono paralizzato dopo aver affrontato i problemi di incompatibilità sull’ereditarietà di jquery.

    Ho letto un sacco di articoli che sostengono esattamente le tue stesse idee e io concordo in pieno su tutto.

    Un’unica domanda: ma ora che siamo nel 2014 è ancora così, cioé che mootools vale più di jquery da un punto di vista ingegneristico? O jquery ha sopperito al gap?

    Perché in tutti i siti di analisi comparativa basata sui numeri la diffusione di jquery è spaventosamente più ampia.

    Tra l’altro io uso molto joomla e la cosa mi preoccupa ancora di più.

    Cosa ne pensi?

  4. avatarMassimiliano Torromeo Autore

    Ciao Paolo,
    ad oggi il gap d’uso tra MooTools e jQuery è aumentato ancora di più ed era destino purtroppo che si allargasse perché questo è il classico problema del cane che si morde la coda: nessuno usa MooTools perché nessuno usa MooTools.

    La conseguenza è che in questo momento MooTools non è più attivamente sviluppato, non come lo conosciamo noi ad ogni modo.

    E’ in sviluppo un nuovo framework riscritto da zero dagli stessi autori che si chiama MooTools Prime (https://github.com/mootools/prime).

    Questo nuovo framework si prefigge di risolvere alcuni problemi che per la sua natura MooTools ha sempre avuto:
    1. non manipolare i prototipi dei tipi base javascript (che come dicevo nell’articolo io trovavo comodo) risolvendo le incompatibilità con altri framework.
    2. essere facilmente utilizzabile anche lato server (es: nodejs)

    jQuery dal lato suo non è cambiato molto, il suo approcio come framework js è lo stesso di anni fa ma è tuttora il framework più diffuso in circolazione.

    Joomla è un CMS che non mi è mai piaciuto molto (lunga storia di vulnerabilità) ma da quello che so stanno dismettendo MooTools in favore di jQuery che dal loro punto di vista è una mossa sensata visto quanto detto finora. http://docs.joomla.org/J3.2:Javascript_Frameworks