Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5
Como optimizar tu web y evitar el excesivo consumode recursos
#1
aqui un video de como optimizar bases de datos para wordpress, vale para otros cms y para todos los sistemas.

http://www.youtube.com/watch?v=0ZaLgI_wyXU

Algunos métodos de optimización:

Almacenar el cache. Si el contenido de tu web se nutre a través de una base de datos puedes reducir al mínimo las llamadas de la base de datos guardando versiones estáticas de la web. Y si eres uno de los usuarios de wordpress deberías conocer el plugin wp super cache, hace exactamente lo que os comento.

Compresión. Otra forma de obtener algunos ahorros es comprimir las páginas de modo que sean más pequeños, para comprimir en php usamos Gzip.

Actualmente todos o casi todos los planes de alojamiento dan soporte para Gzip, creo que de los últimos alojamientos diferentes todos lo soportaban, sino estás seguro pregunta a al soporte técnico de tu isp seguro que lo saben.

Implementar Gzip en tu web es muy fácil, solo tienes que pegar está línea de código justo antes de cualquier código de tu página web.

Código PHP:
<?php ob_start("ob_gzhandler"); ?>
Ahora tu web se cargara mucho más rápido.

Limita las consultas de tu base de datos. Debes limitar o hacerlas más eficientes siempre que sea posible.

Optimiza las imágenes. La tasa de trasferencia de datos puede ser fácilmente minimizada limitando el numero de imágenes por página y la reducción del peso de las imágenes.yo recomiendo usar jpg para imagenes nutridas de colores y gif para images de colores basicos.

Realmente nunca sabes cuando te llegará una subida fuerte de tráfico. Espero que con estos consejos tu web sea capaz de sobrevivir a una mención en televisión, radio, prensa, una portada en Digg o incluso una campaña exitosa, sin llegar a caerse.

-----------------------------------------------------------------------
Hay 3 formas de optimizar la velocidad de carga para que se vea tu página web:

Hardware: El servidor donde se encuentra alojada tu página debe ser rápido.
La optimización del código por el lado del servidor (PHP, Java, Perl, Ajax, Python)
La optimización del front-end de tu página (HTML, CSS, JavaScript, e imágenes)

En este artículo se verán puntos para optimizar el front-end, el cual es más simple de mejorar e influye bastante en el tiempo de carga.
Si uno quisiera optimizar el Servidor, se necesita tener acceso de root y en la mayoría de los casos tal ves no lo tengas, ya que te encuentras en un servidor compartido, además tocar opciones de un servidor o de la base de Datos es un trabajo muy delicado, con buenos resultados, pero se necesita bastante conocimiento especializado para no arruinar la configuración de un server.

Estos son los 10 consejos prácticos:
1. Optimiza el tiempo de carga de cada módulo de tu sitio. Identifica a los gordos

Cuanto más rápido cargue tu sitio, los usuarios tendrán menos tiempo de espera para la información que necesitan ver.

Es bueno que analices que componentes (imágenes, animaciones flash, CSS, JavaScript, etc) son redundantes, innecesarios, y cuales pueden ser optimizados. Identifica alos que pesan más y trata de ponerles en dieta rigurosa de bytes.

Es recomendable que la mayoría de tus componentes (ya sea un script o un ícono) no sobrepasen los 25KB cada uno (peso para una página ligera).

Yahoo recomienda mantener todo inferior a 25, porque ese es el peso estándar para que el archivo se quede guardado en la mayoría de los celulares, como en el iPhone.

El plugin firebug de Firefox tiene una opción para ver el tiempo de carga de cada archivo de una página. Lo puedes usar para optimizar este paso.
2. Usa las imágenes en el formato apropiado para reducir su peso

JPEG vs GIF vs PNG la eterna discordia.

Si tienes muchas imágenes en tu página, es ESENCIAL que aprendas a usar el formato óptimo apra cada una de ellas, podrás conseguir GRANDES diferencias.

Los formatos recomendados son JPG, PNG y GIF (por nada del mundo uses TIFF o BMP).

De todas maneras estos 3 formatos son diferentes. JPG lo tendrías que usar sólo para fotos. PNG y GIF para dibujos con colores sólidos, dibujos vectoriales, logotipos, iconos, gráficos de barras, etc. Si hay muchos degrades de tonos, PNG es mejor que GIF en calidad y tamaño.
3.- Optimiza tus archivos CSS y JavaScript para ahorrar unos bytes

Cada byte cuenta, uno por uno luego sumaran una diferencia remarcable.

Optimizar y minimizar estos archivos consiste en un proceso de quitar caracteres innecesarios (como espacios, comentarios largos de código, código comentado, variables redundantes, saltos de linea (enter), etc).

Por ejemplo, este código de CSS:

Código:
.soy-una-clase-linda {
  color: #ffffff;
  line-height: 20px;
  font-size: 9px;
}
Puede ser optimizado a:

