En nuestro artículo anterior, exploramos los beneficios de tener un servicio CDN con WordPress y por qué los CDN son una de las mejores formas de acelerar WordPress muchas veces antes en el blog. . Observamos cuánto aumenta el rendimiento si sus visitantes están lejos de su servidor host. Esperamos que haya despertado su interés porque en el artículo de hoy vamos a hacer una guía paso a paso sobre cómo crear un recurso CDN en CDN77 y cómo modificarlo correctamente. Después de eso, instalaremos un conjunto específico de complementos en WordPress y luego verificaremos si todo está funcionando bien.
El primer paso de nuestra guía será crear una cuenta CDN77. En caso de que aún no tenga una cuenta, CDN77 ofrece una prueba gratuita de 14 días. El registro toma solo unos minutos. Luego, crearemos un recurso CDN haciendo clic en Crear nuevo recurso CDN (en la pestaña CDN). A los efectos de este artículo, vamos a implementar un CDN en un blog de películas alojado en un centro de datos en Las Vegas.
Dado que vamos a implementar una solución HTTPS completa, usaremos el nuevo «HTTPS» en CDN77. Esta opción asegura la transferencia de datos desde su servidor host al servidor CDN.
Si su sitio se ejecuta en modo SSL, es absolutamente necesario crear un recurso solo SSL en CDN77. De lo contrario, corre el riesgo de errores de contenido mixto. Este tipo de errores se produce cuando el navegador se ejecuta en modo SSL y de repente intenta cargar un recurso a través de una solicitud HTTP insegura.
Cómo configurar un SSL en CDN77
Podemos configurar un certificado SSL gratuito de 2 formas. Podemos usar un certificado SSL compartido para un subdominio en xxx.c.cdn77.org o podemos usar nuestro propio CNAME (vea la imagen de arriba). En general, recomendamos utilizar un CNAME como cdn.yoursite.com.
Si opta por la solución compartida CDN77, no es necesario realizar más pasos para que el subdominio SSL funcione correctamente.
En este caso, configuraremos un CNAME. Esto significa que se podrá acceder al contenido de nuestro sitio web a través de HTTPS instantáneamente si reemplazamos nuestro sitio con cdn.ourdomain. Con CDN77, obtener un SSL es cuestión de unos pocos clics.
¡Ajústalo!
Una vez que crea el recurso, lo primero que debe mirar es el menú Otras configuraciones. Si va a utilizar HTTPS, es absolutamente obligatorio mantener habilitado HTTP / 2. La mejora de la velocidad entre HTTP / 1.xy HTTP / 2 normal es enorme. CDN77 funcionará en modo HTTP / 2 en su recurso HTTPS de forma predeterminada, reduciendo su tiempo a la mitad.
Si va a través de HTTPS, también debe realizar un redireccionamiento 301 para cumplir con los estándares de Google para HTTPS, habilite el redireccionamiento HTTPS.
Para un rendimiento óptimo, habilite ignorar todo en Ignorar cadenas de consulta. A menos que su sitio esté ejecutando contenido cargado dinámicamente que necesita actualizarse cada hora, puede salirse con las cadenas de consulta e ignorar todo, esto aumentará enormemente el rendimiento de la caché y el sitio.
CDN77 también ofrece la opción Cache Expiry. En caso de que cargue muchas imágenes, esto debe establecerse en la configuración más alta posible, que es 12 días.
En esta guía, consideraremos la velocidad en primer lugar. Por lo tanto, CDN nos proporcionará solo el contenido estático de la imagen, todo lo demás se cargará desde el servidor de origen.
¿Por qué no usar CDN para Javascript y CSS, estás loco?
Recuerde que en nuestro artículo anterior, hablamos sobre cómo el rendimiento de CDN puede variar cuando el contenido no está disponible en el nodo solicitado de la red CDN. Bueno, si el archivo aún no almacenado en caché resulta ser un archivo CSS, el tiempo de carga aumentará y puede afectar negativamente su rendimiento. Esto podría afectar la velocidad de representación de su sitio mucho más que si decide no publicar CSS con CDN.
Los archivos CSS y Javascript son vitales para la carga de sitios web en cualquier navegador y no deberían estar sujetos a un mecanismo de caché como el de los servicios CDN. Sin embargo, puede crear un recurso estático en la CDN para volcar estos archivos importantes. Esta es una técnica más avanzada que requerirá que modifique su WordPress a un nivel más allá del alcance de este tutorial.
Una vez que tengamos todo ajustado correctamente, podemos pasar a la pestaña del menú de los centros de datos.
CDN77 proporciona una forma conveniente de habilitar / deshabilitar cada nodo de su red. El punto es seleccionar cuidadosamente qué nodos son los que se utilizan más activamente. Esto es fácil de averiguar, solo sigue a tus lectores.
Una vez que sepa qué nodos necesita, se le recomienda que desactive todos los nodos prescindibles. Hay una explicación simple para esto: cuantos más nodos tenga en su red, más tiempo llevará actualizarlos todos, por lo tanto, su rendimiento se verá afectado. Como regla general, cuando reduce la cantidad de nodos, también aumenta el rendimiento de la caché. Elegir sabiamente.
Cuando prueba el rendimiento de su sitio por primera vez, purgar y precargar podría ser útil. Purge empujará un contenido específico fuera de la red CDN, es útil si cambia el contenido y necesita vaciar el caché para actualizar. Prefetch hará lo contrario, forzará un contenido específico en la caché de CDN.
Una vez que tenga todo configurado, puede apuntar su CNAME a su propio dominio. Para hacer eso, debe crear una regla en su registrador o su panel de alojamiento en la sección DNS y apuntar su cdn.yourdomain.com a CNAME xxx.rsc.cdn77.org como se muestra en la imagen, esto instruirá al DNS para redirigir todo el tráfico de su subdominio al lugar real donde debe estar. No se preocupe, no afectará el rendimiento. Además, también sirve para mostrar a sus lectores que está utilizando un cdn.tudominio.com que parece elegante.
Si prefiere usar la dirección cdn77.org, no necesita hacer nada, solo use esa dirección cuando reemplace su contenido en WordPress.
Lado de WordPress
En el lado de WordPress, necesitamos agregar un complemento para que esto funcione correctamente. Vamos a utilizar el Habilitador de CDN, un útil complemento gratuito. La razón para usar este complemento es simple: la mayoría de los complementos de CDN no permitirán un control tan granular sobre las carpetas que envía a la CDN. Este complemento lo hace y es muy importante para nuestro caso, ya que no queremos incluir ningún archivo Javascript o CSS, solo las imágenes cargadas.
Una vez instalado, puede encontrar el complemento aquí mismo …
¡Modifiquémoslo!
¿Recuerdas cuando hablamos de personalización? Aquí está el hecho más importante sobre cómo configurar correctamente una CDN en WordPress. La gran mayoría de los complementos de CDN le indicarán que incluya un directorio para que el CDN se «replique» y, por lo general, le indicarán que incluya wp-content. Eso está bien para una configuración general, pero no es bueno para su rendimiento porque la carpeta wp-content está llena de otra carpeta muy sensible, la carpeta de complementos y temas, que incluye toneladas de archivos Javascript y CSS. Es posible que pierda rendimiento cuando no se almacenan en caché como se discutió anteriormente.
Entonces, ¿cómo solucionamos esto? Simplemente incluimos la carpeta wp-content / uploads. ¡Qué solución tan simple!
Por muy sorprendido que esté, la gran mayoría de los complementos que manejan CDN no le permitirán hacer esto. Incluir únicamente esta subcarpeta le indicará a su CDN su carpeta de carga, es decir, solo sus imágenes.
Una simple actualización del sitio permitirá que la CDN obtenga el contenido por usted. En este ejemplo, abrimos una pestaña de desarrollador de Firefox (F12) y buscamos la primera imagen. ¡Puede ver claramente que el enlace fue reemplazado y ahora se está cargando directamente desde la CDN en lugar de nuestro servidor host!
Antes y después de
¡Veamos cómo resultó todo esto!
En la pantalla de la izquierda, podemos ver el tiempo que lleva cargar el sitio desde Suecia (que está muy lejos de nuestro servidor host en Las Vegas, ¿recuerdas?) En la pantalla de la derecha, podemos ver que el rendimiento aumentó, el tiempo fue casi cortado a la mitad! Todos los archivos esenciales todavía se están cargando desde nuestro servidor en Las Vegas, pero los archivos de gran carga, como las imágenes, se están cargando desde el nodo en Suecia.
Terminando
Con suerte, aprendió una forma poderosa de implementar una CDN en su sitio de WordPress. Algunas técnicas no son intrusivas, como los archivos CSS y Javascript que son esenciales para la velocidad de carga del sitio. Ahora puede aprovechar todas las ventajas de una CDN y, al mismo tiempo, minimizar sus inconvenientes. Esperamos que pruebe la versión de prueba gratuita de CDN y utilice los consejos de este artículo para ver si puede acelerar su sitio de WordPress. ¡Esperamos que hayas disfrutado del artículo! Como de costumbre, deja cualquier duda o duda en los comentarios a continuación.