Acelerar WordPress: cómo optimizamos el rendimiento del sitio en WPShout

Esto es lo que aprendimos sobre la creación de nuestro sitio y más rápido. Uno de nuestros objetivos aquí en WPShout es tener un sitio rápido. Hay muchas razones por las cuales este es un objetivo importante: es mejor para usted, es mejor para nosotros y es impresionante y nos deja presumir. Hice muchas cosas pequeñas para ayudar con esto históricamente, y recientemente propuse aumentar nuestro rendimiento y acelerar más WordPress. Esto es lo que aprendimos sobre la creación de nuestro sitio y más rápido. Decidí concentrarme en mejorar nuestro rendimiento en Google PageSpeed ​​Insights. Hay una serie de buenas herramientas para verificar y monitorear el rendimiento general del sitio. Pero este es el que elegí, porque la opinión de Google importa más que la mayoría de las otras herramientas (mueven mucho tráfico en Internet). Una complejidad al hablar sobre los resultados de Google es que no son súper deterministas (dos rodando contra la misma configuración del sitio regularmente dan resultados ligeramente diferentes) y tienen un número de escritorio y un número de teléfono móvil.
Desde un punto de vista estructural, este artículo comienza con algunas cosas que hice históricamente sobre el rendimiento web, luego las mejoras que hemos realizado y finalmente toca algunas de las cosas que Google todavía se queja de por qué no las reparo (al menos correctamente ahora). ¡Vamos! Cosas que hemos hecho para acelerar WordPress que quizás no tenga nuestro sitio está alojado en el sitio. Estamos en su mayor plan de alojamiento común, “GoGeek”, y activamos todas sus capas de caché básicas. El alojamiento de SiteGround ha abierto el camino en mi experiencia de lo que los anfitriones no son específicos de WordPress. Desde un punto de vista histórico, se sorprendió por otros niveles similares de Bluehost, GoDaddy, etc. Aunque no he visto esto muy de cerca en los últimos años y he escuchado el ruido que Bluehost, al menos, alienta o obliga a la memorización más agresiva de WordPress. Hemos hecho varias cosas pequeñas para mejorar el sitio que quiera considerarlos . Aquí hay una lista de las cosas que he hecho en el pasado, por mencionar:
No he usado temas o creadores de páginas costosos y complejos de WordPress. Esto no es universal, pero en general, si desea obtener algo como PageSpeed ​​Insight, diría que analice la minimización de los complementos que usa y también el peso (en el sentido de opciones, etc.) en su tema . Nuestro tema está hecho en casa.
Hemos tomado medidas para minimizar el tamaño de la imagen del archivo en nuestro sitio. Se usó tanto para el contenido de medios cargados como para los archivos que pueden haber usado en complementos o temas para que Google se queje de nuestras imágenes. Ya no se queja de ellos. Estamos ejecutando la imagen de fotón CDN de Jetpack. Un CDN a menudo se vende como una bala de plata de rendimiento. No es uno. Pero hace una diferencia no trivial y nos ayuda a acelerar WordPress. El JetPack CDN es gratuito, y las imágenes son realmente el único entorno “costoso” que servimos, por lo que su valor está ahí para nosotros.
Por qué se quejó Google PageSpeed ​​Insights que Google tiene una lista estándar de cosas de las que se quejará, y luego le permitirá mirar más de cerca los elementos de esa lista. Dadas las cosas ya mencionadas anteriormente, ¿qué quejas tenían Google hacia mí mientras estaba involucrado en esta aventura de optimización? Bueno, aquí está la captura de pantalla:
Y si no quieres leer una foto, esto es lo que escribe:
Eliminar JavaScript y CSS que bloquea la representación en el contenido anterior

