وردپرس 6.8 قابلیتی بسیار پرتقاضا یعنی بارگذاری حدسی (Speculative Loading) را معرفی کرد اما بارگذاری حدسی دقیقاً چیست و چگونه روی وب سایت شما تأثیر می گذارد؟
به‌بیان ساده و خصوصا در وردپرس، Speculative Loading قابلیتی است که باعث می‌شود وب‌سایت سریع‌تر به نظر برسد. در این روش، سیستم پیش‌بینی می‌کند که کاربر احتمالاً کدام صفحه (یا صفحات) را در ادامه مشاهده خواهد کرد و آنها را از پیش بارگذاری (preload) می‌نماید. طی این مقاله، هر آنچه که باید درباره بارگذاری حدسی بدانید، به ویژه در رابطه با وردپرس، بررسی خواهد شد.
تصویر(1)
بارگذاری حدسی (Speculative Loading) چیست؟
بارگذاری حدسی تکنیکی است که در آن مرورگر منابعی مانند تصاویر، اسکریپت ها، فونت ها و حتی صفحات کامل را قبل از آنکه کاربر به طور مستقیم درخواست نماید، بارگذاری می کند. این اقدام بر پایه پیش‌بینی‌هایی انجام می‌شود که نشان می‌دهند کاربر به احتمال زیاد کدام صفحات را در ادامه مشاهده خواهد کرد یا از راهنمایی‌هایی که در کد درج شده، استفاده می کند. این تکنیک می تواند شامل جستجوی DNS، واکشی منابع یا حتی رندر کردن فایل ها در پس زمینه باشد.
پیش بینی ها می توانند توسط توسعه دهندگان تنظیم گردند یا از طریق الگوریتم ها و الگوهای رفتاری در مرورگر، مانند تاریخچه بازدید کاربر، تشخیص داده شوند. اگر این روش به درستی عمل کند، می تواند موجب شود صفحات شما به طور محسوسی سریع تر بارگذاری شوند.
اگر از Google Fonts استفاده می کنید، احتمالاً کدی مشابه نمونه زیر را در تگ <head> سایت خود مشاهده کرده اید:
<link rel='dns-prefetch' href='//fonts.googleapis.com' />
این کد که توسط تابع ()wp_resource_hints در هسته وردپرس اضافه می شود، به مرورگر اعلام می کند تا پیشاپیش جستجوی DNS را برای API فونت های گوگل انجام دهد. در نتیجه، وقتی فونت واقعاً نیاز باشد، سریع تر بارگذاری می شود زیرا مرحله جستجوی DNS قبلاً انجام شده است.
هر بار که یک صفحه در وردپرس بارگذاری می شود، این پلتفرم منابع صف‌‌بندی شده (enqueued) را بررسی می کند و اگر منابعی از دامنه های خارجی (مثل Google Fonts) شناسایی شود، تگ های مناسب dns-prefetch یا preconnect را اضافه خواهد کرد.
این مورد تنها یک مثال ساده است اما بارگذاری حدسی فراتر می رود. شما می توانید به مرورگر بگویید که کل یک URL را prefetch یا prerender کند. این قابلیت در نسخه ۶.۸ وردپرس معرفی شده است.
بارگذاری حدسی (Speculative Loading) در وردپرس
تصویر(2)
در اطلاعیه انتشار نسخه ۶.۸ وردپرس، بارگذاری حدسی به عنوان یک قابلیت جدید معرفی شد. البته چنین قابلیتی پیش تر از طریق Resource Hints API نیز وجود داشت اما تفاوت نسخه جدید این است که وردپرس اکنون از Speculation Rules API برای پیش بارگذاری واقعی و کامل آدرس های URL استفاده می کند. این ویژگی با استفاده از Speculation Rules API، صفحات کامل را بر اساس پیش بینی صفحه بعدی موردنظر کاربر، پیش‌بارگذاری می کند.
برای مثال، فرض کنید کاربری وارد صفحه اصلی سایت شما می شود. وردپرس ممکن است پیش بینی کند که کاربر روی لینک «بلاگ» کلیک خواهد کرد. در حالی که کاربر همچنان درون صفحه اصلی حضور دارد، وردپرس در پس زمینه شروع به بارگذاری صفحه بلاگ می کند. بنابراین، وقتی کاربر روی لینک کلیک می نماید، صفحه تقریباً بلافاصله نمایش داده می شود.
Speculation Rules API چیست؟
بر اساس مستندات Speculation Rules API، این قابلیت یک ساختار انعطاف‌پذیر برای تعریف لینک هایی است که می توان آنها را به صورت احتمالی و قبل از پیمایش (navigation) آماده کرد. به جای اینکه مرورگر تمام موارد را حدس بزند، توسعه دهندگان می توانند کدی به سایت اضافه کنند که صراحتاً به مرورگر اعلام نماید:
«احتمال دارد کاربر به زودی روی این لینک کلیک کند، پس از همین حالا شروع به آماده سازی آن صفحه در پس زمینه کن.»
برای استفاده از Speculation Rules API، فقط کافی است کمی کد JSON به سایت خود اضافه کنید که در آن قوانینی برای مرورگر تعریف شده است. این API خودش در مرورگر وجود دارد و نیاز به بارگذاری جداگانه ای از سمت سایت شما ندارد.
استراتژی‌ها
در Speculation Rules API، دو استراتژی اصلی وجود دارد که می توانید به کار ببرید:
۱. Prefetch (پیش بارگذاری)
- فقط HTML صفحه مقصد را دانلود می کند.
- مرورگر صفحه را رندر یا اجرا نمی کند بلکه آن را برای دسترسی سریع تر، در حافظه ذخیره می کند.
- مناسب برای پیش بینی هایی با احتمال متوسط است (یعنی زمانی که ممکن است کاربر روی لینکی کلیک کند اما قطعیت وجود ندارد).
۲. Prerender (پیش نمایش کامل)
- صفحه هدف را به طور کامل در پس زمینه بارگذاری و رندر می کند.
- صفحه کاملاً آماده است و در لحظه کلیک کاربر، فوراً نمایش داده می شود.
- برای پیش بینی هایی با احتمال بالا مناسب است (به دلیل استفاده بیشتر از منابع سرور، باید با احتیاط استفاده شود).
سایت شما می تواند برای هر دو استراتژی قوانینی (rules) را تعریف کند. در حال حاضر، قوانین پیش فرضی که وردپرس اضافه می نماید از استراتژی prefetch استفاده می کنند.
پشتیبانی مرورگرها
تا سال ۲۰۲۵، Speculation Rules API فقط در مرورگرهای مبتنی بر Chromium (مانند Chrome، Edge و Opera) پشتیبانی می شود و هنوز در Firefox یا Safari قابل استفاده نیست.
بنابراین، کاربران سایت شما باید نسخه بروز مرورگرهایی مانند Chrome، Edge یا Opera را استفاده کنند تا بتوانند از این قابلیت بهره مند شوند. البته کدهای مربوطه همچنان در سایت شما وجود خواهند داشت. در مرورگرهایی که از این API پشتیبانی نمی کنند، هیچ خطا یا مشکلی ایجاد نمی شود زیرا این ویژگی نوعی ارتقای تدریجی (progressive enhancement) است و توسط مرورگرهای ناسازگار به سادگی نادیده گرفته می شود.
قوانین پیش‌فرض Speculation در وردپرس
وردپرس به صورت پیش فرض برای کاربران لاگین نشده (logged-out)، قوانین Speculation را اضافه می کند که به شکل زیر هستند:
<script type="speculationrules">
{
"prefetch": [
{
"source": "document",
"where": {
"and": [
{
"href_matches": "/*"
},
{
"not": {
"href_matches": [
"/wp-*.php",
"/wp-admin/*",
"/wp-content/uploads/*",
"/wp-content/*",
"/wp-content/plugins/*",
"/wp-content/themes/twentytwentyfive/*",
"/*\\?(.+)"
]
}
},
{
"not": {
"selector_matches": "a[rel~=\"nofollow\"]"
}
},
{
"not": {
"selector_matches": ".no-prefetch, .no-prefetch a"
}
}
]
},
"eagerness": "conservative"
}
]
}
</script>
شرح کد:
- prefetch: به مرورگر می گوید که HTML صفحه مقصد را پیشاپیش دانلود نماید اما آن را رندر نکند.
- source:"document": به مرورگر اعلام می کند که صفحه HTML فعلی را اسکن کرده و قوانین را روی لینک های موجود در آن اعمال نماید.
- "/*":href_matches: تمام لینک هایی که با لینک های داخلی سایت مطابقت دارند را پیش بارگذاری کند.
- not: فهرست استثنائات است. یعنی لینک هایی که نباید پیش بارگذاری شوند:
- صفحات مدیریت و ورود (admin و login) را حذف می کند.
- لینک های مربوط به افزونه ها (plugins)، آپلودها (uploads) و قالب ها (themes) را نادیده می گیرد تا از پیش بارگذاری رسانه ها و فایل های ثابت جلوگیری شود.
- لینک هایی که دارای query string هستند (مانند: page?foo=bar/) را مستثنی می کند.
- لینک هایی که دارای ویژگی "rel="nofollow هستند را حذف می نماید.
- لینک هایی که دارای کلاس no-prefetch. هستند یا لینک هایی که درون عناصری با این کلاس قرار دارند نیز نادیده گرفته می شوند.
- "eagerness: "conservative: به مرورگر اعلام می نماید که با احتیاط رفتار کند و فقط در صورتی پیش بارگذاری را انجام دهد که اطمینان بیشتری از کلیک احتمالی کاربر داشته باشد (مثلاً وقتی کاربر ماوس را روی لینک می برد). گزینه های دیگر مانند "moderate" یا "eager" رفتار تهاجمی تری دارند.
سفارشی سازی قوانین Speculation وردپرس
از آنجایی که وردپرس نمی داند بازدیدکنندگان چگونه از سایت شما استفاده می کنند، قوانین عمومی را اعمال می کند که برای بیشتر سایت ها کارساز هستند. خوشبختانه با استفاده از چند هوک، می توانید آنها را تا حدی سفارشی سازی کنید.
wp_speculation_rules_configuration (فیلتر)
wp_speculation_rules_href_exclude_paths (فیلتر)
wp_load_speculation_rules (اکشن)
روش تغییر پیکربندی قوانین Speculation
می توانید فیلتر wp_speculation_rules_configuration را برای تنظیم پیکربندی پیش فرض قوانین speculation، از جمله تغییر mode و سطح eagerness استفاده کنید. این فیلتر به شما اجازه می دهد تا قوانین speculation پیش فرض را کاملا غیرفعال نمایید. در لیست زیر یک قطعه کد نمونه ذکر شده که از این فیلتر برای تغییر پیکربندی پیش فرض استفاده می کند:
/**
* Modify the default Speculation Rules configuration in WordPress.
*
* Changes the mode from 'prefetch' to 'prerender' and sets the eagerness to 'moderate'.
*
* @param array $config Existing configuration for speculative loading.
* @return array Modified configuration.
*/
function my_custom_speculation_rules_config( $config ) {
if ( is_array( $config ) ) {
$config['mode'] = 'prerender'; // prerender or prefetch
$config['eagerness'] = 'moderate'; // conservative, moderate, or eager
}
return $config;
}
add_filter( 'wp_speculation_rules_configuration', 'my_custom_speculation_rules_config' );
مستثنا کردن برخی URLهای خاص از بارگذاری حدسی
فیلتر wp_speculation_rules_href_exclude_paths به شما اجازه می دهد فهرستی از الگوهای مسیر URL را تعریف کنید تا از بارگذاری حدسی مستثنا شوند. در ادامه یک قطعه کد نمونه ذکر شده که نشان می دهد چگونه باید یک نوع نوشته خاص را از بارگذاری حدسی مستثنا کنید. این مثال، فرض را بر این قرار داده که شما از پیوندهای یکتای مناسب استفاده می نمایید و آدرس های شما شامل /custom-post-type/ هستند:
/**
* Exclude specific URL paths from speculative loading in WordPress.
*
* @param string[] $exclude_paths Array of regex patterns for paths to exclude.
* @return string[] Modified array of exclude path patterns.
*/
function my_excluded_speculation_paths( $exclude_paths ) {
// Exclude custom paths (e.g., anything starting with /custom-post-type/)
$exclude_paths[] = '/custom-post-type/.*';
return $exclude_paths;
}
add_filter( 'wp_speculation_rules_href_exclude_paths', 'my_excluded_speculation_paths' );
البته نام این فیلتر می توانست واضح تر باشد زیرا این طور به نظر می رسد که باید بتوانید موارد استثنای فعلی را ویرایش کنید اما در واقع فقط امکان اضافه کردن موارد جدید وجود دارد زیرا مقدار پیش فرضی که به فیلتر ارسال می شود یک آرایه خالی است.
اضافه کردن قوانین Speculation جدید
توسط کلاس WP_Speculation_Rules می‌‌توانید از "اکشن هوک" wp_load_speculation_rules برای ویرایش قوانین Speculation هنگام بارگذاری آنها، استفاده کنید. این اکشن هوک به شما اجازه می دهد تا قوانین دلخواه خودتان را اضافه نمائید. در ادامه مثالی آورده شده که نشان می دهد چگونه می توانید یک قانون جدید اضافه کنید:
/**
* Add custom prerender rules for specific URLs using the Speculation Rules API.
*
* @param WP_Speculation_Rules $speculation_rules The rules object provided by WordPress.
*/
function my_add_custom_speculation_rules( $speculation_rules ) {
if ( ! is_a( $speculation_rules, 'WP_Speculation_Rules' ) ) {
return;
}
// Add a custom rule for our "special-offer" page
$speculation_rules->add_rule(
'prerender', // Rule type: either prerender or prefetch
'custom-prerender-rule', // A unique key/ID for this rule
[
'source' => 'list', // 'list' means we are explicitly listing URLs ur 'document' to scan the document for links
'urls' => [
'/black-friday-sale/',
],
'eagerness' => 'eager', // Mode: conservative, moderate, or eager
// Optional metadata
'priority' => 1, // Priority of the rule (1-10) - lower number means higher priority
'referrer_policy' => 'strict-origin-when-cross-origin', // Referrer policy for the request
'options' => [
'allow-credentials' => true, // Whether to send cookies/auth with request
'allow-redirects' => true, // Whether to allow following redirects
],
],
);
}
add_action( 'wp_load_speculation_rules', 'my_add_custom_speculation_rules' );
فرض کنید که شما یک فروش ویژه بزرگ برای بلک فرایدی برگزار کرده اید و انتظار دارید بازدیدکنندگان زیادی روی بنر فروش شما کلیک کنند. در چنین شرایطی، افزودن یک قانون اختصاصی برای این صفحه با اولویت بالاتر و میزان تمایل (eagerness) بیشتر، اقدامی منطقی خواهد بود. مثال بالا نیز دقیقاً همین کار را انجام می دهد.
حذف یا تغییر استثنائات پیش‌فرض
وردپرس سه فیلتر مفید ارائه می دهد که پیش تر درباره آنها صحبت شد تا بتوانید قوانین بارگذاری حدسی را در سایت خود کنترل کنید. با این حال، کلاس WP_Speculation_Rules روش هایی برای تغییر یا حذف قوانین موجود ارائه نمی دهد اما ممکن است در آینده تغییر کند.
به عنوان مثال، اگر بخواهید بارگذاری حدسی برای محتویات پوشه wp-content/ فعال شود، در حال حاضر روشی جهت حذف این مسیر از پارامتر پیش فرض "not" وجود ندارد. اگر نیاز به کنترل کامل قوانین بارگذاری Speculative دارید، بهتر است قوانین داخلی وردپرس را غیرفعال کرده و اسکریپت JSON مخصوص خود را جایگزین کنید.
بررسی فعال بودن بارگذاری حدسی
برای اطمینان از عملکرد بارگذاری حدسی، سایت خود را با ابزارهای توسعه دهنده (developer tools) مرورگر بررسی کنید. در ادامه روش انجام این کار از طریق Chrome توضیح داده خواهد شد:
- مرورگر کروم را باز کرده و به صفحه اصلی وب سایت خود مراجعه نمایید.
- مطمئن شوید که خارج از حساب کاربری خود هستید (بارگذاری حدسی برای کاربران لاگین شده غیرفعال است).
- در بخشی از صفحه کلیک راست کرده و گزینه “Inspect” را انتخاب کنید.
- پس از باز شدن پنل ابزارهای توسعه دهنده، روی تب “Application” کلیک نمایید.
- در سمت راست، زیر بخش “Background Services”، گزینه “Speculative Loads” را مشاهده خواهید کرد.
تصویر(3)
اگر سایت شما به درستی بارگذاری حدسی را اجرا کند، باید قوانین مربوطه را در این قسمت مشاهده کنید. کلیک روی تب “Speculations” تمام URL هایی که قابل پیش بارگذاری هستند را همراه با وضعیت فعلی شان نشان می دهد. به صورت تجربی می توان گفت که وضعیت صفحه فقط با حرکت ماوس روی لینک‌ها تغییر نمی‌کند اما کلیک روی لینک موجب آغاز پیش بارگذاری می شود.
وردپرس در بارگذاری حدسی رویکرد محافظه کارانه‌‌تری دارد، بنابراین تغییر تنظیمات برای افزایش سطح تمایل در زمان تست، می تواند مفید باشد.
مشکلات و نگرانی ها درباره بارگذاری حدسی
وردپرس به صورت پیش فرض بارگذاری حدسی را روی تمام سایت ها فعال می کند اما راه ساده ای برای غیرفعال کردن آن از طریق پنل مدیریت ارائه نمی دهد. اینطور به نظر می رسد که اگر وردپرس این قابلیت را روشن کرده، یعنی به آن نیاز خواهید داشت. اما بارگذاری Speculative معایبی هم دارد. در ادامه به توضیح معایب بارگذاری حدسی پرداخته شده است تا بتوانید تصمیم بگیرید که آیا می خواهید این قابلیت را روی سایت خود غیرفعال کنید یا خیر.
1. استفاده غیر ضروری از سرور
این موضوع احتمالاً بزرگ ترین نگرانی برای اکثر کاربران وردپرس می باشد. سرور شما ممکن است درخواست هایی برای صفحاتی دریافت کند که کاربران هرگز به آنها مراجعه نمی کنند. در سایت های پر بازدید، این موضوع می تواند مصرف منابع را افزایش داده و روی عملکرد و هزینه های میزبانی تأثیر بگذارد. از آنجا که بارگذاری حدسی بر اساس پیش بینی ها انجام می شود، ممکن است باعث ارسال درخواست برای صفحاتی شود که کاربران هرگز بازدید نمی کنند.
2. امکان ارائه محتوای قدیمی
اگر سایت شما به‌طور مکرر بروزرسانی می شود، بارگذاری حدسی ممکن است محتوای قدیمی را ارائه دهد. برای مثال یک سایت خبری با محتوای لحظه ای ممکن است در پیش بارگذاری مقالاتی که بروزرسانی می شوند، دچار مشکل شود. اگر کاربر روی یک مقاله پیش بارگذاری شده کلیک کند، ممکن است به جای نسخه بروز شده مقاله، نسخه قدیمی آن را مشاهده نمایند.
3. پشتیبانی مرورگر
بارگذاری حدسی در مرورگرهای Safari یا Firefox کار نمی کند. این موضوع دلیلی برای غیرفعال کردن آن نیست اما یک نکته منفی محسوب می شود. اگر بیشتر کاربران شما از این مرورگرها استفاده می کنند، از بارگذاری حدسی بهره مند نخواهند شد.
4. احتمال تداخل با افزونه ها
برخی افزونه ها به اسکریپت هایی وابسته اند که فقط پس از بارگذاری کامل صفحه اجرا می شوند. بارگذاری حدسی ممکن است با این افزونه ها تداخل داشته باشد. از آنجا که بارگذاری Speculative جزء هسته وردپرس است، توسعه دهندگان باید افزونه های خود را بروزرسانی کنند تا در صورت نیاز، بارگذاری حدسی را به درستی کنار بگذارند.
ممکن است مدتی زمان ببرد تا توسعه دهندگان افزونه ها با ویژگی های جدید هسته وردپرس هماهنگ شوند و رفع اشکال انجام دهند. اگر افزونه ای موجب بروز مشکل شد، ممکن است نیاز باشد موقتا بارگذاری حدسی را غیرفعال کنید تا پشتیبانی کامل فراهم شود.
روش غیرفعال کردن بارگذاری حدسی در وردپرس
اگر بارگذاری حدسی برای سایت شما مناسب نیست، می توانید به راحتی آن را غیرفعال کنید. اگرچه وردپرس گزینه ساده ای در پنل مدیریت برای این کار ندارد اما با افزودن کد زیر می توانید آن را غیرفعال نمایید:
// غیرفعال کردن کامل بارگذاری حدسی
add_filter( 'wp_speculation_rules_configuration', '__return_null' );
این کد را در فایل functions.php قالب فرزند (child theme) خود قرار دهید یا از افزونه هایی مانند Code Snippets استفاده کنید.
جمع بندی
بارگذاری حدسی در وردپرس برای بهبود عملکرد طراحی شده است. در بسیاری از موارد، این قابلیت ارزشمند است اما معایبی نیز دارد، مخصوصاً برای سایت های پر ترافیک، محتوای لحظه ای یا سایت هایی که افزونه های آنها ناسازگاری دارند. نگرانی اصلی این است که وردپرس قابلیت بارگذاری حدسی را به صورت پیش فرض فعال کرده، بدون اینکه گزینه ساده ای در پنل مدیریت برای غیرفعال کردن آن ارائه دهد. کاربران معمولی ممکن است حتی ندانند که چنین قابلیتی فعال است یا چگونه روی سایت شان تأثیر می گذارد.