Cách xóa Dashicons trong WordPress (dashicons.min.css)

Dashicons là bộ phông chữ biểu tượng (icon font) mặc định được tích hợp sâu vào hệ thống lõi của WordPress kể từ phiên bản 3.8. Nó đóng vai trò tạo nên hệ thống icon đẹp mắt trong trang quản trị (Admin Dashboard) mà bạn vẫn thấy hàng ngày.

Tuy nhiên, vấn đề phát sinh ở mặt tiền (Frontend) của website. Rất nhiều Theme và Plugin (thậm chí là những plugin phổ biến) có thói quen “tiện tay” gọi luôn file dashicons.min.css ra ngoài Frontend để sử dụng chỉ 1-2 icon con con, hoặc đôi khi họ chèn vào mà chẳng để làm gì cả.

Nếu website của bạn sử dụng bộ icon khác (như Font Awesome, SVG Icons, hay IcoMoon) nhưng file Dashicons vẫn bị load ngầm, thì bạn đang vô tình lãng phí một lượng tài nguyên không hề nhỏ. Bài viết này sẽ hướng dẫn bạn cách kiểm tra và “tiêu diệt” gọn gàng Dashicons ở Frontend để giúp website nhẹ nhàng và tăng tốc độ tải trang trong năm 2026.

Dashicons ảnh hưởng đến tốc độ load website như thế nào?

Khi bị load ra ngoài Frontend, thư viện Dashicons thường kéo theo một file CSS và các tệp định dạng font chữ (woff/woff2), tiêu tốn tổng cộng khoảng 80KB – 90KB dung lượng tải về.

90KB nghe có vẻ nhỏ, nhưng nó là 90KB tài nguyên chặn hiển thị (Render-blocking). Trình duyệt phải dừng việc vẽ giao diện lại để ưu tiên tải và phân tích xong cái file CSS này. Nếu mạng của người dùng chậm, 90KB này có thể làm tăng độ trễ FCP (First Contentful Paint) lên đáng kể.

Làm sao để biết website có đang lãng phí Dashicons hay không?

Để biết chắc chắn website của bạn có thực sự sử dụng Dashicons để hiển thị hay không, hãy sử dụng tính năng Coverage trong Chrome DevTools. Đây là công cụ đo đạc mức độ lãng phí mã nguồn “đỉnh” nhất hiện nay.

1. Mở trang web của bạn trên Google Chrome bằng chế độ Ẩn danh.
2. Nhấn F12 để mở DevTools.
3. Bấm phím tắt Ctrl + Shift + P, gõ chữ “Coverage” và chọn “Show Coverage”.
4. Bấm nút Reload (Refresh) hình tròn trong tab Coverage để hệ thống bắt đầu đo lường.

Nếu bạn nhìn thấy file dashicons.min.css xuất hiện trong danh sách và cột Unused Bytes (Màu đỏ) hiển thị mức lãng phí lên tới 98% – 100%, thì xin chúc mừng, bạn đang tải một thứ vô dụng! Đã đến lúc tiễn nó đi.

Đoạn code tắt hoàn toàn Dashicons ở Frontend

Chúng ta sẽ sử dụng một hàm nhỏ để chỉ xóa Dashicons ở mặt ngoài (Frontend) với những khách không đăng nhập. Còn trong trang quản trị (wp-admin) hoặc lúc bạn đang đăng nhập, Dashicons vẫn hoạt động bình thường để giữ nguyên giao diện chuẩn của WordPress.

Bạn hãy copy đoạn code dưới đây và dán vào file functions.php của giao diện đang kích hoạt (Nên dùng Child Theme):

/**
 * Vô hiệu hóa Dashicons ở Frontend cho khách chưa đăng nhập (Cập nhật 2026)
 */
add_action( 'wp_enqueue_scripts', 'wptangtoc_disable_dashicons', 100 );

function wptangtoc_disable_dashicons() {
    // Nếu người dùng chưa đăng nhập, tiến hành gỡ bỏ Dashicons
    if ( ! is_user_logged_in() ) {
        wp_dequeue_style( 'dashicons' );
        wp_deregister_style( 'dashicons' );
    }
}

(Ghi chú: Mình để mức ưu tiên priority là 100 nhằm đảm bảo lệnh gỡ bỏ này sẽ chạy sau cùng, đè lên các lệnh gọi Dashicons của các plugin khác).

Tổng kết

Chỉ với một thủ thuật nhỏ, bạn đã giúp website giảm tải được 90KB dữ liệu vô ích. Tích tiểu thành đại, tối ưu tốc độ website là quá trình cắt gọt từng kilobyte thừa thãi để mang lại thời gian hiển thị (TTFB & FCP) chớp nhoáng nhất cho người dùng.

Nếu website của bạn thực sự đang dùng 1-2 cái icon của Dashicons ở Frontend, giải pháp tuyệt vời nhất trong năm 2026 là: Gỡ bỏ Dashicons như hướng dẫn trên, và thay thế các icon đó bằng mã SVG (Inline SVG). Mã SVG hiển thị siêu nét, load ngay lập tức mà không cần tải bất kỳ file CSS/Font nào cả!