كيف تستفيد من التخزين المؤقت للمتصفح في WordPress؟

في هذا البرنامج التعليمي سوف نتعلم كيفية الاستفادة من التخزين المؤقت للمتصفح في WordPress لتسريع موقعك.

هناك عدد من الطرق لتسريع مواقع WordPress بشكل عام ، ولكن أثناء تحليل تحسين سرعة موقع الويب ، يعد التخزين المؤقت للمتصفح هو المشكلة الأكثر اكتشافًا بشكل متكرر.

يمكنك استخدام مجموعة متنوعة من أدوات الإنترنت ، بما في ذلك Google PageSpeed ​​Insights و GTMetrix و Pingdom ، لتتبع واختبار سرعة موقع الويب الخاص بك. يعطونك نتائج دقيقة ويظهرون لك أين يحتاج موقع الويب الخاص بك إلى العمل. ربما تكون قد شاهدت تحذير "Leverage Browser Caching" أثناء تقييم سرعة الموقع.

يمكنك أيضًا قراءة: خدمة الأصول الثابتة باستخدام سياسة ذاكرة تخزين مؤقت فعالة

ما هو التخزين المؤقت لمتصفح الرافعة المالية؟

التخزين المؤقت هو طول الفترة الزمنية التي تحتفظ فيها المتصفحات بالموارد القابلة للتخزين المؤقت لموقع الويب على أنظمتها المحلية.

من بينها الصور وجافا سكريبت و CSS والموارد الأخرى. يتم إعادة تحميل المواد القابلة للتخزين المؤقت المحفوظة على جهازك في كل مرة يرى فيها شخص ما موقع الويب. وبالتالي ، هناك زيادة ملحوظة في سرعة تحميل الموقع. يرغب الأشخاص في استخدام التخزين المؤقت للمتصفح في WordPress لهذا السبب.

كيف تعمل الاستفادة من التخزين المؤقت للمتصفح في WordPress؟

هناك العديد من العمليات التي تعمل في الخلفية كلما دخل المستخدم إلى مجال معين.

أصبح موقع WordPress الخاص بك مرئيًا من خلال كل ما يتم إرساله إلى متصفح المستخدم. تتضمن عناصر مواقع الويب هذه البرامج النصية والرسومات وأوراق الأنماط والمحتوى والمزيد. عند الضرورة ، يجب نقلها من خادم الموقع إلى متصفح المستخدم. فيما يلي خطوات هذه العملية:

1. يتم إدخال عنوان URL في متصفح الزائر.
2. يتم تقديم طلب بواسطة المتصفح إلى الخادم الذي يستضيف موقع الويب الخاص بك (طلب HTTP).
3. يتلقى المستخدم البيانات بعد أن يتم تجميعها بواسطة الخادم. يبدأ المستخدمون في تجربة تباطؤ في هذه المرحلة. يمكن للأشخاص تصغير حجم السكريب وتحسين أحجام الصور وإجراءات أخرى لإيقاف هذا البطء.
4. قد يعرض المتصفح الآن موقع الويب أخيرًا بعد نقل البيانات. عندما يصل المستخدمون إلى صفحات مختلفة ، يتم تكرار الإجراء. يمكن أن ينتج الأداء المنخفض عن تلقي الخادم لعدد كبير من الطلبات دفعة واحدة. لذلك يجب على الأشخاص تحسين مواقعهم على الويب من أجل الحفاظ على سرعتهم.

تستخدم كل من متصفحات الويب والبرامج المحتوى المخزن مؤقتًا. يتم حفظه مؤقتًا على القرص المحلي الخاص بك. يشير المصطلح "Web Cache" أو "HTTP Cache" إلى هذه البيانات. سيقوم المتصفح بتحميل البيانات من جهاز الكمبيوتر الخاص بك وتنزيل محتوى الموقع في كل مرة تزور فيها نفس الموقع.

تحتاج إلى استخدام أداة معينة لتحديد ما إذا كان موقع WordPress الخاص بك يستخدم التخزين المؤقت للمتصفح بشكل فعال.

الفرق بين التخزين المؤقت للمستعرض والتخزين المؤقت للخادم

من أجل تقليل الحمل والكمون على خوادم الويب ، غالبًا ما يستلزم التخزين المؤقت للويب من جانب الخادم (للتخزين المؤقت من جانب الخادم ، نوصي دائمًا LiteSpeed ​​Cache لـ WordPress) باستخدام وكيل ويب يخزن استجابات الويب من خوادم الويب التي تقف أمامها. يمكن أن يتضمن التخزين المؤقت على الويب من جانب العميل أيضًا التخزين المؤقت المستند إلى المتصفح ، والذي يحفظ نسخة مخبأة من محتوى الويب الذي تم الوصول إليه مسبقًا.

