JQUERY - Live provoca memory leaks?

[leif_sk8er]

Buenas, estoy preparando una web que usa mucho js, el problema es que al parecer tengo grabes problemas de memory leaks....

Es posible que la gran cantidad de eventos live que tengo (unos 100) provoquen sobrecarga del navegador estando pendiente de esos eventos en todo el contenido viejo y nuevo cargado por ajax???

Un saludo!

[Dany_s]

¿100 eventos live en una sola página? ¿o son de todo el sitio que estan en el mismo js? creo que lei en el foro de javascript que tenias 200 jeje

[leif_sk8er]

bueno si, en realidad son como 200, es una aplicacion similar a escritorio pero online, como un sistema operativo vamos, que necesita controlar muchisimas cosas, y claro tengo un JS con todos los eventos que pueda necesitar para las cosas basicas y luego tb a parte tengo otros js que los cargo solo cuando los necesito, pero el inicial tiene como 200 eventos. Si ese pudiese ser el problema pensaria en generalizar mucho mas y luego con condiciones hacer el resto. Si no tiene nada que ver prefiero tenerlo asi por que es mas claro de lectura y mas organizado.

Pero el problema es que crea memory leaks muy a menudo parece ser y falta rendimiento en ordenadores de gama media. En un pc con i7 va fluido, pero por ejemplo en un core2duo la cosa va a duras pensas.

[leif_sk8er]

Por cierto, e visto que en tuenti por ejemploen vez de usar live o similar en su framework, los divs o buttons tienen el onclick en html con llamada a una funcion JS.... será mejor?

[Dany_s]