Use el almacenamiento de su navegador en caché
Activar la compresión
Reducir el tiempo de respuesta del servidor
Minimiza html
Minimiza CSS
Reducir JavaScript
Optimizar las imágenes
Si todo esto ya tiene sentido para ti, eres genial. Si no, no se preocupe. Explicaré a cada uno de ellos más detallado mientras discutimos por qué y cómo eliminamos el problema en la lista de Google o por qué no pude resolver el problema. Lo que hicimos para mejorar la velocidad de la página y acelerar WordPress en esta sección, cubriremos los cambios que hicimos en un esfuerzo por aumentar el puntaje de velocidad de la página y acelerar WordPress. La forma específica en que puede lograr variará según su alojamiento, pero el esquema general probablemente será similar. Use su navegador en caché con .htaccess memorizando el navegador en caso de que capacite el navegador de un visitante que pueda ahorrar y reutilizar algunos activos que es. puede salir de su servidor por un período de tiempo más largo. Tenga en cuenta que estamos en SiteGround y que esto podría funcionar de manera un poco diferente en su sitio, pero para nosotros, Apache es la forma en que SiteGround continúa sirviendo a nuestro sitio de WordPress, por lo que solo tenemos que usar un módulo Apache para activar el almacenamiento en caché en el lado del navegador. Hice esto aprovechando un archivo llamado .htaccess que la mayoría de los hosts aceptan. Acabamos de agregar el siguiente bloque a nuestro archivo .htaccess, según un artículo en la base de conocimiento en SiteGround. Aquí está en su totalidad:
expiresActive en expiresbype Text/CSS “Access más 14 días” ExpiresBype Text/XML “Access más 0 segundos” ExpiresBype Text/JavaScript “Access más 14 días” ExpireBy Application/X-JavaScript “Access más 14 días” ” ExpiresBype Image/ICO “Access más 14 días” Expiresby Image/JPG “Access más 14 días” ExpiresBype Image/JPEG “Acceso más 14 días” Expiresby Image/GIF “Access más 14 días” Expira Imagen/PNG “Acceso más 14 días” ExpiresBype Image/SVG+XML “Access más 1 mes” ExpiresBype Text/HTML “Access más 14 días” Expiresby Video/OGG “Access más 1 mes” Expiresby Audio/OGG “Access más 1 mes” Expiresby Video/Mp4 “más 1 más 1 Mes “ExpiresBype Video/Webm” Access más 1 mes “ExpiresBype Application/X-Woff” Access más 1 mes “ExpiresBype Application/VND.MS-FontObject” Access más 1 mes “Expiresby Peplication/XML” Access más 0 segundos “ExpiresByype Application /JSON “Access más 0 segundos” caduca SBYTYPE Aplicación/RSS+XML “Acceso más 1 hora” ExpiresBype Application/Atom+XML “Access más 1 hora” Esto es bastante expresivo, por lo que probablemente no necesite una explicación muy exhaustiva. Básicamente, cada línea que dice “expiratesbytype” se establece mientras deseemos que los navegadores mantengan ciertos recursos. Entonces, para los recursos de Image/JPEG, le decimos al navegador que puede mantenerlos durante 14 días, así como los archivos CSS y JavaScript.
A medida que activaba la compresión en .htaccess como el conjunto de reglas anteriores para el caché del navegador, utilicé la recomendación de la base de conocimiento de SiteGround para ello. Esencialmente, este tipo de compresión se llama GZIP. Y configuré esto nuevamente en Apache. Codul adăugat la fișierul nostru .htaccess arată astfel: 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 Aplicación/RSS+XML AddoutputFilterByType Deflate Application/JavaScript AddOutputFilterBype Deflate Application/X-JavaScript Cada archivo ahora será ligeramente más pequeño. Nada muy dramático para un recurso individual, pero se puede agregar en unas pocas docenas de archivos. Además, Google quiere hacerlo, lo cual es una buena razón para mí. Este es en realidad un gran ejemplo de algo que no hice. Pero una de las cosas simples que sabía que podía hacer para reducir el tiempo de respuesta del servidor era cambiar lo que la versión de PHP usó nuestro servidor para ejecutar todo el código PHP que WordPress usa en cada solicitud de página. Lo que había en nuestro archivo .htaccess cuando comenzamos fue:
ADDHANDLER APLICACIÓN/X-HTTPD-PHP56 .PHP .PHP5 .PHP4 .php3 Lo que hay ahora es:
ADDHANDLER APLICACIÓN/X-HTTPD-PHP71 .PHP .PHP5 .PHP4 .php3 Entonces, ¿qué cambié? Transformamos nuestro PHP utilizado en el sitio en PHP 7.1, donde anteriormente era 5.6. Esto puede tener un cierto impacto en el rendimiento general en el servidor, porque PHP 7 es mucho más rápido que incluso relativamente rápido PHP 5.6. Por lo tanto, es probable que vea una pequeña victoria aquí en términos de velocidad, pero probablemente no será suficiente para detener a Google a veces que se queja de nuestro tiempo de respuesta del servidor. Pero es rápido de hacer y siempre que no use un complemento o tema que no sea compatible con Php 7 (.1) será muy rápido e indoloro. Reduzca HTML, CSS y JS por autoadio para reducir el CSS y JavaScript, hay varias opciones. Pero lo más fácil para mí y la mayoría de las personas serán usar un complemento de WordPress para hacerlo. Es posible hacer esto de inmediato para los complementos que crea, pero si usa complementos y temas y no crea, la minimización debe administrarse en WordPress con (otro) complemento. La autoevaluación también hace concatenación para HTML. Podría entrar en más detalles sobre su uso, pero el jueves pasado publiqué una guía rápida sobre exactamente este tema:
Cómo reducir y combinar CSS y JS con autooptimizado lo que no hice y por qué arriba detallé las quejas de Google que abordé. Pero cuando terminé, PageSpeed ​​Insights tenía más quejas. Estas quejas no son incorrectas y no están sin resolver, pero elegí no hacerlo. Aquí están estos y por qué … no he trabajado en “Eliminar JavaScript y CSS que bloquea la línea en el contenido por encima de la página” La lógica aquí es que esto es realmente bastante complicado, especialmente en WordPress. Y, aunque amo a nuestros lectores y estoy orgulloso de crear un gran contenido para ellos, profundizar en esta optimización supera con creces el propósito de este artículo y lo que tiene sentido en un número razonable de palabras. La idea básica aquí es que desea minimizar la cantidad de recursos tanto CSS como JavaScript que un navegador debe cargar antes de que pueda comenzar “dibujar” la página. Las formas de hacer esto no son algo que trataré aquí. Cosas como la integración esencial de CSS, la reducción mínima de la cantidad de hojas de estilo y el aplazamiento de la carga como sea posible es lo que se recomienda aquí. Diferir ya la mayoría de nuestros archivos JS, como menciona el artículo de Fred sobre este tema. Pero en toda esta queja es más que eso y tendrá que esperar nuevamente. (¿Sabes una forma de hacer esto? ¿Tienes una excelente manera de hacer esto?
No dude en comentar o enviar un correo electrónico. Me gustaría obtener más información al respecto). Google todavía se queja del tiempo de respuesta de nuestro servidor optimizando el tiempo de respuesta del servidor en WordPress, especialmente cuando usa una variedad de complementos, es difícil. Recibe tipos de consejos muy claros y no está equivocado, pero es difícil de hacer. Las cosas que podrían reducir el tiempo de respuesta del servidor incluirían: pago de un servidor más fuerte: ya tenemos una respuesta en menos de segundos de GoGeek de SiteGround. Pero probablemente podríamos impulsar esto a continuación (a los tiempos idealizados por debajo de 200 ms) en servidores de súper rendimiento que no se eliminan de ellos o de otro proveedor. No hago esto ahora, porque estamos bastante satisfechos con el producto y la asistencia del sitio.

