La página es lenta y PageSpeed Insights señala silenciosamente a dashicons.min.css, 30 KB de iconos que no se renderizan en ningún elemento visible. Usted no instaló este archivo ni lo encoló en su tema, sin embargo se carga fielmente para cada visitante. ¿De dónde viene y cómo se deshace de él?

WordPress envía dashicons al frontend por defecto con un único propósito limitado: la barra de administración para usuarios conectados. Un visitante normal nunca ve la barra de administración, pero el navegador descarga obedientemente el CSS, lo analiza, construye el CSSOM y solo entonces se da cuenta de que no se necesitaba ni una sola clase. En una conexión móvil lenta, esos 30 KB se traducen en 300-400 ms adicionales de tiempo de carga bloqueante para el renderizado, suficiente para perjudicar sus Core Web Vitals.

A continuación, tres formas de desactivar dashicons: desde un fragmento de código manual hasta una simple casilla de verificación en un plugin de optimización. Todos los métodos son seguros, reversibles y están probados en instalaciones reales de WordPress.

💡 Resumen rápido:

• Abra DevTools o PageSpeed Insights y confirme que dashicons.min.css se está cargando realmente en su sitio
• Elija el enfoque que se adapte a su flujo de trabajo: código en functions.php o un plugin de optimización ya preparado
• Vuelva a probar el rendimiento y verifique que el archivo ha desaparecido del informe
• Asegúrese de que la barra de administración sigue funcionando sin errores para los administradores

Qué son los dashicons y por qué se cargan en el frontend

Los dashicons son la fuente de iconos integrada de WordPress, introducida en la versión 3.8. Dentro del panel de administración aparecen por todas partes: iconos de secciones del menú, iconos de tipos de contenido, botones de la barra de herramientas. Sin dashicons, el área de administración se convierte en texto plano y WordPress no puede prescindir de ellos.

El problema radica en el mecanismo de registro. El núcleo registra los estilos dashicons globalmente y los añade a la cola no solo para el área de administración, sino también para el frontend, todo para un único escenario: un usuario conectado visita el sitio y ve la franja negra de la barra de administración con iconos. Los visitantes no reciben la barra de administración, pero sí reciben el archivo CSS. El navegador lo analiza, descubre que ningún selector coincidió y descarta el resultado, pero el tiempo ya se ha gastado.

PageSpeed Insights y GTmetrix señalan dashicons.min.css en la recomendación «Eliminar CSS no utilizado» y restan puntos. Un solo archivo como este parece menor. Pero cuando los estilos de emoji de WordPress, el CSS de plugins no utilizados y los bloques de temas muertos se acumulan encima, el ahorro combinado alcanza los 150-300 KB. Para el rendimiento móvil, eso importa.

Cómo comprobar si los dashicons se cargan en su sitio

Antes de desactivar nada, confirme que el problema existe. Tres métodos, cada uno en menos de un minuto.

Chrome DevTools. Abra el sitio en modo incógnito (para que la barra de administración no afecte la prueba), pulse F12, vaya a la pestaña Red y escriba dashicons en el campo de filtro. Si ve un archivo con estado 200 y un tamaño de alrededor de 30 KB, se carga para cada visitante.

PageSpeed Insights. Pegue la URL en pagespeed.web.dev y ejecute la prueba. Expanda la recomendación «Eliminar CSS no utilizado»; dashicons.min.css aparecerá listado con su tamaño y el ahorro potencial en kilobytes.

GTmetrix. Vaya a la pestaña Waterfall y filtre por dashicons. Incluso si el archivo en la cadena de carga está marcado como «Low» o «Lowest», sigue bloqueando el renderizado y perjudica su puntuación.

¿Ninguno de estos métodos mostró el archivo? Su tema o un plugin de optimización ya ha desactivado los dashicons y puede cerrar este artículo. ¿Lo encontró? Continuemos.

Método 1: desactivar mediante código en functions.php

El enfoque más ligero y transparente: un único fragmento de código en el functions.php de su tema activo. El código elimina el registro de dashicons para todos los visitantes sin privilegios de administrador. Para quienes administran el sitio los dejamos intactos, y la barra de administración dentro del escritorio permanece sin cambios.

