Foros del Web » Programando para Internet » PHP »

Como optimizar página de tienda

Estas en el tema de Como optimizar página de tienda en el foro de PHP en Foros del Web. Hola, buenas tardes Tengo una duda con optimizar una página, que muestra n cantidad de productos. La consulta la hago por medio de PHP y ...
  #1 (permalink)  
Antiguo 30/03/2017, 13:04
Avatar de Middrel  
Fecha de Ingreso: abril-2005
Mensajes: 835
Antigüedad: 19 años, 6 meses
Puntos: 27
Como optimizar página de tienda

Hola, buenas tardes

Tengo una duda con optimizar una página, que muestra n cantidad de productos. La consulta la hago por medio de PHP y luego la imprimo en pantalla usando jQuery Datatables.

Todo funciona bien, pero no sé si tarda mucho por que son muchos artículos (revistas) que se muestran (arriba de 3000 y creciendo), por mi consulta en PHP o por el plugin de jQuery Datatables.

Tengo filtros para que dependiendo del tema, la editorial, el idioma, etc., se muestre menos información, pero cuando el cliente seleccione "Todo", saldrán las 3000+ revistas registradas.

Lo que quiero es que no tarde mucho, ya que se toma al rededor de 27 segundos en procesarla.

Mi consulta en PHP es la siguiente:

Código PHP:
if(isset($_GET['lang'])){
        
        if(!empty(
$_GET['tema'])){ $argumento01 ' and rev_tema =' $_GET['tema']; }
        if(!empty(
$_GET['editorial'])){ $argumento02 ' and rev_editorial =' $_GET['editorial']; }        
        
        switch(
$language){
            
            case 
'mx'$option 'Español'; break;
            case 
'fr'$option 'Francés'; break;
            case 
'ale'$option 'Alemán'; break;
            case 
'ita'$option 'Italiano'; break;
            case 
'eng'$option 'Inglés'; break;                                                            
            case 
'esp'$option 'Español'; break;                                                                        
        }
        
        
// Mostramos registros de acuerdo a la página actual
        
$sqlSelectRevistasxIdioma mysqli_query($conn"Select id_revista, rev_issn, rev_titulo, rev_tema, rev_subtema, rev_editorial, rev_distribuidor, rev_ejemplares_ano, rev_ejemplares_ano_online, rev_clase_venta, rev_tipo_venta, rev_costo, rev_costo_online, rev_costo_digital, rev_costo_paquete, rev_pais, rev_idioma, rev_fecha_alta, rev_fecha_modificacion, rev_grupo, rev_estatus, rev_imagen, rev_observaciones, rev_idioma_original, rev_idioma_otros, edit_editorial, tem_tema from cat_revistas Left Join cat_temas On(id_tema = rev_tema) Left Join cat_editorial On(id_editorial = rev_editorial) Where rev_idioma = '" $option "' and rev_estatus = 1 " $argumento01 " " $argumento02 " Order by rev_fecha_modificacion DESC");
        
    } else {
        
        
$sqlSelectRevistasxIdioma mysqli_query($conn"Select id_revista, rev_issn, rev_titulo, rev_tema, rev_subtema, rev_editorial, rev_distribuidor, rev_ejemplares_ano, rev_ejemplares_ano_online, rev_clase_venta, rev_tipo_venta, rev_costo, rev_costo_online, rev_costo_digital, rev_costo_paquete, rev_pais, rev_idioma, rev_fecha_alta, rev_fecha_modificacion, rev_grupo, rev_estatus, rev_imagen, rev_observaciones, rev_idioma_original, rev_idioma_otros, edit_editorial, tem_tema from cat_revistas Left Join cat_temas On(id_tema = rev_tema) Left Join cat_editorial On(id_editorial = rev_editorial) Where rev_estatus = 1 " $argumento01 " " $argumento02 " Order by rev_fecha_modificacion DESC");        
        
    } 
y la mostramos en pantalla con jQueryDatables:

Código Javascript:
Ver original
  1. $('#datatable').DataTable({
  2.             "language": {
  3.                 "lengthMenu": "",
  4.                 "zeroRecords": "No se encontraron registros.",
  5.                 "info": "Mostrando página _PAGE_ de _PAGES_",
  6.                 "infoEmpty": "No se encontraron coincidencias.",
  7.                 "infoFiltered": "(filtrado de _MAX_ del total de los registros)",
  8.                 "search":         "",
  9.                 "searchPlaceholder": "Busca por título, tema, editorial o cualquier palabra clave...",
  10.                 "paginate": {
  11.                     "first":      "Inicio",
  12.                     "last":       "Último",
  13.                     "next":       "Siguiente",
  14.                     "previous":   "Anterior"
  15.                 }          
  16.             }
  17.         });