yo empezaría a tratar de optimizar el código, por ejemplo en tu ejemplo que pusiste en el foro de javascript tenes un evento click en .newwin_musica
y haces un condicional
if($(this).parent().parent().next().next().hasClas s("musica")==true){

o sea que haces esa consulta en cada click

podes guardar esa consulta en caso de que la variable no esté definida

Código Javascript:

if (typeof variableMusica != 'undefined'){
    selectorMusica = $(this).parent().parent().next().next();
 }
 

ahi solamente en el primer click va a realizar la selección

también podes asignarle un id al elemento que tiene la clase newwin_musica asi seleccionas ese id y verificas si tiene la clase .musica

if($('#elID').hasClass("musica")==true)


eso solo no será relevante pero si haces eso 500 veces si puede ser útil jeje

también podes usar el firebugs para ver el rendimiento de un script o jQuery Benchmark, yo no lo sé usar pero podrias investigar

[masterpuppet]

Deberias utilizar event delegation para reducir la cantidad de event handlers, JQuery 1.4+ tiene delegate.

Iniciado por leif_sk8er

Por cierto, e visto que en tuenti por ejemploen vez de usar live o similar en su framework, los divs o buttons tienen el onclick en html con llamada a una funcion JS.... será mejor?

Yo no lo haria, Unobtrusive JavaScript.

Saludos.

[Dany_s]

ah si los eventos click puedes usar delegate

yo no lo uso mucho, solo si quiero asignar un evento click a muchos elementos por ejemplo filas de una tabla, pero si son traidos con ajax lo hago con live es casi lo mismo que con delegate

[leif_sk8er]

Muchas gracias por vuestras respuestas. Estube mirando y la verdad es que no entiendo la diferencia entre delegate y live. Ambas actuan sobre todos los elementos indicados y incluso los elementos generados dinamicamente....

No hay mucha informacion en español sobre las diferencias entre ambos :S...

Dany_s justamente en el ejemplo que puse es muy .... no imposible... pero rebuscado darle un ID al elmento, en realidad si que lo tiene, pero son como ventanas a modo de widgets con divs generados dinamicamente de forma que es complicado... La forma mas simple y segura es esta.


Lo que voy a hacer es poner uno de los ficheros que he hecho enteros, se que es un pcoo complicado lo se, pero a ver si podeis decirme todos los fallos que veis en mi forma de programar y que me llevará a problemas de memoria o demas problemas, este es uno de los 15 ficheros que tengo, pero es suficiente para ver un poco de todas las cosas y donde estoy cometiendo errores.

Si pudierais tomaros la molestia os lo agradeceria mucho.

http://dl.dropbox.com/u/7462968/js.js

[masterpuppet]

Con delegate asignas un unico event handler para todo un set de elementos, cuando utilizas live asignas tantos event handlers como elementos tengas, por ejemplo en una lista donde tengas 12 li con live asignarias 12 event handlers a los que el browser debe atender, mientras que con delegate asignas un unico event handler a un padre de los li(cuanto mas cercano el padre mejor) podria ser el ul, cuando clickeas sobre un li el evento se propaga hacia arriba(bubble up!) hasta el ul este en ultima instancia lo maneja.
Otra razon para usar delegate sobre live, es que delegate utiliza por defecto los contextos de JQuery, con live escaneas el document, con delegate escaneas a partir del padre al que le estas asignando el handler, tomando como referencia el ejemplo anterior live buscaria en todo el document los li que coinciden, mientras que delegate buscaria los li a partir del padre, en nuestro ejemplo el ul.

Estos dos cambios deberian tener un cambio significativo en la performance de la aplicación.

Ahora voy a mirar bien tu codigo a ver que se puede optimizar, pero desde ya te digo que deberias cambiar estos:

Código Javascript:

id_wid=$(this).parent().parent().parent().parent().attr('id_widget')
 

por algo asi:

Código Javascript:

id_wid=$(this).parent('.selector').attr('id_widget')
 

Espero haber sido bastante claro.

Saludos.

[Dany_s]

12 li con live asignarias 12 event handlers

1 nomás que delega a la raiz del documento pero en la versión 1.4 se le puede indicar un contexto delegate.

no entiendo la diferencia entre delegate y live

Es sutíl y confusa pero con el fireQuery lo podés ver. Hace una cosa para ver estos ejemplo, bajate el plugin firebug y el firequery para ver a que elementos se le asigna eventos y de que tipo. Eso lo hice yo para ver que cosa hace porque tampoco encontré material en español y no entiendo inglés je

Entonces te muestro esto con el evento click:

Código HTML:

<html><head><script src="jquery.js"></script></head>
<body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
<script>
 
    $('li').click( function(){
        $(this).parent().append("<li>Li nuevo</li>");
    });
 
</script>
</body>
</html>
 

Fijate en la solapa html (del firebug) que cada li tiene un evento click.


Ahora lo mismo pero con delegate:

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
<script>
 
    $("ul").delegate("li", "click", function(){
        $(this).remove();
    });
 
</script>
</body>
</html>
 

Si miras el html ves que se le asigna un evento al ul, en realidad parece que son los li quien tiene los eventos pero se le delega al 'ul' como se le indicó y es ahi donde se ve si se hizo click en el selector que indicaste que puede ser un li con alguna clase o id o que contenga algún elemento etc

Con el evento click con pocos elementos no pasa nada pero si hay miles tiene que ir uno por uno para asignarle un evento pero con delegate no porque le asigna a un elemento pero este tiene que ver en que elemento se lanzó el evento y en el click no, asi que para uno o para lo otro cada uno tiene ventajas y desventajas jeje

Pero también está live
Live hace lo mismo que delegate (delegate usa a live) pero delegate mejora lo que hace live. Fijate en firequery ves que se le asigna un evento live

Por ejemplo
SI no le indicas un contxto lo hace en la raiz del documento, con esto no se ve que tiene asignado a los li ni al ul

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
<script>
 
    $('li').live('click', function(){
        $(this).remove();
    });
 
</script>
</body>
</html>
 

Pero en la versión 1.4 se le puede indicar un contexto

entonce esto es lo mismo que con delegate

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
<script>
 
    $('li', $('ul')[0]).live('click', function(){
        $(this).remove();
    });
 
</script>
</body>
</html>
 

pero que pasa si tenemos 2 listas, el anterior no va a funcionar porque le indicamos el primer ul como contexto

esto tampoco funciona para indicarle el contexto

Código Javascript:

$('li', 'ul').live('click', function(){
        $(this).remove();
    });
 

pero si esto

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
    <ul>
        <li>Uno2</li>
        <li>Dos2</li>
        <li>Tres2</li>
        <li>Cuatro2</li>
        <li>Cinco2</li>
    </ul>
<script>
 
    $('ul').each( function(){
        $('li', this).live('click', function(){
            $(this).remove();
        });
    });
 
</script>
</body>
</html>
 

que vendria a ser lo mismo que esto con delegate

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
    <ul>
        <li>Uno2</li>
        <li>Dos2</li>
        <li>Tres2</li>
        <li>Cuatro2</li>
        <li>Cinco2</li>
    </ul>
<script>
 
    $("ul").delegate("li", "click", function(){
        $(this).remove();
    });
 
</script>
</body>
</html>
 

Siempre en cada uno fijate con el firequery

Y también fijate las cantidad de llamadas y tiempo, lo podes ver usando la opción perfilar


ah y el encadenamiento no funciona con live

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <div>
        <ul>
            <li>Uno</li>
            <li>Dos</li>
            <li>Tres</li>
            <li>Cuatro</li>
            <li>Cinco</li>
        </ul>
    </div>
<script>
 
    $("div").children('ul').live('click', function(){
        $(this).remove();
    });
 
</script>
</body>
</html>
 

pero con delegate si

Código HTML:

<html><head><script src="jquery.js"></script>
</head><body>
    <div>
        <ul>
            <li>Uno</li>
            <li>Dos</li>
            <li>Tres</li>
            <li>Cuatro</li>
            <li>Cinco</li>
        </ul>
    </div>
<script>
 
    $("div").children('ul').delegate("li", "click", function(){
        $(this).remove();
    });
 
</script>
</body>
</html>
 

[leif_sk8er]

Madre!! esta información me viene muy pero que muy bien, como conclusion parece que delegate es lo mejor.

Tengouna duda en este codigo que as comentado:

Código Javascript:

<html><head><script src="jquery.js"></script>
</head><body>
    <ul>
        <li>Uno</li>
        <li>Dos</li>
        <li>Tres</li>
        <li>Cuatro</li>
        <li>Cinco</li>
    </ul>
    <ul>
        <li>Uno2</li>
        <li>Dos2</li>
        <li>Tres2</li>
        <li>Cuatro2</li>
        <li>Cinco2</li>
    </ul>
<script>
 
    $('ul').each( function(){
        $('li', this).live('click', function(){
            $(this).remove();
        });
    });
 
</script>
</body>
</html>
 

¿Dices que esto no valdria? o que seria muy lento y poco optimizado?

Código Javascript:

$('ul li').live('click', function(){
            $(this).remove();
        });
 

Esto si que actuaria sobre todos los li de los dos ul, ¿el problema es que no es optimo entonces tb no?



Masterpuppet la verdad es que si, no se por que hice esa tonteria...y el caso es que lo he hecho mal unas cuantas veces en ese mismo proceso. Corregido!

[Dany_s]

en vez de asiganar una cadena a una variable para seleccionar un id como
$("#"+idWid+"
podes guardar el elemento en una variable

widget = $('#'+eltextodelid);

asi accedes haciendo
widget.find('.algo .otro')
me parece mas legible je

que esto
$("#"+id_wid+" .selector .....



y no modifiques los estilos con jquery, modifica clases

porque esto

Código HTML:

<html>
    <head>
        <script src="jquery.js"></script>
    </head>
    <body>
        <div id="agregarEstilo1"></div>
        <div id="agregarEstilo2"></div>
    <button>Click</button>
<script>
    
$('button').click( function(){
    $('#agregarEstilo1').css({'margin':'10px', 'border':'1px solid #999', 'background':'green', 'cursor':'pointer'});
    $('#agregarEstilo2').css({'margin':'20px', 'border':'5px solid #ccc', 'background':'yellow', 'cursor':'help'});
});
 
</script>
</body>
</html>
 

no es lo mismo que esto

Código HTML:

<html>
    <head>
        <script src="jquery.js"></script>
        <style>
            .laClase{margin: 10px; border: 1px solid #999; background: green; cursor: pointer}
            .otraClase{margin: 20px; border: 5px solid #ccc; background: yellow; cursor: help}
        </style>
    </head>
    <body>
        <div id="agregarEstilo1"></div>
        <div id="agregarEstilo2"></div>
    <button>Click</button>
<script>
 
$('button').click( function(){
    $('#agregarEstilo1').addClass('laClase');
    $('#agregarEstilo2').addClass('otraClase');
});
 
</script>
</body>
</html>
 

fijate con el firebugs (en perfilar) las llamadas que hace cada uno y encima el último es más legible

[Dany_s]

Iniciado por leif_sk8er

Esto si que actuaria sobre todos los li de los dos ul, ¿el problema es que no es optimo entonces tb no?

si pero no le estas indicando un contexto

[leif_sk8er]

valla!!! que razon tienes con el tema de las clases y los contextos y lo de guardar el elemento en una variable! vamos, razon en todo je

Sobre todo por ejemplo en partes asi:

Código Javascript:

$(".videojuegos .crear_lista").live("click", function(){
    id_wid= $(this).parent().parent().parent().parent().attr("id_widget");  
    $("#"+id_wid+" .favoritos li div, #"+id_wid+" .favoritos_compartida li div").removeClass('activo'); // Quitamos la clase de activo en la lista de listas por si acaso
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .input_lista_nueva").val('');
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .form_lista_nueva").show();
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .boton_lista_nueva").hide();
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .input_lista_nueva").attr("disabled", false).focus();
    $("#"+id_wid+" .uispoty-left .todosBloques").scrollTop(10000);
    });
 

se puede mejorar mas esta parte cacheando variables y metiendolo en contexto con delegate!!
mañana me espera un gran dia... noche buena no, programacion :D


por cierto e estado leyendo antes un poquito, en ingles y me lio bastante, sobre evitar fugas de memoria y dicen que es muy bueno programar en base a clousures, me quedado KO :S, la conoceis esa forma de programar??

[Dany_s]

hay un libro de jquery que está también en español que habla de eso, se llama Aprende Jquery 1.3
tambien tiene ejemplo para ordenar una tabla, primero hacen una versión que funciona pero lento y luego otra que que es más rápida y explican porqué

podes leerlo jeje

[masterpuppet]

Gracias por la aclaración Dany_s al parecer reescribieron live para que funcione como un Delegator y delegate es un alias de live que te fuerza a utilizar los contextos,
creo que le han dejado el nombre live por compatibilidad.
leif_sk8er, te dejo una referencia y te hago una pregunta, porque no programar OOP el js ?, creo que por las caracteristicas de tu aplicacion ganarias mucho, un ejemplo para que quede mas grafico.

Código Javascript:

$(".videojuegos .crear_lista").live("click", function(){
    id_wid= $(this).parent().parent().parent().parent().attr("id_widget");  
    $("#"+id_wid+" .favoritos li div, #"+id_wid+" .favoritos_compartida li div").removeClass('activo'); // Quitamos la clase de activo en la lista de listas por si acaso
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .input_lista_nueva").val('');
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .form_lista_nueva").show();
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .boton_lista_nueva").hide();
    $("#"+id_wid+" .uispoty-left .bloqueSpoty .input_lista_nueva").attr("disabled", false).focus();
    $("#"+id_wid+" .uispoty-left .todosBloques").scrollTop(10000);
});
 

podria ser esto:

Código Javascript:

//Game Class, file jquery.classes.js
...
var Game = AbstractModel.extend({
   options: {
       scrollTop: 10000
   },   
   namespace: 'Game',
   loadFromDOM: function(dom){      
      this.container = $(dom);
      if(!!this.container.data(this.namespace)){
         return this.container(this.namespace);
      }
      this.input   = $(this.container.find('.input_lista_nueva')[0]) || false;
      this.form    = $(this.container.find('.form_lista_nueva')[0]) || false;
      this.button  = $(this.container.find('.boton_lista_nueva')[0]) || false;
      this.block   = $(this.container.find('.todosBloques')[0]) || false;    
      this.container.data(this.namespace, this);                
      return this;
   },
    cleanUp: function(){
       this.input.val('').attr('disabled', false).focus();       
       this.button.hide();
       this.button.show();
       this.block.scrollTop(this.options.scrollTop); 
       return this;
    }
});
 

Código Javascript:

//este seria tu actual js.js
//suponiendo que es un listado de juegos
$(".videojuegos").delegate('li', 'click', function(){
   var game = AbstractModel.factory('Game').loadFromDOM(this);
   game.cleanUp();
});
 

si bien puede ser un poco mas de código, la escalabilidad es superior, teniendo en cuenta el tipo de aplicación que estas desarrollando es algo a tener en cuenta, esto es una parte de un ejemplo mas grande que tengo si te interesa ya se a para aplicarlo o por simple curiosidad te lo puedo enviar, la verdad utilizo Mootools, esto es por diversión y me he quedado asombrado de lo que se puede hacer, no entiendo como es que hay tanto código spaguetti(esto es justamente lo que no me agrada de la libreria) con jQuery cuando se pueden hacer las cosas mucho mejor, otra cosita el ejemplo utiliza .data, un sistema de storage que tiene jQuery, ataca al DOM la primera vez que se hace click el resto de veces devuelve el objeto guardado, por mas que no te interese mi ejemplo deberias mirar .data.

Saludos.

[tredio]

oye a mi si me interesa tu ejemplo, si no te importa me lo podrias enviar, me parece interesante la forma en la que estas programando, podria aprender algo.

[leif_sk8er]

Muchas gracias masterpuppet, la verdad es que me he quedado un poco a cuadros con la programacion orientada a objetos, aun no se programar de esta forma.

He intentado adaptar el codigo js que puse en el mensaje 8, el enlace del nuevo es:
http://dl.dropbox.com/u/7462968/js2.js

Solo le he bajado 4 kb de peso, pero creo que al cachear elementos he ganado muchos milisegundos :D

La verdad que con lo que comentas, si me va a dar mejor estabilidad de codigo y rendimiento me gustaria practicar con este codigo y testear a ver si lo consigo hacer todo en base a POO.

Con el delegate solo he tenido un problema, y es que no actua exactamente como el live n el sentido de que por ejemplo si cargas un contenido nuevo dentro de un div (clase original), por ejemplo:

Código HTML:

<div class="original">
    <div class="nuevo"><ul><li>texto</li></ul></div>
</div>
 

no podemos decirle esto

Código Javascript:

$(".original").find("nuevo").delegate("ul li", "click", function(){
// algo
});
 

Es decir que falla si la estructura esa o los niveles hasta llegar a ese elemento no existe en el document ready. Creo que llegué a esa conclusion testeando ayer.


Voy a mirarme ahora lo del data storage a ver como es eso.

Entonces piensas que los memory leaks pueden estar causados por usar programacion simple? el POO lo evitaria?

Si puedes poner un enlace del fichero o ponerlo aqui para aprender perfecto :), a ver si me aprendo esta forma abstracta de hacer las cosas.

[masterpuppet]

Ya les envié el link para la descarga, delegate deberia funcionar con los elementos nuevos, al menos eso dice la doc de jQuery, ten en cuenta que para que funcione tu ejemplo el nodo con la clase "nuevo" debería existir en el ready.
Sobre si programar estilo OOP te va a salvar de los leaks, la respuesta es no, es muy fácil generar leaks, lo que si va a ser mas facil de mantener y seguramente de evitar los leaks. Te hago una par de preguntas, con todos los cambios que has echo, no hay cambios en el rendimiento ?, como lo estas testeando ?, seria interesante ir activando por secciones el javasacript para ver que partes generan los leaks(como no dispongo del html no puedo hacerlo).

Saludos.

[leif_sk8er]

Muchas gracias por el fichero!! No entiendo nada pero muchas gracias, voy a ver si consigo sacar algo en claro.

En cuanto a lo de como teesteo si mejora o no mejora con los cambios realizados realmente no tengo ninguna forma, he intentado con los tiempos que devuelve al perfilar el firebiug pero devuelve tantos tiempos que me es mucho jaleo realmente comrobar si mejora o no sin saber los totales.

Asi que lo hago con el meto mas inexacto y menos preciso que hay, a ojo. Realmente, aunque ya no se si es psicologicamente o que, parece que algo mejora, y en teoria almenos en tiempos de respuesta algo ha mejorado por que cacheo al principio de la funcion o el evento sin tener que hacer la busqueda cada vez.... con lo que en teoria eso tiene que haber mejorado. Y en espacio en disco tb, 4 Kb xD

Ahora el problema de los memory leaks.... ya no se... tb es cierto que el mayor problema que tengo, al ser una plataforma que juega mucho con las capas flotantes, los draggables y demas, son a la hora de arrastrar una ventana, que va a trompicones, de ahi deducí que el problema podria ser que estubiese recargado, y ahora va un poco mas fluido, pero aun asi en widgets complejos (con muchas imagenes o trasparencias) se hace lento.... igual el truco ahi es en vez de mover la ventana en si es mover un div que se posiciona en ese punto y el otro lo pone en top:-1000 y luego segun donde sueltes pòne el otro div... no se, este será el segundo paso de optimizar.

Por cierto, crees que deberia poner todas las variables a null en el final de los eventos y funciones?? O automaticamente se liberará su memoria al no ser globales?

Creo que subiré lo que llevo hecho, algo basico para que le heches un vistazo y entiendas un poco mejor a que me refiero con todo esto, te mando un privado en cuanto esté si quieres.

[masterpuppet]

Te dejo una referencia de testeo, es a mano..., en realidad el "cacheo" es relativo, ten en cuenta que cada vez que haces click se ejecuta todo el proceso de nuevo, lo que en vez de hacer un traverse del DOM completo lo hace a partir de un elemento X, para no ejecutar el mismo proceso en cada click deberias usar como te comente antes .data el sistema de storage de jQuery y guardar los elementos, ahi si harias el traverse del DOM el primer click, los siquientes devolverian el/los objeto/s del storage.

El tema del peso, no estas utlizando gzip o deflate ?, el core de Mootools pesa unos 140kb, si lo comprimo con YUI y utilizo gzip queda en unos 25kb.

Al sistema, "pesado" lo vas a sentir, no probaste algún otro webos, eyeos, seguramente lo conozcas, es pesado tambien, por la cantidad de js, que por cierto utilizan qooxdoo, no se cuanto js tenes desarrollado pero deberias plantearte el cambio de FW, jQuery es bueno para el traverse del DOM y aplicar algunos efectos pero para un webos se queda corto.

Cuando puedas subi algo y mandame el privado que me parece muy interesante el tema.

Saludos.

[leif_sk8er]

Muchas gracias por el enlace, ahora luego lo miraré que son las 12 de la mañana y aun no he dormido.

En la campus party de este verano estuve hablando con los de EyeOs, por que presenté la propuesta en lo de campuseros presentan y estuve enseñandole todo a uno de los cracks de la programacion de EyeOs ahi. La verdad es que se parece en algunos conceptos, solo que lo suyo es un SO con aplicaciones de trabajo y trabjo en grupo y lo que yo quiero tengo hecho es una red social para el ocio 100%.

La verdad es que tengo bastante hecho, llevo unos 5 meses duros dandole (aunque como siempre lo que mas se tarda es en hacer esquemas y saber como organizar todo y que funcione lo mejor posible), pero el de eyeOs tb me recomendó lo mismo, usar qooxdoo para aplicaciones tipo webos. Si una vez lo veas me lo recomiendas 100% y que mejoraria mucho el rendimiento tendré que darle caña a qooxdoo :D

Lo dicho, te mantengo informado.

[Dany_s]

y el JSLitmus http://broofa.com/Tools/JSLitmus/ alguien sabe como funciona?
si por ejemplo accediendo a un elemento por id y en otra prueba accedo al mismo elemento pero por otro selector se supone que el que tiene menor amarillo o menos operaciones por segundos es el mas rápido?

no entiendo como funciona si se llama la misma cantidad de veces a la función, si muestra la operaciones que se realiza en cada función o que hace jeje

simpre veo que hacen prubas con esa herramienta

leif_sk8er tenes tu sistema online? como para chusmear jeje


no conocia qooxdoo, y sencha que tal va?

[leif_sk8er]

Ufff no conocia eso de Sencha, parece muy muy bueno tb! La verdad es que se me ha hecho la boca agua con ese framework, aunque no se si es un framewrok en si como puede ser JQuery o Mootools, pienso que si. Es Ext 3 este producto? o es un producto basado en Ext 3? creia que ext3 era software libre, o no se por que tenia eso en la mente. O es que lo q ellos ofrecen es algo como un dreamweaver que usa Ext 3 JS??

Tampoco conocia el JS Litmus, segun he leido consiste en poner la funcion que deseas y te testea su rendimiento cierto?

Ok Dany_s, te mando a ti tb un privado con la url cuando lo suba. Intentaré no tardar mas de una semana, que quiero terminar algo antes.

[masterpuppet]

Ext JS es una gran libreria, basta con ver el demo(por cierto muy buen echo, te dan ganas de utilizarla en el momento que lo ves), tiene adapters para integrar con otros FW's(Prototype, jQuery), el tema es el boton de BUY NOW!, si tu proyecto es Open Source no vas a tener problema en usarla ahora si es cerrado..., tenes que ir mirando precios .

[leif_sk8er]

Lo del buy now te refieres al Ext JS no?

Hombre mi idea era hacerlo de alguna forma abierto, tengo que pensar bien esto, pero era una idea ya que todo lo he conseguido de la comunidad open source.

Por cierto acabo de solucionar uno de los problemas que tenia de rendimiento, aunque en verdad no era problema de JS, sino que al hacer el dragable de una ventana movia el widget en si, y ahora lo que hago es mover una ventana, con la opcion helper de jquery ui, y modificando un poco lo pondré como en eyeos y otros webos para que sea fuido el dragable.

Vale, como opciones entonces para aplicacion tipo webos tenemos Ext JS y qooxdoo, empieza la batalla mental de si me mudo a qual mudarme....

[masterpuppet]

leif_sk8er, te dejo una referencia, y deberias prestar especial atención a este post, y con lo del buy now si me refiero a Ext JS, que dependiendo de como sea tu proyecto tenes que comprar licencia o no, es algo a tener en cuenta.
Y tengo un par de preguntas(es lo que tiene la curiosidad), sobre que estas lenguaje trabajando ? PHP ?, si es asi que FW estas utilizando ? o te lo curraste todo ?

Saludos.

[leif_sk8er]

Bueno, primero feliz año a todos, este va a ser un gran año de programación y aprendizaje!! y esperemos que se convierta en proyectos :)

Claro, puedes preguntar lo que quieras, aun no he subido el proyecto para que lo veas, ya que mi internet ultimamente va fatal, y para que veas el potencial tengo que subir unas cosas que ocupan 2 gigas xD, ya veras.

Es todo PHP a mano, es decir sin FW, ya se que puede ser un error, pero me daba mas libertad en principio. Asi que si, todo currado desde cero, usando algunos plugins ya hechos de jquery claro como la UI y alguno qhe me ha venido bien. Aunque puede que tenga que pasarse a algun framework tb de PHP y incluso con OOP como tu hicistes con el JS.

Es una red social con paneles deslizantes y intedrtacion de widgets de lo wapo de internet, por ejemplo hice un "Spotify cutre" que quedó guapisimo, un centro de videojuegos con un par de miles de juegos, y una tele a la carta muy chula tb, o almenos eso me lo parece a mi jajajajj, no soy el mas apropiado para valorar :P, todo ello con integracion social y en escritorios infinitos. A ver si se me pone el internet normal y subo todo en una noche. Por que tb me vendria muy bien para ir testeando en otros ordenadores y medios rollo ipad en el mediamarkt y demas.


Pedazo post el de comparativas!! muchos pros y contras al detalle, al final me he quedado un poco igual pero parece que qooxdoo gana, es mas los de eyeOs son unos cracks y me dijeron que ellos lo usan por que es el mejor que han encontrado, y los que estan ahi controlan mucho, seguramente sea un buen ejemplo y tomar en cuenta esta consideracion. El unico problema, y como me comentaron tb, es que aprender qooxdoo estando solo en programacion, diseño y demas, podria ser relentizar, que intentase sacar algo estable y funcional lo antes posible con jquery que era lo que sabia y que enseguida una vez online a saco con el qooxdoo y con OOP a poder ser.

La verdad es que me gusta tb esta idea por todo lo que ya llevo hecho jajajajj