Añada este código al functions.php de un tema hijo o mediante el plugin Code Snippets (más seguro porque sobrevive a los cambios de tema):

1
/**
2
 * Disable dashicons.min.css on the frontend for everyone,
3
 * except users with administrator rights.
4
 */
5
function sdstudio_disable_dashicons_frontend() {
6
    if ( current_user_can( 'update_core' ) ) {
7
        return;
8
    }
9
    wp_deregister_style( 'dashicons' );
10
}
11
add_action( 'wp_enqueue_scripts', 'sdstudio_disable_dashicons_frontend' );

El hook wp_enqueue_scripts se activa cuando la cola de estilos se ensambla en el frontend. current_user_can('update_core') verifica la capacidad de actualizar el núcleo, que por defecto pertenece solo a los administradores. Para los visitantes normales, la verificación falla y wp_deregister_style('dashicons') elimina el archivo de la cola por completo.

¿Por qué deregister en lugar de dequeue? wp_dequeue_style elimina el estilo de la cola pero lo deja registrado; otro plugin podría volver a añadir dashicons a la salida. wp_deregister_style elimina el registro por completo, y la única forma de recuperar el archivo es una llamada explícita a wp_register_style. Para dashicons, esta es la opción correcta: no querrá que un plugin de redes sociales o de galería los restaure accidentalmente en el frontend.

Precauciones. Un error en functions.php puede dejar el sitio en pantalla blanca. Antes de editar, copie el archivo a functions.php.bak para una reversión rápida. Use un tema hijo o Code Snippets. Revise la sintaxis: cada corchete y punto y coma en su lugar.

Método 2: plugins de optimización (una casilla en lugar de código)

Si prefiere no tocar PHP, los plugins de rendimiento resuelven el mismo problema.

Perfmatters. En General → Opciones encontrará un interruptor «Disable Dashicons». Un clic y el archivo desaparece del frontend. Perfmatters también excluye los dashicons del CSS utilizado cuando «Remove Unused CSS» está activo, por lo que el problema se cubre por partida doble. El plugin es de pago, pero aborda docenas de otros cuellos de botella de rendimiento, desde desactivar estilos de emoji hasta controlar la API de heartbeat.

WP Rocket. En Optimización de archivos → Optimizar la entrega de CSS, active «Remove Unused CSS». WP Rocket analizará sus páginas y eliminará los estilos no utilizados, incluido dashicons.min.css. Funciona automáticamente en todo el sitio. Si «Remove Unused CSS» entra en conflicto con otra optimización, añada dashicons.min.css a la lista de exclusión; WP Rocket diferirá su carga en lugar de eliminarlo por completo.

Asset CleanUp (gratuito). El plugin Asset CleanUp le permite desactivar selectivamente CSS y JS a nivel de páginas individuales y tipos de contenido. Vaya a CSS/JS Manager, busque dashicons.min.css y descárguelo en todo el sitio. La versión gratuita gestiona la limpieza básica.

¿Qué método debería elegir? Si ya usa Perfmatters o WP Rocket, utilice la función integrada; no acumule código extra en functions.php. Si su sitio funciona con un conjunto mínimo de plugins y se siente cómodo con PHP, el fragmento del método 1 es más ligero y no añade dependencias.

Verifique el resultado

Después de desactivar los dashicons, abra el sitio en modo incógnito y repita la comprobación de la sección dos. El archivo dashicons.min.css debería haber desaparecido de la lista de recursos cargados en DevTools. Ejecute una nueva prueba de PageSpeed Insights; la métrica «Eliminar CSS no utilizado» disminuirá y el ahorro potencial de tráfico aumentará en esos 30 KB.

La ganancia real en puntos depende de su stack. En sitios ligeros con solo uno o dos problemas de CSS, desactivar dashicons añade de 1 a 3 puntos a la puntuación móvil de PageSpeed. En sitios sobrecargados con docenas de estilos no utilizados, es una gota en el océano, pero una gota correcta: cada kilobyte cuenta, y esas «gotas» se suman para lograr un resultado notable.

