غیرفعال کردن اسکریپت‌ و استایل های اضافی در وردپرس

در وردپرس، بسیاری از افزونه‌ها و قالب‌ها اسکریپت‌ها (JS) و استایل‌ها (CSS) را به‌صورت خودکار بارگذاری می‌کنند، حتی اگر در تمام صفحات مورد نیاز نباشند. این موضوع باعث افزایش زمان بارگذاری سایت، افزایش درخواست‌های HTTP و کاهش سرعت وب‌سایت می‌شود. با غیرفعال کردن فایل‌های اضافی و بهینه‌سازی بارگذاری منابع، می‌توان عملکرد سایت را به‌طور چشمگیری بهبود داد.

چرا باید اسکریپت‌ها و استایل‌های اضافی را غیرفعال کنیم؟

افزونه‌ها معمولاً فایل‌های جاوااسکریپت و CSS خود را در تمام صفحات بارگذاری می‌کنند. به عنوان مثال، افزونه Contact Form 7 حتی در صفحاتی که هیچ فرم تماسی وجود ندارد، فایل‌های خود را لود می‌کند. این کار باعث افزایش زمان لود و کاهش امتیاز سئو می‌شود.

• کاهش تعداد درخواست‌های HTTP
• بهبود زمان بارگذاری صفحات (Page Load Time)
• افزایش امتیاز سئو در ابزارهایی مانند PageSpeed Insights
• بهبود تجربه کاربری (UX)

روش شناسایی اسکریپت‌ها و استایل‌های اضافی

برای شناسایی فایل‌های اضافی، می‌توانید از ابزارهای زیر استفاده کنید:

• Inspect Element مرورگر (در تب Network فایل‌های CSS و JS را ببینید)
• افزونه‌هایی مانند Query Monitor برای نمایش تمام اسکریپت‌ها و استایل‌های لودشده
• ابزارهای آنالیز سرعت مانند GTmetrix و PageSpeed Insights

غیرفعال کردن اسکریپت‌ها و استایل‌ها در functions.php

برای مدیریت فایل‌های اضافی، باید از توابع داخلی وردپرس مانند wp_dequeue_script() و wp_dequeue_style() استفاده کنید. این توابع اجازه می‌دهند فایل‌های خاصی را از صف بارگذاری حذف کنید.

مثال پایه برای حذف فایل‌ها

function remove_extra_assets() {
    wp_dequeue_style('contact-form-7');
    wp_dequeue_script('contact-form-7');
}
add_action('wp_enqueue_scripts', 'remove_extra_assets', 100);

در این مثال، استایل و اسکریپت افزونه Contact Form 7 از بارگذاری در کل سایت جلوگیری می‌کند. عدد 100 اولویت اجرا را مشخص می‌کند تا این تابع بعد از بارگذاری افزونه‌ها اجرا شود.

غیرفعال‌سازی هوشمند در صفحات خاص

به‌جای حذف کامل، بهتر است فایل‌ها فقط در صفحات خاص فعال شوند. برای مثال، فایل‌های فرم تماس فقط در برگه تماس سایت بارگذاری شوند:

function optimize_cf7_scripts() {
    if (!is_page('contact')) {
        wp_dequeue_script('contact-form-7');
        wp_dequeue_style('contact-form-7');
    }
}
add_action('wp_enqueue_scripts', 'optimize_cf7_scripts', 100);

در این کد، تابع is_page('contact') بررسی می‌کند که آیا کاربر در صفحه «تماس با ما» است یا خیر. اگر نباشد، اسکریپت‌های مربوطه حذف می‌شوند.

غیرفعال کردن اسکریپت‌های بلوک گوتنبرگ

وردپرس به‌صورت پیش‌فرض اسکریپت‌ها و استایل‌های ویرایشگر بلوک (Gutenberg) را در سمت کاربر بارگذاری می‌کند. اگر از گوتنبرگ استفاده نمی‌کنید، می‌توانید آن‌ها را حذف کنید:

function disable_gutenberg_assets() {
    wp_dequeue_style('wp-block-library');
    wp_dequeue_style('wp-block-library-theme');
    wp_dequeue_style('wc-blocks-style'); // برای ووکامرس
}
add_action('wp_enqueue_scripts', 'disable_gutenberg_assets', 100);

با این روش، فایل‌های مربوط به بلوک‌ها در سمت فرانت‌اند لود نمی‌شوند و حجم صفحه کاهش می‌یابد.

غیرفعال کردن استایل‌ها و اسکریپت‌های ووکامرس

افزونه WooCommerce نیز فایل‌های زیادی در تمام صفحات بارگذاری می‌کند. اما در بیشتر مواقع فقط صفحات فروشگاه، سبد خرید و پرداخت به این فایل‌ها نیاز دارند. برای حذف آن‌ها در سایر صفحات می‌توانید از کد زیر استفاده کنید:

function optimize_woocommerce_assets() {
    if (function_exists('is_woocommerce')) {
        if (!is_woocommerce() && !is_cart() && !is_checkout()) {
            wp_dequeue_style('woocommerce-general');
            wp_dequeue_style('woocommerce-layout');
            wp_dequeue_style('woocommerce-smallscreen');
            wp_dequeue_script('wc-cart-fragments');
        }
    }
}
add_action('wp_enqueue_scripts', 'optimize_woocommerce_assets', 100);

در این کد با استفاده از توابع شرطی is_woocommerce()، is_cart() و is_checkout() بررسی می‌شود که آیا کاربر در یکی از صفحات مرتبط با فروشگاه است یا خیر. در صورت نبود، فایل‌های ووکامرس حذف می‌شوند.

بهینه‌سازی پیشرفته با dequeue و deregister

تفاوت wp_dequeue_script() با wp_deregister_script() در این است که اولی فقط فایل را از صف بارگذاری حذف می‌کند، اما دومی کل ثبت آن در وردپرس را از بین می‌برد. ترکیب این دو در برخی موارد مفید است:

function remove_unused_scripts() {
    wp_dequeue_script('jquery-migrate');
    wp_deregister_script('jquery-migrate');
}
add_action('wp_default_scripts', 'remove_unused_scripts');

این کد اسکریپت jquery-migrate را حذف می‌کند، که اغلب در سایت‌های مدرن ضروری نیست.

استفاده از افزونه‌ها برای حذف اسکریپت‌های اضافی

اگر با کدنویسی راحت نیستید، می‌توانید از افزونه‌هایی برای مدیریت منابع استفاده کنید:

نکات بهینه‌سازی نهایی

• قبل از حذف هر فایل، بررسی کنید که آیا سایت بدون آن به درستی کار می‌کند یا نه.
• برای سایت‌های بزرگ از افزونه‌های تست سرعت مانند GTmetrix استفاده کنید.
• می‌توانید از ترکیب Lazy Loading و Minify برای بهینه‌سازی بیشتر بهره ببرید.
• همیشه تغییرات را در محیط آزمایشی (Staging) انجام دهید، نه در سایت اصلی.

غیرفعال کردن اسکریپت‌ها و استایل‌های اضافی در وردپرس یکی از مهم‌ترین روش‌های بهینه‌سازی سرعت سایت است. با چند خط کد در فایل functions.php یا با استفاده از افزونه‌های مدیریت منابع، می‌توان سرعت سایت، امتیاز سئو و تجربه کاربری را بهبود داد. هدف نهایی این است که فقط منابعی که واقعاً مورد نیازند در هر صفحه بارگذاری شوند.

لطفاً از کمبود ها و مشکلات این محتوا برای ما بنویسید

ارسال