Jump to content
  • Sky
  • Blueberry
  • Slate
  • Blackcurrant
  • Watermelon
  • Strawberry
  • Orange
  • Banana
  • Apple
  • Emerald
  • Chocolate
  • Charcoal
koruitch

Mejorar velocidad de carga de Risus

Recommended Posts

Hola muy buenas gente, les dejo unos codigos para mejorar la verlocidad de carga del script. 

 

Utilizando la herramienta de google http://developers.google.com/speed/pagespeed/insights/ podremos saber algunas cosas importantes que debemos mejorar y otras recomendadas.

 

Para utilizar cache de navegadores el codigo que probé y mejor me funcionó es:

En htaccess al final agregar:

 

Header unset Pragma
FileETag None
Header unset ETag
 
# 1 YEAR
<FilesMatch "\.(ico|pdf|flv|jpg|JPG|jpeg|png|gif|swf|mp3|mp4)$">
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified
</FilesMatch>
 
# 2 HOURS
<FilesMatch "\.(html|htm|xml|txt|xsl)$">
Header set Cache-Control "max-age=7200, must-revalidate"
</FilesMatch>
 
# CACHED FOREVER
# MOD_REWRITE TO RENAME EVERY CHANGE
<FilesMatch "\.(js|css)$">
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified
</FilesMatch>
Con este codigo indicaremos el tiempo que los navegadores deben guarden en cache los archivos.

 

Otra cosa que en mi caso me dice es que debemos priorizar la carga de la mitad superior, para esto puse los archivos js en carga asincrona pero dejaron de funcionar varias partes de la web. Intenté saber cual es el js vital, pero siempre dejaba de funcionar algo, asi que este punto creo que no lo podremos solucionar de este modo. Sin embargo ahora a mi me dice esta correcto y no se exactamente porque.

 

Podremos mejorar tambien la velocidad comprimiendo los css y los js. Esto es lo que nos dice esa herramienta. Realmente a lo que se refiere con esto es eliminar los espacios y/o comentarios de esos archivos css y js ya que los espacios en blanco también suman en el tamaño final del archivo. Estube buscando algo para realizar esta acción y encontre este: http://cssminifier.com/ . Encontre otros pero siempre me daban problema del tamaño del archivo.

 

También nos indica que comprimamos con gzip deflate, para esto debemos saber si nuestro servidor tiene esta opción en ese caso el código que mejor me funciono fue:

 

En htaccess al final agregar:

 

# compress text, HTML, JavaScript, CSS, and XML
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

# remove browser bugs
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
 

Redacte este post ayer más completo y detallado, pero no se porque le di a borrar y me fue a la página anterior y perdí todo. Públique un post similar pero más generalizado en mi web, os dejo el enlace por si quereis echarle un ojo pero para Risus es lo que mejor me funcionó. Como mejorar tiempo y velocidad de carga de pagina web .

 

Espero que os sirva para mejorar la velocidad de vuetras webs. Un saludo.

Edited by koruitch
  • Like 5

Share this post


Link to post
Share on other sites

Como hago para que no pase esto ._.

8tKvU.png

 

No tengo ganas de editar todos los archivos con el "&Uacute;"

 

Creo que tienes que cambiar la codificación.

 

 

