Tips para una redenderización rápida en Internet Explorer.

Iniciado por WHK, 12 Enero 2012, 18:50 PM

0 Miembros y 1 Visitante están viendo este tema.

WHK

Hay algunas cosas que funcionan bién y otras que en internet explorer andan mal.

Estaba haciendo un bloque con varios tabs y dentro de cáda tab varios checkboxes con sus textos y al pasar el mouse sobre la pestaña se veia el tab.

Todo andaba de lujo hasta que decido probar en internet explorer 8, se veia horrendamente lento, cáda ves que pasaba el mouse sobre una pestaña se demoraba como un segundo o mas en mostrar el contenido, asi que cuando pasaba el mouse sobre todas las pestañas con suerte se veian dos. el retraso era muy grande pero por suerte lo arreglé y obtube el mismo resultado con mayor rapidez solo cambiando un par de lineas.

TIP:
Internet explorer es horrendo para redenderizar, por eso lo que yo hacia era escribir el html de cáda tab y luego con jquery mostrar y ocultar el tab con show() hide(), supongo que en firefox y chrome cuando un objeto no está visible no lo redenderiza o no se como lo hará pero la cosa es que internet explorer se estaba frizando por los cientos de checkboxes totales que habian escritos, unos ocultos y otros visibles, al final solo 10 o menos se veian pero el resto estaban ocultos.

Para solucionar esto cargué cáda contenido del html en una variable de javascript de esta manera:
Código (php) [Seleccionar]
<?php
$buffer 
'';
foreach(
$filters as $filter){
 
ob_start();
?>

<div>
<div><?php echo $this->str->toHtml($filter['filter_text']); ?></div>
<div><input type="text" value="Buscar ..." /></div>
<div>
<?php foreach($filter['data'] as $value){ ?>
<div>
<label>
<input type="checkbox" />
<span><?php echo strtolower($this->str->toHtml($value['nombre'])); ?></span>
</label>
</div>
<?php ?>
</div>
</div>
<?php
 $buffer 
.= "search['".$filter['prefix']."'] = '".str_replace(array('%','+'), array('\\x'' '), urlencode(ob_get_contents()))."';
 "
;
 
ob_end_clean();
}
echo 
'
 <script type="text/javascript">
  var search = new Array();
  '
.$buffer.'
 </script>
'
;
unset(
$buffer);
?>


De esta forma tengo un array llamado "search" con el contenido de cáda bloque y en ves de hacerle show() hide() le hago un $('.contenido').html(search[item]) haciendo que cáda ves que quiera aparecer un bloque sobreescriba el que estaba antes evitando la sobrecarga de inputs.



Lo comento porque se que es una mala costumbre que muchos tenemos y teniamos al momento de escribir directamente en el html cientos de objetos cuando realmente solo se verán unos pocos y podremos ahorrarnos muchos megas de memoria en internet explorer.

Alguien le gustaría compartir mas tips para hacer que internet explorer funcione rápido y eficiente sin la necesidad de cambiar el layout o diseño de algo sino simplemente modificando el código?

Saludos :D