دليل المادة
هل تواجه صعوبة في اختيار نوع التضمين المناسب لـ W3 Total Cache Minify؟ تُشارك هذه المقالة تجربة أحد مُشرفي المواقع الإلكترونية، وتُقدم دليلاً مُفصلاً خطوة بخطوة لاختيار نوع التضمين المُناسب لـ Minify بدقة، مما يُجنبك مشاكل تناسق تصميم الموقع الإلكتروني وتعطل التحميل. كما تتضمن حلاً سهلاً ومضموناً يُمكن حتى للمبتدئين تطبيقه بسهولة.WordPress انطلق بسرعة دون أن تصطدم!
كنتُ أقوم بتحسين موقع ويب، وعندما فتحتُ إعدادات التصغير في برنامج W3 Total Cache، شعرتُ بالذهول التام. احتوت القائمة المنسدلة لنوع التضمين على أربعة خيارات: الافتراضي (حظر)، استخدام جافا سكريبت لعدم الحظر، استخدام "غير متزامن" لعدم الحظر، واستخدام "مؤجل" لعدم الحظر.
فكرت في الأمر للحظة، ما كل هذا؟
صدقني، لست وحدك. هذه الخيارات الأربعة قد تُربك حتى المبتدئين، فما بالك بمن يستخدم ووردبريس منذ سنوات. تُقدم هذه المقالة المشاكل التي واجهتها والدروس التي تعلمتها، مباشرةً إليك. لستَ بحاجة إلى الرجوع إلى الوثائق؛ فقط اتبع تعليماتي.
ما هي أنواع التضمين الأربعة هذه تحديداً؟
لنتحدث أولاً عن نوع الشخصية التي تمثلها هذه الخيارات الأربعة.
الوضع الافتراضي (حظر)يُطلق على هذا اسم "الحظر الافتراضي". وهو أبسط الطرق: يتوقف المتصفح عند مصادفة نص برمجي، ثم يقوم بتنزيله وتنفيذه بالكامل، ثم يتابع عرض الصفحة. يبدو موثوقًا، أليس كذلك؟ لكن المقابل هو أن تحميل الصفحة الأولي سيتوقف مؤقتًا؛ إذ سيتعين على المستخدمين الانتظار حتى ينتهي النص البرمجي من العمل قبل أن يتمكنوا من رؤية أي شيء.
استخدام جافا سكريبت للبرمجة غير المتزامنةهذا مثير للاهتمام حقًا. فبدلًا من كتابة وسوم `<script>` مباشرةً على الصفحة، يقوم النظام أولًا بإخراج نص برمجي صغير، ثم يُدرج ديناميكيًا النصوص البرمجية التي يجب تحميلها في الصفحة عبر جافا سكريبت بعد تشغيلها. بهذه الطريقة، يمكن عرض الصفحة أولًا، ثم تحميل النصوص البرمجية تدريجيًا. يبدو هذا رائعًا، أليس كذلك؟ مع ذلك، تكمن المشكلة في أن عملية الإدراج الديناميكي هذه قد تُخلّ بترتيب تنفيذ النصوص البرمجية الأصلي. إذا كانت بعض النصوص البرمجية على صفحتك تعتمد بشكل كبير على ترتيب التنفيذ، فقد تنشأ مشاكل.
استخدم "غير متزامن" لعدم الحظريتضمن هذا إضافة السمة `async` إلى وسم `<script>`. سيتم تنزيل البرنامج النصي بشكل غير متزامن في الخلفية، ثم يُنفذ فورًا بعد التنزيل، دون انتظار الصفحة. مع ذلك، تكمن المشكلة في أن ترتيب التنفيذ غير قابل للتحكم؛ فالبرنامج النصي الذي ينتهي تنزيله أولًا يُنفذ أولًا، بغض النظر عن الترتيب الذي حددته في الكود.
استخدام "التأخير" لعدم الحظرهذا ما تعنيه إضافة خاصية `defer`. سينتظر البرنامج النصي حتى يتم تحليل الصفحة بالكامل قبل التنفيذ، والأهم من ذلك، أنه سيحافظ على الترتيب الأصلي الذي كتبته به. وهذا سهل الاستخدام للغاية، حيث لا يحجب الشاشة الأولى ولا يُخلّ بالترتيب.
أيهما أختار؟
ببساطة، هذه الخيارات الأربعة أشبه بسؤال متعدد الخيارات:هل تريد السرعة أم النظام؟
اقتراحي هو كالتالي:
إذا كان موقعك الإلكتروني صغيرًا، ويحتوي على عدد قليل من البرامج النصية، ولا تتطلب سرعة تحميل عالية جدًا، فإن استخدام الإعداد الافتراضي (المحظور) هو الخيار الأسهل. على الرغم من أنه أبطأ قليلًا، إلا أنه لن يسبب أي مشاكل.
إذا كنت ترغب في تحسين سرعة الشاشة الأولى، ولم تكن البرامج النصية الخاصة بك تعتمد على تبعيات قوية مثل "يجب تنفيذ A قبل B"، فقم بتحديد الأولويات...استخدام "التأخير" لعدم الحظر(تأجيل). هذا هو الحل الأمثل تقريبًا في الوقت الحالي، لأنه لا يعيق عملية العرض ولا يخل بترتيب العناصر.
إذا حاولت استخدام خاصية التأجيل (defer) وما زلت تجد أن بعض الوظائف بها مشاكل، ففكر في...استخدام جافا سكريبت للبرمجة غير المتزامنةهذا الحل أكثر جذرية، لكن توافقه أسوأ قليلاً.
استخدم "غير متزامن" لعدم الحظر(البرمجة غير المتزامنة) هي الخيار الذي لا أنصح به إطلاقاً. نظراً لاختلاف ترتيب التنفيذ بشكل كامل، فمن السهل حدوث عطل ما لم تكن متأكداً تماماً من أن جميع البرامج النصية تعمل بشكل مستقل.
مأزقان كبيران وقعت فيهما
الكلام سهل. لقد دوّنت خطأين ارتكبتهما؛ يمكنك مقارنتهما بتجربتك الخاصة لمعرفة ما إذا كان بإمكانك تجنبهما.
المأزق الأول: لا يمكن معاينة قوالب ووردبريس المخصصة في الوقت الفعلي.
لفترة من الوقت، عند تخصيص أحد القوالب، بعد النقر على "حفظ"، لم يتم تحديث المعاينة. كنتُ أجري بعض التغييرات، ثم أُحدّث الصفحة، لكنها تبقى كما هي.
بعد بعض البحث، اكتشفت أن وظيفة الضغط في برنامج Minify هي السبب. الحل بسيط:
قم بالوصول إلى إضافة W3 Total Cacheالاعدادات العامة،در"ضغط"قم بإلغاء تحديد هذا الخيار. ثم انقر على السهم الصغير أسفل "حفظ الإعدادات" في الزاوية العلوية اليمنى وحدد "..."احفظ الإعدادات وامسح ذاكرة التخزين المؤقتهذه الخطوة ضرورية؛ إذا لم تقم بمسح ذاكرة التخزين المؤقت، فستظل ترى الإصدار القديم.
بعد الانتهاء، ارجع إلى تخصيص المظهر، وستعود المعاينة المباشرة إلى وضعها الطبيعي.
المشكلة الثانية: مربع البحث عن سمة Astra لا يستجيب عند النقر عليه.
واجهتُ هذه المشكلة منذ فترة. كنتُ أستخدم قالب أسترا، وفجأةً وجدتُ أن مربع البحث لا يستجيب مهما حاولتُ النقر عليه. في البداية، ظننتُ أن المشكلة في القالب نفسه، لكنني اكتشفتُ لاحقًا أنها ناتجة عن إعدادات تصغير الملفات في W3TC.
الحل هو كالتالي:
انتقل إلى W3 Total Cache → الإعدادات العامة → إعدادات الضغط المتقدمة → JS → إعدادات محرك التصغير → إعدادات اللغة، وقم بتغيير نوع التضمين إلى أحد هذين النوعين:
- في السابق، كان يتم تحقيق عدم الحظر باستخدام جافا سكريبت.
- بعد ذلك، استخدم جافا سكريبت للتنفيذ غير المتزامن
وبالمثل، فإن مسح ذاكرة التخزين المؤقت وتحديث الصفحة سيسمح لمربع البحث بالعمل بشكل صحيح.
أما عن سبب اختيار هذين الخيارين دون غيرهما، فقد أجريتُ بعض الأبحاث. باختصار، مكونات واجهة المستخدم في قالب Astra حساسة للغاية لتوقيت تنفيذ البرامج النصية، وقد تتسبب بعض الطرق غير المتزامنة في فشل ربط الأحداث. يضمن استخدام وضع "غير متزامن مع جافا سكريبت" تنفيذ البرنامج النصي فقط بعد اكتمال تحميل الصفحة، مع تجنب التنفيذ غير المنتظم الذي يحدث مع البرمجة غير المتزامنة.
قائمة الأماكن التي يُنصح بزيارتها
وأخيرًا، إليك قائمة مرجعية يمكنك اتباعها مباشرة:
الخطوة الأولى هي تحديد هدفك بوضوح. هل ترغب في تحميل الصفحة بسرعة فائقة، أم أنك تُعطي الأولوية للاستقرار والتشغيل الخالي من الأخطاء؟ سيحدد هذا نوع التضمين الذي يجب عليك استخدامه.
الخطوة الثانية هي عدم تغيير كل شيء دفعة واحدة. أولاً، ابحث عن صفحة أقل أهمية لاختبارها، وراقبها ليوم أو يومين، ولا تُعممها على الموقع بأكمله إلا إذا كنت متأكدًا من عدم وجود أي مشاكل.
ثالثًا، احرص دائمًا على مسح ذاكرة التخزين المؤقت بعد كل تعديل. فآلية التخزين المؤقت في W3TC تمنعك من رؤية آخر التغييرات، لذا فإن خطوة "مسح ذاكرة التخزين المؤقت وإعادة الاختبار" ضرورية للغاية.
رابعًا، استخدم أدوات مطوري المتصفح أو أدوات مثل PageSpeed Insights لمقارنة سرعة التحميل قبل وبعد. دع البيانات تتحدث عن نفسها، وليس مجرد حدسك.
اكتب في النهاية
بصراحة، عندما رأيتُ إعداد النوع المضمن هذا لأول مرة، انتابتني الدهشة لفترة طويلة. بدا وضع الحظر الافتراضي بطيئًا للغاية، بينما لم يضمن الوضع غير المتزامن ترتيب العمليات، وقد يتسبب التأجيل في مشاكل توافق. شعرتُ بالحيرة حيال الخيار الأنسب.
لكنني أدركت لاحقًا أن الأمر ينطوي على مفاضلة. لا يمكنك الحصول على السرعة والاستقرار معًا؛ عليك دائمًا التضحية بأحدهما. تجربتي هي استخدام خاصية التأجيل أولًا، وهي حاليًا الحل الأكثر أمانًا وغير المتزامن، ثم استخدام دالة رد نداء في حال ظهور مشاكل.
إذا واجهت مشاكل مماثلة، أو إذا استمرت لديك مشاكل أخرى بعد اتباع طريقتي، فلا تتردد في مناقشتها. تطوير المواقع الإلكترونية يعتمد على التجربة والخطأ، ولا أحد يُستثنى من ذلك.
شكراً لكم على قراءة مقالتي. أراكم في المرة القادمة.
مدونة Hope Chen Weiliang ( https://www.chenweiliang.com/ قد تكون المقالة "إعدادات إضافة W3 Total Cache Minify: كيفية اختيار نوع التضمين؟ أخطائي ونصائحي المنقذة للحياة"، التي شاركتها، مفيدة لك.
مرحبا بكم في مشاركة رابط هذه المقالة:https://www.chenweiliang.com/cwl-34003.html