cuando imprimo en la página, mi tabla hace algunos cálculos para convertir algunos precios en peso mexicano, ya que algunas revistas están en euros y dólar.

Entonces, no se si sea conveniente usar otro tipo de consultas para acelerar la carga o debo modificar mi html... ¿qué me recomiendan?

De antemano, les agradezco sus comentarios.

Saludos!!
  #2 (permalink)  
Antiguo 30/03/2017, 13:05
Avatar de Middrel  
Fecha de Ingreso: abril-2005
Mensajes: 835
Antigüedad: 19 años, 6 meses
Puntos: 27
Respuesta: Como optimizar página de tienda

Este es mi html para mostrar las revistas (lo puse aparte porque no me dejo el post principal pegar más de 10000 caracteres xDD):

Código HTML:
Ver original
  1. <table id="datatable" class="hover">
  2.         <thead>
  3.             <tr>
  4.                 <th align="left">ORDENAR POR TÍTULO</th>
  5.             </tr>
  6.         </thead>
  7.         <tbody>
  8.     <?php
  9.         require("bd/querys/query-search-language.php");
  10.        
  11.         while($rowSelectRevistasxIdioma = mysqli_fetch_assoc($sqlSelectRevistasxIdioma)){
  12.     ?>
  13.     <tr>
  14.     <td width="80%" style="border-bottom:1px solid #ccc;">
  15.         <?php
  16.             // Selección de ícono para el tipo de venta
  17.            if($rowSelectRevistasxIdioma['rev_tipo_venta'] == 'impreso' or $rowSelectRevistasxIdioma['rev_tipo_venta'] == ''){
  18.                 $icon = 'icon-book-open';
  19.                 $grupo = $rowSelectRevistasxIdioma['rev_grupo'];
  20.                
  21.                 if($grupo == 'Mexico'){ $costo = $rowSelectRevistasxIdioma['rev_costo']; }
  22.                 elseif($grupo == 'Houston'){ $costo = $rowSelectRevistasxIdioma['rev_costo'] * $Usd; }
  23.                 elseif($grupo == 'Paris' or $grupo == 'Madrid' or $grupo == 'Europa'){ $costo = $rowSelectRevistasxIdioma['rev_costo'] * $Eur; }
  24.                
  25.            } elseif($rowSelectRevistasxIdioma['rev_tipo_venta'] == 'digital'){
  26.                $icon = 'icon-cd';
  27.                
  28.                 if($grupo == 'Mexico'){ $costo = $rowSelectRevistasxIdioma['rev_costo_digital']; }
  29.                 elseif($grupo == 'Houston'){ $costo = $rowSelectRevistasxIdioma['rev_costo_digital'] * $Usd; }
  30.                 elseif($grupo == 'Paris' or $grupo == 'Madrid' or $grupo == 'Europa'){ $costo = $rowSelectRevistasxIdioma['rev_costo_digital'] * $Eur; }               
  31.                        
  32.             } elseif($rowSelectRevistasxIdioma['rev_tipo_venta'] == 'online'){
  33.                $icon = 'icon-globe';
  34.  
  35.                 if($grupo == 'Mexico'){ $costo = $rowSelectRevistasxIdioma['rev_costo_online']; }
  36.                 elseif($grupo == 'Houston'){ $costo = $rowSelectRevistasxIdioma['rev_costo_online'] * $Usd; }
  37.                 elseif($grupo == 'Paris' or $grupo == 'Madrid' or $grupo == 'Europa'){ $costo = $rowSelectRevistasxIdioma['rev_costo_online'] * $Eur; }                            
  38.  
  39.            } else{
  40.                $icon = 'icon-cubes';
  41.                
  42.                 if($grupo == 'Mexico'){ $costo = $rowSelectRevistasxIdioma['rev_costo_paquete']; }
  43.                 elseif($grupo == 'Houston'){ $costo = $rowSelectRevistasxIdioma['rev_costo_paquete'] * $Usd; }
  44.                 elseif($grupo == 'Paris' or $grupo == 'Madrid' or $grupo == 'Europa'){ $costo = $rowSelectRevistasxIdioma['rev_costo_paquete'] * $Eur; }                                               
  45.             }
  46.         ?>
  47.     <div class="product-description" data-name="<?php echo $rowSelectRevistasxIdioma['rev_titulo']; ?>" data-price="<?php echo $costo; ?>">    
  48.     <div class="article">
  49.         <div class="article-left">
  50.             <ul class="caption-style-1">  
  51.                 <li>
  52.                     <?php if(empty($rowSelectRevistasxIdioma['rev_imagen']) or strlen($rowSelectRevistasxIdioma['rev_imagen']) < 4 or strlen($rowSelectRevistasxIdioma['rev_imagen']) >= 30){ ?>
  53.                     <div class="border-fail"><div class="img-fail"><p class="label-img-fail">Imagen por <br />actualizar</p></div></div>
  54.                     <?php } else { ?>
  55.                     <a href="revista.php?key="><img src="img/imagenes/revistas actualizadas/<?php echo $rowSelectRevistasxIdioma['rev_imagen']; ?>" alt="" class="adaptive-img-product" /></a>
  56.                     <?php } ?>
  57.                     <div class="caption">
  58.                         <div class="blur"></div>
  59.                         <div class="caption-text">
  60.                             <a href="revista.php?key=<?php echo $rowSelectRevistasxIdioma['id_revista']; ?>" style="color:#fff"><span class="icon icon-eye"></span></a>
  61.                         </div>
  62.                     </div>
  63.                 </li>                
  64.             </ul>        
  65.         </div>
  66.         <div class="article-right">
  67.             <div class="article-right-left">
  68.                 <a href="revista.php?key=<?php echo $rowSelectRevistasxIdioma['id_revista']; ?>" class="links-paginas">
  69.                     <h1 style="color:#005ca9;" class="product-name">
  70.                         <?php echo $rowSelectRevistasxIdioma['rev_titulo']; ?>
  71.                     </h1>
  72.                     <h1 style="color:#005ca9;" class="product-name">
  73.                         <span class="<?php echo $icon; ?>"><?php echo $rowSelectRevistasxIdioma['rev_tipo_venta']; ?></span>
  74.                     </h1>
  75.                 </a>
  76.                 <div class="line-under-title"></div>
  77.                 <a href="<?php echo $_SERVER['REQUEST_URI'] . '&editorial=' . $rowSelectRevistasxIdioma['rev_editorial']; ?>" class="link-article">
  78.                     <span class="icon-article icon-bookmark-empty"><?php echo $rowSelectRevistasxIdioma['edit_editorial']; ?></span>
  79.                 </a>
  80.                 <a href="" class="link-article"><span class="icon-article icon-flag-empty"><?php echo $rowSelectRevistasxIdioma['rev_idioma']; ?></span></a>
  81.                 <a href="<?php echo $_SERVER['REQUEST_URI'] . '&tema=' . $rowSelectRevistasxIdioma['rev_tema']; ?>" class="link-article">
  82.                     <span class="icon-article icon-tag" style="color:#2a2a2a"><?php echo $rowSelectRevistasxIdioma['tem_tema']; ?></span>
  83.                 </a>                
  84.                 <div class="text-descript">
  85.                     <?php
  86.                        
  87.                        $longitud_texto = strlen($rowSelectRevistasxIdioma['rev_idioma_original']);
  88.                        
  89.                        if($rowSelectRevistasxIdioma['rev_idioma_original'] == 'Descripción en idioma original' or $rowSelectRevistasxIdioma['rev_idioma_original'] == ''){
  90.                            
  91.                            $descripcion = 'Información por actualizar.';
  92.                        } else {
  93.                            
  94.                            $descripcion = $rowSelectRevistasxIdioma['rev_idioma_original'];
  95.                        }
  96.                        
  97.                        if($longitud_texto < 280){
  98.                        
  99.                            echo substr($descripcion, 0, 280);
  100.                        } else {
  101.                            echo substr($descripcion, 0, 280) . '...';
  102.                        }
  103.                    ?>
  104.                 </div>
  105.             </div>
  106.         </div>
  107.     </div>
  108.     <div class="article-right-right">
  109.         <div class="price"><?php echo 'Costo por Suscripción <p class="product-price"> $' . number_format($costo, 2, '.', ',') . '</p>'; ?></div>                        
  110.             <span class="icon-calendar"></span>
  111.                 <?php
  112.                     if($rowSelectRevistasxIdioma['rev_ejemplares_online'] == 0){
  113.                        
  114.                         $ejemplares = $rowSelectRevistasxIdioma['rev_ejemplares_ano'];
  115.                     } else {
  116.                         $ejemplares = $rowSelectRevistasxIdioma['rev_ejemplares_ano_online'];
  117.                     }
  118.                        
  119.                     if($rowSelectRevistasxIdioma['rev_tipo_venta'] == 'online'){
  120.                         echo $ejemplares . ' ejemplares al año.';
  121.  
  122.                     } else {
  123.                         echo $rowSelectRevistasxIdioma['rev_ejemplares_ano'] . ' ejemplares al año.';                          
  124.                     }
  125.                 ?>
  126.         </div>
  127.         <div style="height:15px; width:30%; float:left;"></div>
  128.             <form class="add-to-cart" action="carrito.php" method="post">
  129.                 <label for="qty-1"></label>
  130.                 <input type="number" name="qty-1" id="qty-1" class="qty qty-store" value="1" />
  131.                 <div style="height:15px; width:30%; float:left;"></div>                
  132.                 <input type="submit" value="Agregar al carrito" class="btn btn-store" />
  133.             </form>
  134.     </div>        
  135.     </td>
  136.     </tr>
  137.     <?php } ?>    
  138.     </tbody>
  139.     </table>
  #3 (permalink)  
