Mejorando el rendimiento con el API DOM desde Javascript

Introducción

Actualmente me encuentro realizando algunos proyectos que requieren de mucho trabajo con el API DOM y el manejo de nodos desde Javascript. Para ayudarnos con este tipo de tareas, existen muchas bibliotecas como jQuery, Zepto o Underscore que nos hacen la vida más fácil pero siempre a costa de rendimiento. Por lo general, este coste es asumible, pero hay veces que necesitamos exprimir al máximo la capacidad del navegador porque estamos manejando objetos enormes.

Cuando precisamente necesitamos que nuestra aplicación sea lo más rápida posible, tenemos que intentar utilizar los métodos nativos del lenguaje para evitar la ‘sobrecarga’ que supone el uso de bibliotecas de terceros. Y es aquí donde, por culpa de algunos errores frecuentes mientras programamos, podemos echar por tierra cualquier esfuerzo por optimizar nuestro código.

Aunque muchos de los consejos que veremos a continuación son de sobra conocidos, no está de mal recopilarlos a modo de pequeña guía o recetario para quienes buscan el máximo rendimiento cuando se manejan objetos o listas de nodos. Seguir Leyendo…

Dentro de Javascript | Etiquetas: , , | 9 Comentarios

Creando objetos y aplicaciones configurables en Javascript

Introducción

Aquellos que estén más familiarizados con la programación de plugins para jQuery, conocen de sobra el método $.extend() de esta biblioteca. Gracias a él, podemos definir una serie de valores por defecto para nuestras aplicaciones (objetos) que se sobreescriben solo en caso de que éstos se especifiquen a su inicialización.

Este tipo de comportamiento, que identificable con el concepto de herencia clásica en la POO, podemos obtenerlo también en nuestras aplicaciones sin necesidad de recurrir a bibliotecas de terceros.

Veamos una forma sencilla de crear un objeto con una serie de valores por defecto que pueden ser sobreescritos desde su propia API. Seguir Leyendo…

Dentro de Javascript | Etiquetas: , , , , , , , | 3 Comentarios

El valor de this en Javascript: cómo manejarlo correctamente

Introducción

this es un valor complejo en Javascript; un error en el diseño del lenguaje susceptible de causar tanto comportamientos inesperados como potentes estructuras de código reutilizable. Su valor, lejos de ser intuitivo, se determina según la forma en que se invoque a la función que lo encierra, algo que no siempre es correctamente entendido o aprovechado.

Dado que el correcto manejo de this resulta esencial en la programación orientada a objetos, y en definitiva en el desarrollo moderno de aplicaciones, es interesante dedicar unos minutos a revisarlo.

Qué es exactamente this

La palabra clave this tiene en Javascript un comportamiento diferente al de otros lenguajes pero por lo general, su valor hace referencia al propietario de la función que la está invocando o en su defecto, al objeto donde dicha función es un método.

La palabra clave del párrafo anterior es “propietario“.
Seguir Leyendo…

Dentro de Javascript | Etiquetas: , , , , , , | 12 Comentarios

Midiendo el rendimiento de nuestros objetos canvas (Contador FPS)

Introducción

Preparando una aplicación basada íntegramente en canvas me topé con el blog del Proyecto Cyan, un interesante proyecto en español sobre la elaboración videojuegos en Javascript a través de un framework propio que han bautizado como piNgine.

Entre sus diversos y recomendables artículos, uno de los primeros trata sobre la medición del rendimiento de un objeto canvas según el número de FPS (imágenes por segundo) que es capaz de gestionar. Como es bien sabido en la industria del videojuego, éste es un valor esencial a la hora de buscar cuellos de botella y zonas pesadas que son susceptibles de mejorar. Seguir Leyendo…

Dentro de Javascript | Etiquetas: , , , , | 1 Comentario

El nuevo objeto jQuery $.Callbacks()

Introducción

En el post anterior revisamos los nuevos métodos on() y off() de la versión 1.7 de jQuery, sin duda, una de las innovaciones más interesantes.

Siguiendo con el estudio de esta versión, nos toca ahora echarle un vistazo a otra importante novedad: el objeto $.Callbacks().

Básicamente, $.Callbacks ofrece un completo stack (conjunto de elementos) donde definir una serie de funciones que serán ejecutadas en secuencia como resultado de una determinada condición o acción previa.

Como la explicación puede resultar confusa, comencemos con un ejemplo para ir luego avanzando con cada uno de los métodos que ofrece este nuevo elemento:
Seguir Leyendo…

Dentro de Javascript, jQuery | Etiquetas: , , , , , | 4 Comentarios
Página 4 de 30Primera...23456...102030...Última
Licencia Creative Commons 3.0

®Copyright 2011. Cotenido web bajo licencia Creative Commons 3.0

Códigos bajo licencias MIT y GPL. Ver página de licencias para más información