El auge de Javascript
Algunos de los servicios más populares de Internet usan intensivamente librerías/frameworks Javascript (des de los famosos jQuery y YUI o otros frameworks cómo Script.aculo.us, Prototype, Moo Tools o Dojo), algunos de los clarisimos ejemplos són GoogleMaps, Twitter o más recientemente Klout y Digg.
Pero des de hace ‘poco’ tiempo, están surgiendo algunas librerías Javascript que están subiendo como la espuma y que incorporan conceptos y tecnologías innovadores que cabe destacar, entre ellas:
- Web Oficial: http://nodejs.org
- Tutorial: Node Begginer
Es una libería javascript de I/O (entrada/salida) asíncrona basada en V8 de Google (máquina virtual de alto rendimiento y escalabilidad). Uno de las ventajas principales es su velocidad y ligereza, mucho más rápido que Ruby, Python,Perl o PHP y con capacidad de manejar miles de conexiones simultáneas con una sobrecarga mínima en un solo proceso.
Otra de las características son que trabaja en el lado del servidor (server-side), cuando usualmente Javascript trabaja en el lado del cliente. Esto permite mayor escalabilidad, ya que uno de los principales objetivos es crear aplicaciones web y servidores web.
Ejemplo de código para crear un senzillo servidor (extracto de la web oficial):
var http = require('http'); http.createServer(function (req, res) { res.writeHead(200, {'Content-Type': 'text/plain'}); res.end('Sindikos.com\n'); }).listen(1337, "127.0.0.1");
- Web Oficial: http://documentcloud.github.com/backbone/
- Tutorial: http://backbonetutorials.com/
Proporciona una estructura MVC (modelo-vista-controlador) para aplicaciones Javascript con modelos ‘key-value’, eventos, colecciones y una completa API con filosofia RESTful y soporte JSON. Este framework en Javascript podría compararse a Rails en Ruby, Symfony en PHP o Django en Python, que proporcionan modelos MVC y DRY (Don’t Repeat Yourself).
Ejemplo de uso:
- Backbone.Model: La función se envuelve dentro de la capa de Modelo (o de negocio).
- Backbone.Collection: Crea una colección con ordenación, filtrado, adición, eliminación, etc.
- Backbone.Router/Backbone.Controller: Mapea URLs con funciones
- Backbone.View: Añade una interfaz de usuario (UI).
– Less.js:
- Web Oficial: http://lesscss.org/
- Tutorial: http://designshack.net/articles/css/using-less-js-to-simplify-your-css3
LESS añade funcionalidades dinámicas a las Hojas de Estilos con variables, operadores o funciones. Puede correr en modo cliente dentro el navegador o en el servidor con Node.js. Esto permite generar hojas de estilo en tiempo real dependiendo de los parametros pasados a la hoja de estilo.
Un ejemplo de su funcionamiento seria:
.rounded(@radius: 3px) {
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
border-radius: @radius;
}
Si llamamos a “.rounded()”, el radio del objeto será de 3px. Si llamamos a “.rounded(10)”, será de 10 píxeles. Podemos observar que al añadir ‘@’ delante de una declaración, esta actúa como una variable pasada a la función, que incluso permite declarar el valor por defecto.
Ejemplo código CSS dinámico con LESS JS (extracto de la web oficial):
.box-shadow (@x: 0, @y: 0, @blur: 1px, @alpha) {
@val: @x @y @blur rgba(0, 0, 0, @alpha);
box-shadow: @val;
-webkit-box-shadow: @val;
-moz-box-shadow: @val;
}
.box { @base: #f938ab;
color: saturate(@base, 5%);
border-color: lighten(@base, 30%);
div { .box-shadow(0, 0, 5px, 0.4) }
}
Conoces alguna otra librería / framework Javascript interesante? Apuntalo en los comentarios y le haremos una pequeña revisión!
Comments Off