mmm por algún motivo que desconozco no me funciona en localhost :( :(

 

¿A cual codigo te refieres? Para el de gzip y deflate tienes que tener habilitado ese complemento en tu servidor, para el del cache debe de funcionar igualmente.

  • Like 1

Share this post


Link to post
Share on other sites

Creo que tienes que cambiar la codificación.

 

 

 

¿A cual codigo te refieres? Para el de gzip y deflate tienes que tener habilitado ese complemento en tu servidor, para el del cache debe de funcionar igualmente.

Estas en lo correcto, exacto ahora verifique mejor con tu respuesta. Asi es el de cache funciona perfecto; pero el de gzip deberia probarlo online al parecer

Share this post


Link to post
Share on other sites

Estas en lo correcto, exacto ahora verifique mejor con tu respuesta. Asi es el de cache funciona perfecto; pero el de gzip deberia probarlo online al parecer

 

Solo tienes que instalar o habilitar compresion gzip en tu servidor de localhost, pero no se como se hace ni tampoco que programa estás utilizando. Pero posiblemente no sea demasiado complicado. 

  • Like 1

Share this post


Link to post
Share on other sites

Solo tienes que instalar o habilitar compresion gzip en tu servidor de localhost, pero no se como se hace ni tampoco que programa estás utilizando. Pero posiblemente no sea demasiado complicado. 

Genial muchisimas gracias por las respuestas ;)

Share this post


Link to post
Share on other sites

 

Gracias por compartir el codigo, no lo conocía, lo probare de seguro..

:lol:

 

 

Probé varios y estos son los que me eliminaron las mejoras de la herramienta esa de google al momento. Lo de juntar los css en uno solo y minificarlo también se nota ya que más o menos se reduce su peso en un 20%. Lo probé y también me lo ponia como una cosa buena en la web. Pero son tantos que tengo primero que organizarlos y guardarlos por duplicado y me llevará un tiempo por eso no lo hice aún. Eso de tener 8 css es un atraso.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Miguel92
      Pedido: [Mod] Imagen de cabecera en comunidades
      Por: @fellomix
       
      Una segunda forma de poder hacerlo!
       
      1 -  Ejecutar esta consulta
      ALTER TABLE `c_comunidades` ADD `c_headercom` VARCHAR(255) NOT NULL AFTER `c_nombre_corto`; 2 -  Buscar en c.comunidades.php en la función nueva_comunidad()
                      'fecha' => time(),                 'nombre' => $tsCore->setSecure($tsCore->parseBadWords($_POST['nombre']), true),                 'ncorto' => $tsCore->setSeo($tsCore->setSecure($_POST['ncorto'], true)),
      y debajo agregamos
                      'headercom' => $tsCore->setSecure($tsCore->parseBadWords($_POST['headercom']), true),
      un poco más abajo buscamos
                  // Insertamos             if(db_exec(array(__FILE__, __LINE__), 'query', 'INSERT INTO c_comunidades (c_autor, c_nombre, c_nombre_corto,
      y le agregamos a lado 
                   c_headercom,
      un poquito más abajo de
                      VALUES (                     \''.$tsUser->uid.'\',                     \''.$dato['nombre'].'\',                     \''.$dato['ncorto'].'\',
      agregamos
                          \''.$dato['headercom'].'\',
      Luego buscamos la función editar_comunidad($comid)
                          'pais' => $tsCore->setSecure($_POST['pais']),                         'desc' => $tsCore->setSecure($_POST['descripcion']),                     'color' => $tsCore->setSecure($_POST['back_color']),
      y debajo pegamos
                          'headercom' => $tsCore->setSecure($_POST['headercom']),
      más abajo buscamos 
                          c_acceso = \''.(int)$dato['acceso'].'\',                     c_permisos = \''.$dato['permisos'].'\',
      y debajo pegamos
       
                         c_headercom = \''.$dato['headercom'].'\',             
      3 - Después buscamos en c.crear_left.tpl
          <div class="item_form clearfix">         <label>Categoría</label>         <select name="categoria" id="ShowCats" class="required" onChange="com.subcat()" tabindex="3">             <option value="0">Selecciona una categoría</option>             {foreach from=$tsCats item=c}             <option value="{$c.cid}" {if $tsDato.c_categoria == $c.cid}selected="selected"{/if}>{$c.c_nombre}</option>             {/foreach}         </select>     </div>
      y debajo o arriba pegamos (se me olvido quitar los required, ya que no es obligatorio)
          <div class="item_form clearfix">         <label>Cabecera!</label>         <input type="text" name="headercom" tabindex="10" maxlength="180" size="60" class="required input_text https" placeholder="URL de portada (debe tener https://)" pattern="https://.*" value="{$tsDato.c_headercom}">         <small class="mg-lt">Solo admitirá los https!</small>     </div> 4 - Después buscamos c.com_info.tpl [línea 24 y 25]
      <div class="ver_com_info">     <div class="vci_left floatL">
      y la reemplazamos por
      <div class="ver_com_info" style="background-image: url({$tsCom.c_headercom});">     <div class="opacity">     <div class="vci_left floatL">
      luego debajo de la línea 61 agregaremos un 
          </div> 5 -  Por último agregaremos esto a comunidades.css
      .ver_com_info {     padding: 0; } .headercom {      background-position: center center;     background-size: cover;     background-repeat: no-repeat; } .opacity {     padding: 20px 8px;     background-color: rgba(255,255,255,.6); }  
    • By Miguel92
      Bueno dice N°2 porque a la N°1 la tengo que adaptar a la default ya que tenia class de bootstrap!
       

      si no se ve clic
       
      1) Crean un archivo llamado panel.js y agregan esto dentro
       
      2) En extras.css agregan esto
       
      3) Ahora crearemos un archivo llamado head_usuario.tpl y lo colocaremos en sections y dentro agregaremos
      la parte del st-panel-footer la pueden sacar no hay problema
       
      4) Ahora en la misma carpeta sections buscamos main_footer.tpl y agregaremos esto arriba de </body>
      {include file='sections/head_usuario.tpl'} <script src="{$tsConfig.js}/panel.js" type="text/javascript"></script>  
      5) Para los iconos descarguen esto → ICONOS FUENTES  ← y lo descomprimen en css
       
      6) Busquen en main_header.tpl y debajo de
      <link href="{$tsConfig.tema.t_url}/extras.css" rel="stylesheet" type="text/css" /> colocan
      <link rel="stylesheet" href="{$tsConfig.css}/iconfont.css">  
      y eso sería todo
       
      En el caso que haya error avísenme!
      Esta es la N°1
       
      si no se ve clic
      Ver panel N°2 ir a Demo32.hol.es
      Usuario: Demo
      Pass: demouser
    • By Rhuan
      Hola, este complemento podría considerarse en realidad una "plantilla" para el anterior RChat que publiqué ya que la mayor parte del funcionamiento es el mismo.
       
      Para instalar este chat no es necesario tener el anterior RChat y si lo tienes también puedes instalarlo sin problemas, los archivos se sobrescribirán.
       
       
      Actualización
      06/03/2015 a las 18:00 - Descarga actualizada: se ha corregido un fallo en el instalador que evita que aparezca el icono de los emoticonos. 08/03/2015 a las 22:10 - Descarga actualizada: se añadió seguridad adicional para evitar el flood. 09/03/2015 a las 23:15 - Descarga actualizada: ahora se muestran todos los emoticonos y se pueden agregar desde el chat.  
      Más capturas

        Caja de emoticonos abierta.
       

      Lista de moderación.
       

      Eliminar mensajes (onmouseover).
       

      Suspender usuario (onmouseover).
       
       
      Características
      Color de nick aleatorio como en grupos de WhatsApp. Suspender usuario por nick y por mensaje. Ver/editar/eliminar usuarios suspendidos. Borrar mensajes individualmente o todos de un usuario. Agrupar mensajes seguidos del mismo usuario. Mensajes propios diferenciados (alineado a la derecha en verde) BBCodes: [b], [i], [u], [br], [url], [color]. Imágenes y URLs automáticas. Censuras globales. Emoticonos globales a través de censuras. Antiflood, suspende durante 2 horas. El antiflood no afecta al staff. Diseño separado para funcionar con cualquier plantilla. Agregar emoticonos desde el chat. Selector de emoticonos.  
      Descarga
       
      Para Risus 1.2 o superior: rchat_whatsapp_1.2.zip
       
       
      Instrucciones
       
      Subir el directorio "install" a la raíz y acceder desde el navegador a http://www.tuweb.com/install/index.php
    • By Altffenser
      Hola, traigo esta pequeña modificación, es un dialogo de confirmación para cerrar sesión. Utilizo el plugin "mydialog" que trae por default el script por lo que no hará falta nada más. Este MOD lo vi hace años, lo publicó un usuario llamado mega-lucas ((o algo así (aún mantengo su V5 ))
       
      Instrucciones.
      1. Abrir el archivo acciones.js y al ultimo del archivo colocar:
      /* Logout confirm by Altffenser */ function open_logout_box() { mydialog.show(); mydialog.title('Cerrar sesión'); mydialog.body('Estas a punto de salir de tu cuenta. <b>¿Seguro que deseas continuar?</b>'); mydialog.buttons(true, true, 'Cerrar sesión', 'logout_by_now()', true, false, true, 'No, permanecer aquí', 'close', true, true); mydialog.center(); } function logout_by_now(){ $(function (){ window.location.href = global_data.url + "/login-salir.php"; }); } 2. Abrir el archivo head_menu.tpl y buscar:
      <li class="logout"> <a href="{$tsConfig.url}/login-salir.php" style="vertical-align: middle" title="Salir"> <span class="systemicons logout"></span> </a> </li> a) Reemplazar por:
      <li class="logout"> <a href="#" onclick="open_logout_box();" style="vertical-align: middle" title="Salir"> <span class="systemicons logout"></span> </a> </li>  
      ¡Has terminado!
       
      Con eso lo tendrán, ahora cada que den clic en "salir"; primero aparecerá un dialogo como este:
       

       
      Es muy sencillo el MOD pero a mi parecer, se ve bien Saludos
       
  • Recently Browsing   0 members

    No registered users viewing this page.

  • Patrocinador



  • ×