Asegúrese de revisar la barra de administración: inicie sesión como administrador y confirme que la franja negra en la parte superior se muestra normalmente y que sus iconos están en su lugar. El código del método 1 y el interruptor en Perfmatters dejan los dashicons intactos para los administradores, por lo que no notará ninguna diferencia.

⁉️🤔 Preguntas frecuentes

¿Desactivar dashicons afectará la apariencia del sitio?

Si su tema usa dashicons para los iconos del frontend (flechas de slider, botones de cierre, menú hamburguesa), desactivarlos romperá esos elementos. La prueba es simple: desactive el archivo y recorra las páginas. Si los iconos desaparecen, el tema depende de dashicons. En ese caso, use almacenamiento en caché agresivo mediante Cloudflare o un plugin de caché: 30 KB servidos desde la caché del navegador no son críticos.

¿Funciona este método con temas de bloques (FSE)?

En temas de bloques como Twenty Twenty-Four, Ollie y similares, los dashicons normalmente no se cargan en el frontend. El editor de bloques usa sus propios iconos SVG y el núcleo no encola la fuente de iconos para los visitantes. Compruébelo mediante DevTools: lo más probable es que el archivo no esté allí. Si lo encuentra, el código del método 1 funciona igual para temas clásicos y de bloques.

¿Puedo desactivar dashicons solo para ciertas páginas?

Sí, usando las etiquetas condicionales de WordPress. Por ejemplo, para mantener dashicons solo en la página de inicio:

1
function sdstudio_conditional_dashicons() {
2
    if ( is_front_page() ) {
3
        return;
4
    }
5
    if ( current_user_can( 'update_core' ) ) {
6
        return;
7
    }
8
    wp_deregister_style( 'dashicons' );
9
}
10
add_action( 'wp_enqueue_scripts', 'sdstudio_conditional_dashicons' );

Todas las etiquetas condicionales disponibles se describen en la documentación de WordPress. Incluyen is_single para entradas individuales, is_page para páginas, is_archive para archivos e is_home para el índice del blog.

Ya tengo un plugin de caché que acelera el sitio. ¿Debería desactivar dashicons igualmente?

Un plugin de caché acelera las visitas repetidas, pero la primera visita en frío sigue descargando dashicons.min.css. PageSpeed Insights emula una caché limpia en cada prueba, por lo que el archivo aparecerá en el informe independientemente del almacenamiento en caché del lado del servidor. Desactivar dashicons reduce los datos transferidos a nivel de origen; tanto las métricas como los visitantes reales en su primera visita se benefician.

¿Es suficiente con desactivar dashicons para obtener una buena puntuación en PageSpeed?

No, es solo un paso entre docenas. Las mayores ganancias suelen provenir de la optimización de imágenes (compresión, formatos modernos, carga diferida), la carga diferida de JavaScript y el almacenamiento en caché del lado del servidor. Piense en desactivar dashicons como higiene básica: rápida, segura y con un efecto medible. Es un punto de partida conveniente para limpiar el frontend.

Qué método elegir según su situación

Un resumen rápido de los tres métodos y escenarios específicos.

Si trabaja con código y su sitio funciona con un stack ligero, tome el fragmento del método 1. Dos minutos para pegarlo en functions.php o Code Snippets, y el problema queda resuelto para siempre. Sin plugins adicionales, sin carga extra en el área de administración.

Si ya paga por Perfmatters o WP Rocket, active la opción integrada y no cree entidades adicionales. Estos plugins resuelven otra docena de problemas de rendimiento a la vez, y el código adicional en el tema solo complica el mantenimiento.

Si necesita una herramienta gratuita sin editar PHP, Asset CleanUp gestiona la tarea en dos clics. Es adecuado para principiantes y para quienes prefieren no arriesgarse a romper functions.php.

El principio general: los dashicons no hacen que un sitio sea lento por sí mismos. Pero son parte del ruido de fondo que, combinado con estilos de plugins no utilizados, fuentes pesadas e imágenes no optimizadas, obstruye el canal y ralentiza el renderizado. Eliminar dashicons es una victoria rápida y un punto de partida conveniente para una optimización sistemática.

¿Los ha desactivado? Deje un comentario y comparta cuántos puntos de PageSpeed ha ganado. Si conoce otro método no cubierto en este artículo, compártalo también.