jQuery UI de diálogo lenta

he publicó recientemente en un poco de dolor. He estado usando el cuadro de diálogo JQuery para mostrar algunas pantallas de configuración en una aplicación web. Nada muy especial. Sin embargo, tengo un par de casos extremos donde este formulario de configuración mostrará un menú desplegable de algunas ... 11000 opciones. [DOGOS ROTTEN TOMATES]jQuery UI de diálogo lenta

No hace falta decir que es lento. El JQuery Dialog puede tardar hasta 9 segundos en mostrarse (y el inicio también es lento).

La primera pregunta es: ¿hay alguna manera de acelerar los cuadros de diálogo? Por lo que parece, copia todo el contenido cada vez que se abre. Si hubiera una manera de evitar eso, ayudaría un poco.

Segunda pregunta: ¿Hay algún otro cuadro de diálogo jQuery que tenga un mejor rendimiento cuando se le pide que muestre grandes cantidades de datos?

Y como siempre, otras soluciones son bienvenidas. Algún autocompletar ajax no sería malo, pero probablemente aún sea lento a menos que requiera al menos un par de caracteres iniciales.

Fuente

2010-07-13 Buddy Lee

Hombre, eso es una lista desplegable de looooong. Incluso si puede resolver su problema técnico, le sugiero que use un control diferente, tal vez una lista filtrada o algún tipo de navegador de datos. Dependiendo del contenido de datos. – Tx3

logrado mejorar el rendimiento un poco. Me alejé de la interfaz de usuario de JQuery y creé una versión mucho más ligera. En lugar de copiar los contenidos de mi objetivo en mi diálogo, construyo mi diálogo alrededor del contenido.

En cuanto al rendimiento, el diálogo fue de aproximadamente 10 segundos a 2.

Fuente

2010-07-23 21:23:05

¿Qué tal uno selecciona con todas las primeras letras posibles obteniendo a través de AJAX solo las opciones que comienzan con esa letra en la segunda selección?

Fuente

2010-07-14 00:30:58 Jan

2 segundos suena mucho mejor, pero probablemente encontrará que es muy dependiente tanto en el navegador del usuario y el sistema de configuración - que podría ser mucho peor en un sistema más lento en IE ...

Consideraría seriamente utilizar algo más en lugar del menú desplegable de mamut (que seguramente no puede ser muy fácil de usar) - parece un buen candidato para un cuadro de búsqueda de autocompletar, o quizás desplegables en cascada de varios niveles.

También puede crear el diálogo cuando se carga la página, y sólo se abren cuando sea necesario (establecido Autoopen: falsa en las opciones)

Fuente

2010-09-10 06:55:12

Si tiene que hacer un menú desplegable en un cuadro de diálogo de esa manera, entonces yo sugerir cargar la información en un estilo div ajax oculto después de carga de la página y luego mostrar que div oculto en cualquier caja de luz/de diálogo que está utilizando cuando es necesario. De esa forma, las cosas se cargarán mientras el usuario está haciendo otras cosas, y con suerte estarán listas para cuando lleguen.

Fuente

2010-09-14 20:56:33

Esa sería una buena solución para la carga inicial. Aunque la carga no fue influenciada demasiado horrible. El problema llegó cuando llegó el momento de que IE renderizara el menú desplegable. Inicialmente, el div es invisible y todo va bien. El mayor problema fue que el cuadro de diálogo de la interfaz de usuario de JQuery tuvo que copiar toda esa información en el DOM para moverlo a sus contenedores personalizados. También lo hizo cada vez que se cargó el cuadro de diálogo. El nuevo diálogo ahora envuelve los datos existentes en lugar de copiarlos. Esto pareció acelerar un poco las cosas. Luchó con el lavado semi transparente, pero ahora funciona bastante bien. –

Me alegra que esté funcionando un poco mejor. –

dependiendo de qué html esté utilizando para mostrar los datos, es decir, puede ser super lento frente a Chrome o Firefox.

especialmente cuando se esté viendo grandes mesas. estos enlaces pueden ser útiles; incluso podría perder un poco más de tiempo.

http://jquery-howto.blogspot.com/2009/02/5-easy-tips-on-how-to-improve-code.html

http://www.artzstudio.com/2009/04/jquery-performance-rules/

Fuente

2011-02-05 20:19:19 Michael

tengo frente a este problema y ha encontrado la solución aquí: http://forum.jquery.com/topic/select-in-dialog-causes-slowness-in-ie8

sólo tenía que establecer el diálogo de draggable y resizable opciones para false.

Fuente

2012-03-02 23:07:42 marcolino

Me encontré con su respuesta mientras luchaba con el mismo problema. ¡Trabajado como un encanto! –

Guau, qué co-incidencia extraña. Estoy teniendo este mismo problema otra vez más de un año después en una caja que ejecuta IE 10 y encontré que el tamaño y la capacidad de arrastre parecen no tener un impacto discernible en la lentitud. –

Configuración pueden arrastrarse y de tamaño variable a falso trabajados.

Fuente

2012-11-05 16:53:08

Tengo un problema similar (pero sin el menú desplegable gigantesco) y la configuración de arrastrar y cambiar el tamaño a falso no funcionó para mí. –

Acabo de toparme con este problema usando un cuadro de diálogo con pestañas con cientos de casillas de verificación. Encontré this link para ser muy útil. Tomó 17 segundos para abrir el cuadro de diálogo antes, pero ahora está a 1,3s aproximadamente. (estoy usando un diálogo de tamaño variable no se puede arrastrar)

El truco consiste en separar el código HTML antes de abrir el cuadro de diálogo, y luego usar la función abierta para el diálogo para volver a fijar el contenido.

$('#triggerDialogFast').click(function() { 
    var $dialogContainer = $('#dialogContentFast'); 
    var $detachedChildren = $dialogContainer.children().detach(); 
    $dialogContainer.dialog({ 
     width: 425, 
     height: 400, 
     draggable: false, 
     resizable: false, 
     open: function() { 
      $detachedChildren.appendTo($dialogContainer); 
     }, 
    }); 
});

no estoy seguro, pero probablemente debería funcionar con sólo conectar el html en la función abierta si es posible en su escenario.

Fuente

2015-03-17 09:16:46 Binke

Respuesta

Cuestiones relacionadas