Antiguo 31/03/2017, 04:20
 
Fecha de Ingreso: octubre-2010
Ubicación: España
Mensajes: 1.007
Antigüedad: 14 años, 1 mes
Puntos: 123
Respuesta: Como optimizar página de tienda

Mi recomendación es que hagas la paginación con php y sql en lugar de abordarlo solo con js
__________________
Unset($vida['malRollo']);
  #4 (permalink)  
Antiguo 31/03/2017, 09:03
 
Fecha de Ingreso: julio-2014
Mensajes: 334
Antigüedad: 10 años, 4 meses
Puntos: 30
Respuesta: Como optimizar página de tienda

Yo trabajo con ese plugin, he tenido ese mismo problema y el problema no viene de tu codigo, es el propio plugin que tarda mucho en cargar cuando hay miles de registros.

En mi caso, la app, trabaja con órdenes y éstas pueden tener diferentes estados, para solucionar el problema de tiempo, lo qje hize es mostrar al principio un cierto tipo de estatus, eso reducia la cantidad de ordenes al cargar al principio, y despues, mediante campos que uso de filtro, hago busquedas de otro tipo de estado de orden, con lo cual se vuelve a realizar peticion sql con php y el resultado lo paso al plugin, así gané muchisimo tiempo de carga, reduciendolo a solo unos pocos segundos.