Código:
.linda{color:#fff;line-height:20px;font-size:9px;}
… y funcionará igual que la primera opción. Drástico pero efectivo.

Nota.- El CSS de una de mis webs pesa 20KB y no he optimizado drásticamente como en el ejemplo Guiño

Para este punto hay buenas noticias. existen servicios que te optimizan tu código automáticamente con sólo dar un click del mouse: Lista de servicios para optimizar CSS, y para optimizar código JavaScript puedes usar: JSMIN (The JavaScript Minifier), YUI Compressor, y JavaScript Code Improver.

Una buena herramienta reductora de código te da la opción de revertir el proceso y reordenar tu código con espacios y enters para cuando necesites hacer modificaciones, porque siendo sinceros te volverías loco leyendo todo sin altos de línea.

4. Combina archivos CSS para reducir los llamados HTTP

Para cada componente que se necesita para cargar una página web, se hace un llamado HTTP al servidor. De esta manera si tienes 5 archivos CSS se necesitarán de 5 HTTP GET. Si los unieras en menos archivos, reducirías los llamados HTTP y tus páginas cargarían más rápido.

Si quieres unir tu CSS con los archivos JavaScript en uno solo puedes hacerlo con PHP, esta es una guía al respecto.
5. Usar CSS sprites para reducir llamados HTTP

CSS Sprites on Digg.

Un CSS Sprite es una combinación de pequeñas imágenes en una sola. Puedes poner todos tus pequeño iconos, esquineros, logos, flechas, fondos, etc en unsa sola imagen que se cargue solo una vez en tu página y no se hagan varios llamados HTTP.

Con CSS luego puedes dar las coordenadas X Y de la imagen a usarse en las propiedades del background.

La famosa página Digg usa ese método: CSS Sprite de Digg
Para crear estas grandes imágenes puedes usar este: CSS Sprite Creator.
6. Usar compresión por el lado del servidor

Eso es similar a crear archivos ZIP. Si estas en un servidor dedicado necesitaras de un VPS, si es que no tienes la compresión habilitada, deberás instalar. Puedes ver esta guía de como instalar mod_gzip en Apache.
7. Debes evitar el cóodigo cSS y JavaScript dentro de tu HTML

Un gran error es poner el código CSS o de JavaScript internamente en el código HTMl de tu página. Los archivos externos con guardados en la memoria caché de los navegadores, por lo tanto no necesitan volverse a cargar si el usuario sigue navegando por tu sitio.
8. Carga algunas cosas de tu sitio en servicios de terceros que acepten el hotlinking

Enviando algunos archivos del contenido de tu sitio a servicios web de terceros reduce grandemente el trabajo de tu servidor web. Esto se llama offloading. Por ejemplo tu feed RSS se lo puedes dejar a los servidores de FeedBurner, algunas fotos o imágenes las puedes subir a flickr, tus vídeos pueden estar en YouTube, y si eres más detallista puedes usar el Google AJAX Libraries API para llamar a librerías y frameworks populares de JavaScript como: MooTools, jQuery, y Dojo.

Algunas veces debes asumir que dependes que los servidores de estos servicios podrán estar caídos o quien sabe un día desaparezcan del mapa, por lo que tiene cierto riesgo.
9. Rediseña tu sitio web para que no use muchas imágenes

Debes ver como optimizar el diseño de tu sitio web de tal manera de usar la decoración apropiada sin sobrecargar su diseño con imágenes, lo que lo vuelve pesado de cargar. Optimiza y encuentra un equilibrio entre lo liviano, lo agradable visualmente y lo funcional.

A nadie le gusta un decorado sobrecargado o un sitio muy simple sin nada de especial. Algunas veces un decorado se puede sustituir por simples líneas de efectos con CSS.
10. Monitorea el rendimiento de tu servidor

A veces nunca se puede cubrir todos los detalles de cada página. Será bueno que revises de tiempo en tiempo si algún archivo esta sobrecargando el procesador de tu servidor o si todos los pedidos y respuestas estan llegando a destino.

si tienes acceso root puedes usar ab para Apache o Httperf de IBM.

si no tienes acceso a tu webserver puedes usar: Fiddler o HTTPWatch para analizar tu tráfico HTTP.

ademas 17 tips para optimizar al maximo tu wordpress
http://www.trazos-web.com/2010/06/01/gui...wordpress/

----------------------------------------------------------------------------
Optimización del rendimiento y velocidad de Joomla
Algunos consejos para que tu Joomla vuele y sea eficiente!:

Habilita la "Cache" desde Global Configuration >> Cache. Debes tener escribible el directorio de Cache, por ejemplo /www/usuario/public_html/cache . Luego debes configurar la cantidad de segundos que esta se refresca (Se hacen consultas a la base de datos y se guardan en los archivos temporales de la cache de Joomla hasta que pase el tiempo configurado para que vuelva a actualizarse)
Habilita la "GZIP Page Compression" desde Global Configuration >> Server. Para esto, tu servidor debe tener habilitado el módulo Zlib. Esto se hace para que la salida de documentos enviados por HTTP sea enviada comprimida al navegador del cliente, y luego descomprimida por este (si es que en la petición HTTP soporta este tipo de codificación). Esto permite ahorrar transferencia en el servidor.
Utiliza templates livianos (de bajo peso en kb), con diseños sencillos y pocas imágenes externas, y en lo posible basado en Layers y validados como XHTML (Transitional)
No cargues tu portada con 20 o 30 módulos.
Optimiza las CSS y elimina los códigos que no se utilicen.
No recargues las páginas (contenidos) con demasiadas imágenes, elementos de multimedia, flash, etc.
No pegues demasiados códigos que tomen imágenes o javascripts desde otros servidores, esto ralentiza notablemente la carga, es decir cuando hay muchos elementos externos.
No formatees demasiado los contenidos desde el editor wysiwyg de Joomla, trata de arreglártelas con los estilos definidos en las CSS
No hagas páginas demasiado largas, es decir con mucho scroll hacia abajo.
Una página web optimizada para cargar relativamente rápido no debe tener más de 300 lineas de código (Su html generado, final), y no mayor a un peso de 12 kb
La suma del peso de las imágenes, hojas de estilo, Javascripts externos, flash, y todo elemento externo que carga en el HTML no debe sobrepasar nunca los 80 kb.
Evita las cosas innecesarias, depura el código fuente, elimina las etiquetas mal anidadas. Consejo: puedes llevarte a Dreamweaver el código fuente de lo que te ha generado el editor Wysiwyg de Joomla y limpiarlo mediante las herramientas de depuración y eliminación de etiquetas mal anidadas de Macromedia DW.
Respeta (o trata de hacerlo) las normas WAI y de W3C

Eso es todo, espero te haya sido de ayuda!!


PD: los invito a todos a tomar conciencia del uso que le damos a skylium, nada nos cuesta optimizar y monitorizar nuestras webs para evitar las molestas caidas, skylium es de todos, cuidemolo!


Tambien es importante eliminar de tu carpeta de host archivos comprimidos animaciones flash y archivos innecesarios, usa solo los archivos que necesite tu web pues el hosting no es un almacen de respaldo. si tienes algun truco, consejo o sugerencia no dudes en hacer tu aporte al tema.
Tema original de shruken en otro foro
WWW
#2
Gran tutorial. La verdad es que es uno de los principales problemas de WP, abusa bastante de consultas mysql, lo que provoca más consumo de recursos.
#3
Amigo Papi que buen tuto!!!!
He comenzad a armar una web en drupal y cuantos mas modulos cargo mas lenta veo la salida.
He de sentarme pacientemente a recorrer los tips que has indicado!
#4
ecelente tutorial funciono al 100, gracias nuevamente papi.
WWW
#5
Muy buen tutorial.. muchas gracias, me lo guardo a favoritos para tenerlo a la mano, seguro que me servira mucho. Gracias!! Sonrisa
WWW
#6
Excelente tuto para quienes queremos mantener un sitio web optimizado online; me gusto...
#7
Excelente..... siempre debemos tener la optimizacion pendiente
WWW
#8
exelentes consejos papi asi podemos evitar los usos exesivos Sonrisa
#9
Wow, buenos consejos para mantener nuestras webs impecables!
WWW
#10
Interesante, ahora me pongo a leer.
WWW


Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
  Directivas para evitar el escaneo de tu web (posible hacking) alberto_es 21 1.855 09-10-2015, 11:59 AM
Último mensaje: zapikero
Información Método PHP para evitar el uso de HTML en un form drako 11 1.338 07-03-2014, 01:01 AM
Último mensaje: KeviNxDTM
  20 recursos para programadores de PHP lsdr 3 473 05-08-2013, 11:44 PM
Último mensaje: Finer
  como evitar hackeos? phpost matyimpact 19 1.566 23-05-2013, 04:53 PM
Último mensaje: MrLoco
  Evitar la caché de los navegadores con PHP diringax 6 840 22-03-2013, 09:55 PM
Último mensaje: Drod
  Optimizar la Carga de Mysql [VPS 128MB] perioner 0 498 22-01-2013, 04:29 PM
Último mensaje: perioner
  5 errores que debemos evitar al escribir código shackur 11 1.091 12-01-2013, 05:51 PM
Último mensaje: natestale
  [TUTORIAL] Como evitar el Hotlinkeo (robo de imágenes) Taquion 8 1.635 12-01-2013, 05:50 PM
Último mensaje: natestale
  Evitar ataques DDoS en el DNS Taquion 13 3.550 03-05-2012, 09:53 PM
Último mensaje: jorge2012
  Cómo evitar que un fondo se desplace en css sondeo 6 1.739 02-03-2012, 10:13 PM
Último mensaje: Dasg



Usuarios navegando en este tema: 1 invitado(s)