يستلزم هذا الإجراء استخدام خادم الويب لإنتاج صفحات الويب المخزنة مؤقتًا لموقع الويب الخاص بك. الإجراءات المذكورة أعلاه هي مثال على التخزين المؤقت لصفحات الويب ، والتي تكون في الأساس من جانب الخادم.

يمكنك تحسين نظام التخزين المؤقت للخادم بعدة طرق مختلفة. سيكون الخيار الأفضل هو تحديث رؤوس Apache. ستكون المرحلة التالية هي استخدام مكونات WordPress الإضافية ، ومن ثم ستتم إضافة CDN.

الطريقة الأولى: الاستفادة يدويًا من التخزين المؤقت للمتصفح في WordPress

ملاحظة: تعمل هذه الطريقة فقط مع LiteSpeed ​​Enterprise أو Apache.

من خلال تضمين بعض التعليمات البرمجية في ملف .htaccess ، يمكنك الاستفادة يدويًا من التخزين المؤقت للمتصفح في WordPress. لثلاثة أهداف مميزة ، تحتاج في الواقع إلى إضافة ثلاثة أجزاء من التعليمات البرمجية:

1. إضافة رؤوس انتهاء الصلاحية
2. أضف رؤوس التحكم في ذاكرة التخزين المؤقت
3. قم بإيقاف تشغيل ETags

يجب أن يكون لديك حق الوصول إلى ملفات موقع الويب الخاص بك لإضافة هذا الرمز ، والذي يمكنك إنجازه عن طريق تسجيل الدخول إلى حساب الاستضافة الخاص بك أو CyberPanel.

انتقل إلى لوحة معلومات CyberPanel الخاصة بك

انقر فوق WordPress -> List WordPress من القائمة الموجودة على الجانب الأيسر

سوف تدخل قائمة مواقع ووردبريس . من هنا ، انقر فوق عنوان موقع WordPress الخاص بك

هذا هو مدير CyberPanel WordPress الخاص بك. انقر فوق مدير الملفات.

في public_html ، ستجد. htaccess . لاحظ أن قواعد htaccess مدعومة فقط من قبل LiteSpeed ​​Enterprise. لا يدعمه OpenLite Speed. انقر بزر الماوس الأيمن فوقه وانقر فوق CodeMirror

أضف التعليمات البرمجية التالية في نهاية ملف. htaccess بنسخه ولصقه. لا تقم بتعديل الملف بأي طريقة أخرى.

 #Customize expires cache start - adjust the period according to your needs <IfModule mod_expires.c> FileETag MTime Size AddOutputFilterByType DEFLATE text/plain text/html text/xml text/css application/xml application/xhtml+xml application/rss+xml application/javascript application/x-javascript ExpiresActive On ExpiresByType text/html "access 600 seconds" ExpiresByType application/xhtml+xml "access 600 seconds" ExpiresByType text/css "access 1 month" ExpiresByType text/javascript "access 1 month" ExpiresByType text/x-javascript "access 1 month" ExpiresByType application/javascript "access 1 month" ExpiresByType application/x-javascript "access 1 month" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType application/pdf "access 1 month" ExpiresByType image/x-icon "access 1 year" ExpiresByType image/jpg "access 1 year" ExpiresByType image/jpeg "access 1 year" ExpiresByType image/png "access 1 year" ExpiresByType image/gif "access 1 year" ExpiresDefault "access 1 month" </IfModule> #Expires cache end

ترشد الشفرة المذكورة أعلاه المتصفح إلى تسليم نسخة مخبأة من الموارد الثابتة بدلاً من تنزيل نسخة جديدة.

يتم تضمين أوقات التحديث / انتهاء الصلاحية أيضًا في الإعدادات:

يستغرق HTML 600 ثانية.
JavaScript و CSS لمدة شهر
للصور سنة

لن يضطر الزوار إلى تنزيل موارد معينة بشكل متكرر بفضل تواريخ انتهاء صلاحيتها. إذا لزم الأمر ، يمكنك تغيير أوقات انتهاء الصلاحية بسرعة.

لإنشاء سياسات التخزين المؤقت للمستعرض حول كيفية تخزين المورد مؤقتًا ، ومكان تخزينه مؤقتًا ، والحد الأقصى للعمر قبل انتهاء الصلاحية ، نحتاج إلى تضمين رؤوس التحكم في ذاكرة التخزين المؤقت. لا نحتاج إلى تكرار أوقات انتهاء الصلاحية كما ذكرناها سابقًا.

