Performance

En el caso de las webs, el término Performance o rendimiento, se refiere a la velocidad de carga o a la potencia de cálculo de un servidor, es decir, a la velocidad a la que se transmiten los datos del servidor al cliente.

Contenido  

1 Razones para una buena performance
2 Ventajas de un buen rendimiento
3 Opciones de optimización

3.1 Uso de la caché del navegador
3.2 Compresión previa con gzip
3.3 Reducción de peticiones HTTP
3.4 Mantén el tamaño de los archivos pequeño
3.5 Comprobar cookies
3.6 Selectores CSS

4 Relevancia para el SEO

Razones para una buena performance
Una web que se carga lentamente, puede animar a los clientes potenciales a abandonar la página. Para asegurar una interacción fluida, se debe hacer algo de forma proactiva para obtener un buen rendimiento. Especialmente con el creciente uso de dispositivos móviles, una impresión positiva a través de una carga rápida y discreta es importante para convertir a los visitantes en clientes. Cuando una página se carga lentamente, el visitante puede rebotar y luego hacer clic en el resultado de la búsqueda de un competidor. El rendimiento de una web ha ganado en importancia porque los sitios web son cada vez más grandes y las redes son cada vez más lentas a través de cargas más altas.

Ventajas de un buen rendimiento
La interacción fluida con un sitio web mantiene a los visitantes allí y crea confianza. Al mismo tiempo, se pueden reducir los costes operativos. Un mejor rendimiento también significa una reducción de la velocidad del sitio, lo que puede tener un efecto positivo en el posicionamiento de los motores de búsqueda.

Opciones de optimización
Hay muchas maneras de mejorar el rendimiento de las webs. Solamente unas pocas se pueden explicar en pocos segundos. No todos los métodos son aconsejables para todas las webs, por lo que siempre se debe comprobar antes de la ejecución si el esfuerzo dará sus frutos o no.

Uso de la caché del navegador
Es posible almacenar los archivos en la memoria caché, es decir, almacenarlos en un búfer en el lado del cliente. Por ejemplo, si una imagen se almacena en la caché en la primera visita a esa página, se puede cargar desde allí para la segunda visita. La página se cargará más rápido porque la imagen no tiene que ser transferida. El almacenamiento en caché sólo es útil para los archivos que no cambian con frecuencia. Se debe realizar una entrada correspondiente en el archivo .htaccess para que esto se ejecute.

Compresión previa con gzip
Otra forma de reducir el tiempo de carga es comprimir los datos antes de que sean enviados por el servidor. Esto se hace usando gzip en el archivo .htaccess. HTML, CSS, JavaScript y otros tipos de archivos pueden ser comprimidos. Además, los espacios en blanco y los comentarios se pueden eliminar antes. La recepción de esta página comprimida es compatible con los navegadores modernos actuales. Es posible reducir el tiempo de carga a la mitad con gzip.

Reducción de peticiones HTTP
Cada elemento de la página es una petición HTTP. Un navegador puede cargar entre dos y ocho de estos elementos al mismo tiempo, todos los demás entran en una especie de cola. Por lo tanto, se tarda más tiempo en cargar una página por completo, independientemente del ancho de banda disponible.

El número de peticiones HTTP se puede reducir combinando ciertos elementos de la página. Los gráficos más utilizados pueden combinarse en una sola unidad, lo que sería recomendable para los elementos de navegación. Este principio se denomina sprites CSS porque CSS se utiliza para describir cuándo y qué elementos son visibles. Otra opción posible es JavaScript.
Se pueden combinar varios archivos CSS o bibliotecas JavaScript en uno solo.
Además, los archivos antiguos e innecesarios se pueden eliminar para reducir aún más las solicitudes HTTP. Los elementos sin función son innecesarios y sólo causan peticiones innecesarias.
Otra ventaja de tener menos solicitudes es que cada archivo tiene su propio encabezado. Tiene que ser enviado con cada petición y por lo tanto la agrupación de gráficos o archivos CSS tiene sentido.

Mantén el tamaño de los archivos pequeño
Para reducir la cantidad total de datos a transmitir, los archivos deben ser pequeños. El aumento del ancho de banda no es un argumento, porque en la actualidad hay que tener en cuenta las visitas con dispositivos móviles.

Una forma de reducir el tamaño de los archivos es evitar las repeticiones. Tanto el código CSS como el código JavaScript a menudo contienen párrafos que se repiten en otros lugares. Si éstos se colocan hábilmente en archivos externos, se pueden reducir las repeticiones y, por lo tanto, el tamaño del archivo.
Los caracteres de control presentan otra forma de reducir el tamaño del archivo. Un programador respeta idealmente la legibilidad del código, por lo que incluye tabulaciones, líneas en blanco y saltos de línea. Se trata de caracteres que se transfieren innecesariamente. Las herramientas especiales le permiten eliminar automáticamente los caracteres superfluos de los archivos CSS, JavaScript o HTML. La versión resultante es difícilmente utilizable, pero es más pequeña que la versión texturizada y por lo tanto más adecuada para el envío.
Los gráficos ofrecen un gran potencial de ahorro de espacio. El tamaño del archivo puede verse muy influenciado por la reducción intencional de la calidad. El formato se puede seleccionar al guardar, el tamaño debe ser exactamente el mismo en el que se muestra el gráfico, y durante la compresión se pueden cambiar los parámetros que afectan al tamaño del archivo (JPEG 85% produce un archivo más pequeño que JPEG 100%).
Comprobar cookies
Las cookies también afectan al rendimiento. Cualquier cookie y cualquier información en una cookie sólo debe existir si es útil. Por ejemplo, se puede prescindir de la recogida y transmisión de datos que realmente no se utilizarán.

Selectores CSS
También se pueden hacer pequeñas mejoras en las hojas de estilo CSS. La razón es que los selectores CSS tienen diferentes tiempos de procesamiento. Los más adecuados son ID (#) y clase (.). Sin embargo, el selector de wildcard (*) y el selector descendiente (>) son más lentos. Otro pequeño factor es el comando @import, que puede bloquear la carga en algunos navegadores hasta que se cargue el propio archivo importado.

Relevancia para el SEO
La velocidad del sitio es un factor de posicionamiento confirmado y por lo tanto el rendimiento es esencial desde una perspectiva de SEO. Además, los visitantes dejan rápidamente páginas que se cargan lentamente. Puede reducirse a milisegundos. Los sitios web de gran tamaño a menudo han probado el impacto del rendimiento en el comportamiento de los clientes. Amazon, por ejemplo, retrasó intencionadamente el tiempo de carga de las páginas de productos en 100ms. Como resultado, las ventas disminuyeron un uno por ciento.
En un estudio de Yahoo, la carga de la página de inicio se retrasó hasta 400ms, con el resultado de que el nueve por ciento de los visitantes cerraron la página antes de que se completara la carga. El motor de búsqueda de compras Shopzilla redujo su tiempo de carga en 3,5 segundos gracias a la optimización del rendimiento. Los ingresos aumentaron posteriormente en un doce por ciento. La optimización del rendimiento, por lo tanto, ocurre como parte de la optimización de motores de búsqueda. A modo de comparación, sería aconsejable evaluar también las webs de los competidores con las herramientas adecuadas. Google Insights es una herramienta que se puede utilizar para esto. Se puede especificar una URL que se está probando con respecto a la velocidad del sitio. La herramienta generará propuestas para mejorar la velocidad de carga.