Deshabilitar más complementos-cada complemento que ejecute ralentizará la velocidad de una respuesta de WordPress, al menos un poco. Y dependiendo de lo que haga, puede ralentizarlo. Pero la desactivación de cualquier otra cosa que no se conocen complementos no esenciales no cae en el alcance de este artículo.
De hecho, estas son las únicas dos palancas que están fácilmente disponibles para el contenido que no se almacena en caché. Y tenemos todas las opciones de almacenamiento en el sitio de caché activado. Podríamos reducir y optimizar aún más los complementos que usamos, pero esto solo tiene sentido si sabemos que son lentos y los “sostienen” en el sentido de que somos el mantenimiento de su código. Esto no es cierto para todo lo que me queda. Todavía estamos recibiendo quejas sobre el hecho de que no tenemos caché en el navegador para todos los recursos. Htaccess que hemos compartido anteriormente ha eliminado las quejas de Google sobre los archivos que se pueden almacenar en caché en el dominio WPShout. Pero nuestras páginas también incluyen algunos JavaScript muy importantes que Google cree que podría almacenarse mejor en caché: 2 archivos de OptinMonster, que usamos para ventanas emergentes, que no especifican la cadena.
Uno de Facebook, que usamos para compartir bares
Uno de (quizás irónicamente) Google en sí, para Google Analytics
Ninguna cantidad de reglas .htaccess que pueda escribir en nuestro servidor puede resolver. Teóricamente, (1) ya no usar estas herramientas, (2) escribirles sobre sus reglas de caché, aunque solo OptinMonster realmente no establece una vida útil o (3) para reescribirlas para usar la fecha límite durante mucho tiempo de esos archivos. El último es técnicamente complicado y probablemente no lo merece, y los dos primeros que consideraremos a largo plazo. Google todavía quiere optimizar las imágenes que no alojamos, todavía hay algunas quejas cuando ejecuto PageSpeed ​​Insights sobre el hecho de que nuestra página inicial tiene una imagen de optimización. Pero fue mi gravedad personal, lo que es un poco difícil para mí resolver. Es posible, si lo optimizo antes de poner la gravatar, la queja desaparecerá, pero no jugué lo suficiente con ella y el hecho de que no está alojado aquí lo hace un poco más difícil. Lo que aprendí sobre el rendimiento del sitio aceleré WordPress y WPShout, solo siguiendo las ideas de la nariz y la velocidad de la página. Si no está en el sitio, algunas de estas optimizaciones de rendimiento pueden parecer sutiles diferentes o pueden ser imposibles. Todo depende de tu anfitrión. Pero para la mayoría de los anfitriones, ambos son posibles y probablemente son bastante similares a hacerlo en el sitio.