PHP - Navegador se relentiza con muchos divs

   
Vista:
Imágen de perfil de Jordi

Navegador se relentiza con muchos divs

Publicado por Jordi (10 intervenciones) el 20/07/2017 20:02:20
Hola, primero de todo pido perdón por si esta mal situado este post, pero no sabia en que categoría ponerlo.

Tengo un problema con una pagina, que hace una consulta a una BD y con un bucle va generando unos divs.

No se si podría optimizar un poco el código, o tengo algún fallo en algún sitio que no veo... Antes funcionaba perfectamente pero ahora el bucle ya genera mas de 3000 resultados y se empieza a colgar el navegador. Que podría hacer?

Dejo el código aquí:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<?php
//Consulta que nos devuelve todos los proyectos de la tabla
$projectes = mysql_query("SELECT * FROM projectes WHERE ref LIKE '%".$paraula."%' AND actiu = ".$actiu."
							OR client LIKE '%".$paraula."%' AND actiu = ".$actiu."
							OR descripcio LIKE '%".$paraula."%' AND actiu = ".$actiu."
							OR codiPeca LIKE '%".$paraula."%' AND actiu = ".$actiu."
							OR numPeces LIKE '%".$paraula."%' AND actiu = ".$actiu."
							OR abn LIKE '%".$paraula."%' AND actiu = ".$actiu." ORDER BY ref DESC");

//Bucle para recorrer todos los proyectos
while($projecte = mysql_fetch_array($projectes)) { 
	$descripcio = $projecte['descripcio'];
?>
<div class="etiquetes" etiqueta="<?= $descripcio ?>">
	<div class="projecte" >
		<div class="projNom">
			&nbsp;&nbsp;- Ref: <?= $projecte['ref'] ?><br>
            &nbsp;&nbsp;- <?= $projecte['client'] ?>
		</div>
        <div class="projPiezas">
        	- Cant: <?= $projecte['numPeces'] ?>
		</div>
		
		<div class="projEntrar" style="background-image:url(img/projectes/<?= $projecte['foto'] ?>);font-size:13px;">
        	<?php
				if($projecte['foto'] == ".jpg"){
					echo $projecte['descripcio'];
					}
			?>
		</div>
		<div class="projOk">
			<?php
				if($actiu != 2 & $actiu != 3){
					if($projecte['ok'] == 1){
						echo "<img src='img/icons/okVerd.png' width='60' height='60' />";
						}
					}
			?>
		</div>
        <div class="projTick">
			<?php
				if($actiu == 0){
					if($projecte['tick'] == 1){
						echo "<img src='img/icons/tickVerd.png' width='60' height='60' />";
						}
					}
			?>
		</div>
        <div class="projTractament">
			<?php
				if($actiu == 1){
					if($projecte['tractament'] == 1){
						echo "<img src='img/icons/tratVerd.png' width='60' height='60' />";
						}
					}
			?>
		</div>
        <div class="projTaller">
			<?php
				if($actiu == 1){
					if($projecte['taller'] == 1){
						echo "<img src='img/icons/tallerVerd.png' width='60' height='60' />";
						}
					}
			?>
		</div>
	</div>
</div>
<?php	
}
?>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

Navegador se relentiza con muchos divs

Publicado por Pablo (25 intervenciones) el 20/07/2017 21:18:47
Estoy en el movil y es complicado verlo pero si cargas 3000 resultados en una misma pagina es logico q se cuelgue. Paginalo con x resultados por pagina
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de kip

Navegador se relentiza con muchos divs

Publicado por kip (863 intervenciones) el 20/07/2017 22:01:24
Hola, el problema es la cantidad de datos que traes, lo que te recomiendo es que hagas un paginado o cargues los datos en los divs desde codigo javascript haciendo una consulta AJAX, para que de esa forma el navegador no se cuelgue tanto como lo esta haciendo ahora.

Ademas creo que deberías optar por un paginado casi obligatoriamente, pues tener mas de 1000 elementos en el navegador no suena bien con respecto a la navegación, habría que bajar mucho el scroll y eso no viene nada bien para el usuario.

Puedes tambien usar javascript para hacer una consulta de datos con AJAX al servidor cada vez que el usuario llegue al final de la pagina, lo que se conoce como 'infinite scroll', por si no deseas usar el paginado.

Este es un ejemplo con datos estaticos:
http://www.lawebdelprogramador.com/codigo/JQuery/2626-Ejemplo-de-carga-del-contenido-de-la-pagina-a-medida-que-baja-el-scroll-del-navegador.html

Aqui un enlace que quizas te interese:
http://www.gitmedio.com/gitmedio/paginacion-con-scroll-infinito-en-php-mysql-y-jquery/
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar
Imágen de perfil de Jordi

Navegador se relentiza con muchos divs

Publicado por Jordi (10 intervenciones) el 21/07/2017 17:40:45
Gracias. Estoy probandolo. Con estatico funciona sin ningun problema, ahora tengo el problema con mis datos que vienen de una consulta mysql. A ver si puedo solucionarlo yo solo. Si no ya volvere a pedir ayuda.

Muchas gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Revisar política de publicidad