Temas del artículo
¿Por qué Eliminar la Query String?
En ésta lucha constante que tenemos los SEO a favor de aliviar la velocidad de carga y el WPO eliminar la query string de archivos CSS y Javascript es uno de los ajustes más frecuentes dentro del contexto de cada tipo de negocio.
Frecuentemente, en webs y CMS tendremos varios ficheros javascript o de hojas de estilo que añaden contenido al código fuente del sitio con parámetros del tipo:
<script type=”text/javascript” src=”http://www.javiermartincrespo.com/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=4.6″></script>
Un añadido que a partir de una “?” (?ver=4.6) que especifica la versión de archivo que se está cargando.
Eliminar la query string de archivos CSS y JavaScript puede mejorar la eficiencia del caché, facilitar la indexación y el rastreo por parte de los motores de búsqueda.
Los navegadores y algunos proxies de caché pueden suelen tratar los archivos de query strings como recursos dinámicos y no almacenarlos en caché de la manera más ágil. Eliminando query string puedes mejorar la capacidad de los navegadores y servidores para almacenar esos archivos en caché.
Además, con un mejor uso del caché se reducen las solicitudes repetidas al servidor disminuyendo la carga del servidor y mejorando el rendimiento general en la web.
¿Ventajas de Eliminar la Query String?
- Eficiencia del caché: Cuando los navegadores y proxies tratan los archivos query strings como recursos dinámicos sin almacenarlos en caché de forma eficaz podemos eliminarlos y reducir tiempo de carga
- Facilidad de indexación: Las URLs sin query strings son más limpias y fáciles de rastrear e indexar.
- Reducción deriesgo de contenido duplicado; eliminando query strings reducimos el riesgo de que el mismo archivo sea accesible mediante múltiples URLs
- Además, un sitio con URLs limpias y bien estructuradas puede ser percibido como de mayor calidad y mejor organizado por parte de los buscadores
¿Entonces… es útil la Query String?
Obviamente, las cadenas de consulta no son simples añadidos sin utilidad ni beneficio; mostrar el control de versiones de archivos es utilizado por los desarrolladores para solucionar problemas de caching.
Por ejemplo, en caso de publicación de nuevas actualizaciones o cambios de style.css (de ?ver=4.5 a ?ver=4.6)… de esta forma, será tratada como una URL completamente nueva y no será cacheada.
Como ya he señalado, el problema viene cuando los servidores y proxy ralentizan el guardado en cache de cadenas de consulta, sobretodo en plataformas como WordPress donde este tipo de ficheros no se guardan en la caché del navegador y hacen que el usuario se los tenga que descargar en cada consulta.
¿Cómo Eliminar la Query String de archivos CSS y Javascript?
Para eliminar la interrogación (“?”) y cualquier cadena de consulta adjunta en los ficheros CSS y JS en WordPress, puedes hacerlo agregando un filtro en el archivo functions.php.
Tan sólo cuatro pasos:
- Accede a tu servidor utilizando un cliente FTP como FileZilla o accediendo directamente al panel de control de hosting y usando el administrador de archivos.
- Abre el archivo functions.php, que se encuentra en el directorio de tu tema, normalmente en wp-content/themes/tu-tema/functions.php.
- Añade el siguiente código:
// Elimina la cadena de consulta de los archivos CSS y JS
function remove_cssjs_ver( $src ) {
if( strpos( $src, ‘?ver=’ ) )
$src = remove_query_arg( ‘ver’, $src );
return $src;
}
add_filter( ‘style_loader_src’, ‘remove_cssjs_ver’, 10, 2 );
add_filter( ‘script_loader_src’, ‘remove_cssjs_ver’, 10, 2 );
( Lo que hacemos añadiendo el código es definir una función “remove_cssjs_ver” sobre la URL del recurso ($src) verificando si contiene una cadena de consulta (?ver=) y eliminándola usando remove_query_arg )
Si prefieres tirar de plugin, Perfmatters es una muy buena opción y alternativa al uso de código que de forma directa permite eliminar cadenas de consulta de recursos estáticos…
¡Voy preparando un post para hacerlo!