Así que te sugiero que trates de filtrar la carga principal y obvies el cargar todo ya que de todas formas es tedioso tanta informacion y poco util.

En vez de eso, lo que puse yo encima de la tabla eran unos medidores en js que me marcan diferentes aspectos como, el total de ordenes existentes, % ordenes completadas, en proceso, etc...
  #5 (permalink)  
Antiguo 31/03/2017, 10:17
Avatar de Middrel  
Fecha de Ingreso: abril-2005
Mensajes: 835
Antigüedad: 19 años, 6 meses
Puntos: 27
Respuesta: Como optimizar página de tienda

Hola xerifandtomas gracias por responder.

En efecto, al principio utilicé PHP parta hacer la paginación y quedó muy bien, sin embargo al momento de utilizar los filtros y búsquedas tenía que recargar la página y es lo que trato de evitar, por ello utilicé el plugin de jQuery Datatables (admito que no soy muy bueno con javascript aún para hacer todos los filtros en tiempo real y sin recargar la página)

Que tal Triby2, gracias por tu respuesta. Es bueno saber que no sólo me pasaba este problema, así con tu experiencia utilizando este plugin sé que para miles de registros no es la mejor opción. Creo que este plugin es una excelente opción, pero a bajo consumo de registros.

Saludos!!
  #6 (permalink)  
Antiguo 31/03/2017, 11:56
 
Fecha de Ingreso: julio-2014
Mensajes: 334
Antigüedad: 10 años, 4 meses
Puntos: 30
Respuesta: Como optimizar página de tienda

Cita:
Iniciado por Middrel Ver Mensaje
Que tal Triby2, gracias por tu respuesta. Es bueno saber que no sólo me pasaba este problema, así con tu experiencia utilizando este plugin sé que para miles de registros no es la mejor opción. Creo que este plugin es una excelente opción, pero a bajo consumo de registros.
Saludos!!
El plugin es buenísimo, simplemente valora si es realmente necesario imprimir 3000 registros, que ni para exportarlos a un excel (por decir algo) es necesario recuperarlos.

Si aún así, deseas obtener los 3000, entonces vuelve a la programación de antes, como lo tenias con php y sus filtros pero en vez de ejecutar el filtro directamente, utiliza AJAX.

Ya que tienes la programación hecha, lo único que tines que hacer es que cuando el filtro detecte la tecla "Intro" después de poner el valor a filtrar, mandas a ajax ejecutar el query mediante php, cuando el servidor te devuelva los datos. Con Javascript, vacías la tabla y preparas el html para imprimirlo en tu tabla.

De ese modo, no tendrás que preocuparte mucho por el tiempo de carga, no tendrás que recargar la página por cada rato y todos contentos. Aprovecha ese código de filtrado que ya tienes y no lo desperdicies, ahora, sigue valorando lo de mostrar todos los resultados, ya que de ser así, te ahorrarás mucho tiempo de programación.

Un saludo.

Etiquetas: html, mysql, página, registro, select, sql, tienda
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:28.