الكود التالي ، ثم الصقه:

 # BEGIN Cache-Control Headers <IfModule mod_expires.c> <IfModule mod_headers.c> <filesMatch "\.(ico|jpe?g|png|gif|swf)$"> Header append Cache-Control "public" </filesMatch> <filesMatch "\.(css)$"> Header append Cache-Control "public" </filesMatch> <filesMatch "\.(js)$"> Header append Cache-Control "private" </filesMatch> <filesMatch "\.(x?html?|php)$"> Header append Cache-Control "private, must-revalidate" </filesMatch> </IfModule> </IfModule>

سيتم تعطيل العلامات الإلكترونية بحيث يجب على المتصفحات استخدام رؤوس انتهاء الصلاحية والتحكم في ذاكرة التخزين المؤقت بدلاً من التحقق من الملفات. هذا هو المفتاح:

 Turn Etags off <IfModule mod_headers.c> Header unset ETag </IfModule> FileETag None

بمجرد الانتهاء ، انقر فوق حفظ .

الطريقة الثانية: الاستفادة من التخزين المؤقت للمتصفح في WordPress باستخدام الإضافات

يمكن أن يؤدي خطأ واحد إلى تدمير موقع الويب الخاص بك تمامًا ، وبالتالي فإن تعديل ملف htaccess قد يكون خطيرًا جدًا. وبالتالي ، يمكنك استخدام مكونات إضافية مثل W3 Total Cache إذا كنت لا ترغب في تحمل أي مخاطر غير ضرورية.

W3 Total Cache plugin

إليك كيفية استخدام W3 Total Cache ، أحد أفضل المكونات الإضافية لهذا الغرض ، لزيادة التخزين المؤقت للمتصفح.

أدخل لوحة تحكم WordPress الخاصة بك

انقر فوق الإضافات -> إضافة جديد من القائمة الموجودة على الجانب الأيسر

ابحث عن W3 Total cache . الآن قم بتثبيت وتفعيل هذا البرنامج المساعد

ستظهر علامة تبويب الأداء في الجانب الأيسر meu. انقر فوق الأداء -> الإعدادات العامة من القائمة الموجودة على الجانب الأيسر

قم بالتمرير لأسفل إلى Browser Cache وتأكد من تمكينها وحفظ التغييرات

الآن انقر فوق الأداء -> ذاكرة التخزين المؤقت للمتصفح من القائمة الموجودة على الجانب الأيسر

تأكد من أن

1. تعيين رأس انتهاء الصلاحية
2. ضبط التحكم في ذاكرة التخزين المؤقت
3. تعيين علامة الكيان

تم تمكينها. احفظ كل التغييرات.

LiteSpeed ​​Cache Plugin

يمنح CyberPanel كل مستخدم LiteSpeed ​​Cache افتراضيًا مع كل نشر لموقع WordPress. إذا كنت لا تستخدم CyberPanel ، فيمكنك تنزيله من هنا.

بمجرد تشغيل الميزة ، يمكّنك المكون الإضافي للتخزين المؤقت LiteSpeed ​​Cache من استغلال التخزين المؤقت للمتصفح.

انتقل إلى لوحة معلومات WordPress الخاصة بك

انقر على LiteSpeed ​​Cache -> Cache من القائمة اليسرى

انقر فوق علامة التبويب " المتصفح " من الشريط العلوي

تأكد من تمكين ذاكرة التخزين المؤقت للمتصفح وانقر فوق حفظ التغييرات

استنتاج

تذكر أنه في بعض الأحيان بعد تثبيت مكون إضافي ، لن تلاحظ التغييرات التي تجريها على الفور. يقع اللوم على ملف CSS / Stylesheet في هذا التأخير. لن تتمكن من عرض التغييرات التي أجريتها بسبب ذاكرة التخزين المؤقت للمتصفح التي حفظتها بالفعل على جهازك. يُنصح باستخدام ميزة التصفح المتخفي في متصفحك لعرض موقع الويب من أجل رؤيته بشكل صحيح بعد تعديلات متعددة. لن تستهلك موارد ذاكرة التخزين المؤقت إذا كنت تستخدم هذه الوظيفة ، ويجب أن تكون قادرًا على ملاحظة التغييرات بوضوح.

الطريقة التي تحددها للاستفادة من التخزين المؤقت للمتصفح ليست ذات صلة في النهاية. الشيء الوحيد المهم هو مراقبته أثناء العمل. الطريقة التي استخدمتها للوصول إلى هناك ليست ذات صلة طالما أن الرفع من ذاكرة التخزين المؤقت للمتصفح في WordPress تعمل على النحو المنشود. لا يوجد نهج صحيح أو خاطئ. ستكون النتيجة هي نفسها بغض النظر عن اختيارك. ستؤدي الاستفادة من التخزين المؤقت للمتصفح إلى تحسين أوقات التحميل سواء قررت إجراء تغييرات على ملف .htaccess أو استخدام مكون إضافي.