Autoptimize هو مكون إضافي مجاني لتحسين وورد بريس. بالإضافة إلى تحسين HTML و CSS وجافا سكريبت ، يتضمن Autoptimize أيضًا ميزات تحسين تستهدف جوانب أخرى من مواقع وورد بريس الحديثة.
في هذا المنشور ، سنشارك أفضل إعدادات المكون الإضافي Autoptimize لتحسين أداء وسرعة الصفحة لموقع وورد بريس الخاص بك.
قبل أن نتعمق في أفضل إعدادات التحسين التلقائي ، دعنا ننتقل بسرعة إلى ثلاثة أسباب تجعل التحسين التلقائي مكونًا إضافيًا للتحسين.
يحتوي الإصدار المجاني من Autoptimize على مجموعة ميزات كاملة لتحسين موقع وورد بريس الخاص بك.
يعد Autoptimize مكونًا إضافيًا للتحسين ولا يقوم بأي تخزين مؤقت لصفحة HTML. هذا يعني أنه متوافق مع جميع مضيفي الويب – حتى أولئك الذين لديهم تكوينات التخزين المؤقت للصفحة المخصصة مثل Kinsta.
يحتوي Autoptimize على أكثر من مليون تثبيت نشط في مستودع وورد بريس ويتم تحديثه باستمرار بميزات جديدة وإصلاحات للأخطاء.
HTML و CSS و JavaScript هي خبز وزبدة Autoptimize. كما هو الحال مع ملحقات التحسين الأخرى ، يمكن أن يكون البحث في مجموعة ميزات وإعدادات Autoptimize الشاملة مهمة شاقة. لتسهيل الأمور ، قمنا بتجميع أفضل إعدادات التحسين التلقائي لتحسين أداء موقعك.
تحسين JavaScript في Autoptimize.
تحسين JavaScript في Autoptimize.
نوصي بتمكين هذا الخيار. عند تمكين “تحسين كود JavaScript” ، ستعمل ميزة Autoptimize على تصغير ملفات JavaScript.
سيجمع خيار “تجميع ملفات JS” في Autoptimize جميع ملفات JavaScript في ملف واحد. في الماضي ، كان دمج ملفات JS و CSS خطوة أساسية في تحسين وورد بريس. في Kinsta ، نستخدم خوادم HTTP / 2 الحديثة التي تدعم التنزيلات المتوازية وتعدد الإرسال – وهذا يعني أن دمج الملفات لم يعد مهمًا كما كان في السابق لأن HTTP / 2 يسمح بتنزيل ملفات متعددة في نفس الوقت. ومع ذلك ، فإن تجميع ملفات CSS و JS سيظل يؤدي إلى زيادة سرعة أنواع معينة من مواقع وورد بريس ، لذلك نوصي باختبار سرعة صفحتك مع تمكين هذا الخيار وتعطيله.
يقوم خيار “تجميع JS المضمّن أيضًا” باستخراج JS المضمنة في HTML الخاص بك ، ودمجها مع ملف JS المحسن لـ Autoptimize. نظرًا لأن هذا الخيار يمكن أن يتسبب في زيادة سريعة في حجم ذاكرة التخزين المؤقت لـ Autoptimize ، فإننا نوصي بإبقاء هذا الخيار معطلاً ما لم يكن لديك سبب محدد لتمكينه.
في معظم الحالات ، لا نوصي بإجبار ملفات جافا سكريبت على التحميل في <head>عنصر HTML بموقعك . يمكن أن يؤدي إجبار JS على التحميل مبكرًا إلى منع عناصر العرض التي قد تؤدي إلى إبطاء سرعة صفحتك. إذا كانت لديك ملفات جافا سكريبت تحتاج إلى تحميلها في <head>العنصر ، فإننا نوصي باستبعاد تلك البرامج النصية من التحسين التلقائي.
يتيح لك هذا الخيار استبعاد أدلة معينة وملفات JavaScript من التجميع. بشكل افتراضي ، يستبعد “التحسين التلقائي” البرامج النصية التالية.
wp-include / js / dist /
wp-include / js / tinymce /
js / jquery / jquery.js
لاحظ أن إضافة برنامج نصي ليتم استبعاده يؤثر فقط على التجميع بشكل افتراضي. سيستمر تصغير ملفات JavaScript المستبعدة ما لم يتم إلغاء تحديد “تصغير ملفات CSS و JS المستبعدة” ضمن “خيارات متنوعة”.
سيؤدي تمكين خيار “إضافة التفاف try-catch” إلى التفاف رمز JavaScript في كتل try-catch. هذا الخيار مفيد لتصحيح الأخطاء التي تسببها تصغير JS والتجميع. إذا كان موقعك يعمل فقط مع تمكين “add try-catch التفاف” ، فإننا نوصي بالعمل مع مطور لتصفح ملفات JavaScript لتحديد السبب الذي يسبب المشكلة لأن الاستخدام المفرط لكتل try-catch يمكن أن يقلل من أداء JS.
التحسين التلقائي: المكون الإضافي المجاني لتحسين وورد بريس الذي لم تكن تعلم أنك بحاجة إليه … ولكن هذا سيجعل موقعك سريعًا هذا الدليل يشرح بالضبط سبب حاجتك إليه 🚀
انقر للتغريد
التحسين التلقائي لتحسين CSS.
التحسين التلقائي لتحسين CSS.
نوصي بتمكين هذا الخيار. عند تمكين “تحسين كود CSS” ، ستعمل ميزة “التحسين التلقائي” على تصغير ملفات CSS الخاصة بك.
سيجمع خيار “تجميع ملفات CSS” في Autoptimize كل ملفات CSS في ملف واحد. كما ذكرنا سابقًا ، قد لا تفيد هذه الميزة المواقع التي تدعم HTTP / 2. نوصي باختبار أ / ب هذا الخيار على موقعك لتحديد ما إذا كان هناك أي تأثير إيجابي على سرعة الصفحة.
سينقل هذا الخيار CSS المضمن إلى ملف CSS الخاص بالتحسين التلقائي. بينما يمكن أن يؤدي نقل CSS المضمن إلى ملف CSS قابل للتخزين المؤقت للمستعرض إلى تقليل حجم الصفحة ، نوصي بترك هذا الخيار معطلاً في معظم الحالات.
عند تمكين هذا الخيار ، ستعمل ميزة “التحسين التلقائي” على تشفير صور الخلفية الصغيرة باستخدام Base64 وتضمينها في CSS. نوصي باختبار هذا الخيار لقياس التأثير على سرعة صفحتك. بينما يؤدي ترميز الصور إلى تنسيق base64 إلى تقليل عدد طلبات HTTP ، فإن ملفات تمثيل base64 عادةً ما تكون أكبر بنسبة 20-30٪ من نظيراتها الثنائية.
يمكن أن يؤدي تضمين CSS المهم إلى زيادة كبيرة في السرعة لبعض المواقع. الفكرة هنا هي الأنماط المضمنة المطلوبة للعناصر “الموجودة في الجزء المرئي من الصفحة”. من الناحية العملية ، عادةً ما تستهدف CSS المضمنة عناصر مثل العناصر الهيكلية ، ومجموعات الخطوط العامة وأحجامها ، وتصميم التنقل.
من خلال تضمين هذه العناصر الأساسية ، يمكن تحميل ملف CSS الكامل الأكبر في وقت لاحق دون التأثير على مظهر الصفحة. في حين أنه من الممكن استخراج الأنماط المهمة يدويًا ، فإننا نوصي باستخدام أداة مثل هذه لإنشاء الأنماط كنقطة بداية.
إنشاء CSS حرجة.
إنشاء CSS حرجة.
بعد إنشاء CSS المهم ، انسخه والصقه في إعدادات التحسين التلقائي.
مضمنة وتأجيل CSS في التحسين التلقائي.
مضمنة وتأجيل CSS في التحسين التلقائي.
الخطوة التالية هي اختبار تجربة الواجهة الأمامية لموقعك. إذا لاحظت بعض الومضات الغريبة للمحتوى غير المصمم (FOUC) ، فستحتاج على الأرجح إلى تحديد تلك العناصر غير المصنفة وإضافة الأنماط المقابلة إلى التحسين التلقائي للتضمين.
يوفر Autoptimize “power-up” يقوم تلقائيًا بإنشاء CSS مهمة لصفحات وورد بريس الخاصة بك. من واقع خبرتنا ، يمكن أن تؤدي هذه الميزة أحيانًا إلى إبطاء موقعك لأنه يستخدم استدعاءات API خارجية لإنشاء CSS المهم. وبالتالي ، يعتمد إنشاء CSS الأولي المهم على استجابة خادم خارجي. في معظم الحالات ، تعتبر الطريقة المذكورة أعلاه والتي لا تتطلب أي استدعاءات خارجية لواجهة برمجة التطبيقات حلاً أكثر نظافة.
بالنسبة لمعظم المواقع ، لا نوصي بتضمين جميع CSS حيث يمكن أن يزيد حجم الصفحة بشكل كبير. علاوة على ذلك ، فإن تضمين جميع CSS يجعل من المستحيل على متصفح الويب تخزين CSS مؤقتًا.
بشكل افتراضي ، يستبعد Autoptimize الدلائل التالية وملفات CSS من التجميع. إذا كنت ترغب في منع Autoptimize من تجميع أي من ملفات CSS الخاصة بك ، فيمكنك إضافتها إلى هذه القائمة. على غرار استبعاد JavaScript ، لا يمنع السلوك الافتراضي لهذه الميزة تصغير ملفات CSS – يتم تجميعها فقط.
wp-content / ذاكرة التخزين المؤقت /
wp- محتوى / تحميلات /
admin- bar.min.css
dashicons.min.css
يمكن أن يساعد تحسين HTML في Autoptimize في تقليل حجم صفحاتك عن طريق إزالة المسافات البيضاء.
تحسين HTML في التحسين التلقائي.
تحسين HTML في التحسين التلقائي.
نوصي بتمكين ميزة التعليمات البرمجية “تحسين HTML” لأنها تقلل من حجم الصفحة عن طريق إزالة المسافات البيضاء غير الضرورية في HTML. على الرغم من أن هذه الميزة متوافقة مع معظم المواقع ، إلا أن إزالة المسافات البيضاء يمكن أن تتسبب في حدوث خلل في بعض المواقع. وبالتالي ، نوصي باختبار تحسين كود HTML تمامًا قبل استخدامه في بيئة الإنتاج.
تريد أن تعرف كيف زدنا من حركة المرور لدينا أكثر من 1000 ٪؟
انضم إلى أكثر من 20000 آخرين ممن يتلقون رسائلنا الإخبارية الأسبوعية مع نصائح من الداخل حول وورد بريس!
إشترك الآن
قم بتمكين هذه الميزة إذا كنت ترغب في الاحتفاظ بتعليقات HTML لصفحاتك المحسّنة.
إذا كنت تستخدم CDN مثل KinstaCDN لتسريع الأصول الثابتة ، فستحتاج إلى إضافة عنوان URL لـ CDN للتحسين التلقائي. إذا كنت تستخدم خدمة وكيل مع إمكانيات CDN مثل Cloudflare ، فلن تحتاج إلى تكوين أي شيء في خيارات CDN الخاصة بالتحسين التلقائي.
تكوين إعدادات CDN في التحسين التلقائي.
تكوين إعدادات CDN في التحسين التلقائي.
تعرض “معلومات ذاكرة التخزين المؤقت” الخاصة بالتحسين التلقائي معلومات مهمة مثل الموقع والأذونات الخاصة بمجلد ذاكرة التخزين المؤقت ، بالإضافة إلى الحجم الإجمالي للأنماط والبرامج النصية المخزنة مؤقتًا. إذا رأيت “لا” بجوار “هل يمكننا الكتابة؟” ، فستحتاج إلى العمل مع مضيفك لإصلاح أذونات المجلد.
تحسين معلومات ذاكرة التخزين المؤقت.
تحسين معلومات ذاكرة التخزين المؤقت.
التحسين التلقائي لديه عدد قليل من إعدادات التحسين المتنوعة. إذا كنت تواجه مشكلات في الحصول على ملفات CSS و JS محسَّنة للتحميل على موقعك ، فقد تحتاج إلى إعادة تكوين بعض الإعدادات أدناه.
تحسينات متنوعة في التحسين التلقائي.
تحسينات متنوعة في التحسين التلقائي.
نوصي بتمكين هذا الخيار لحفظ الملفات المجمعة كملفات ثابتة محليًا. قد تحتاج إلى تعطيل هذا إذا لم يتم تكوين الخادم الخاص بك للتعامل مع ضغط الملف وانتهاء صلاحيته.
نوصي بتمكين هذا الخيار لضمان تصغير جميع ملفات CSS و JS. ومع ذلك ، إذا لاحظت بعض المشكلات المتعلقة بالتصغير في بعض ملفات CSS و JS المستبعدة ، فيمكنك المضي قدمًا وتعطيل هذا الخيار.
نوصي بتمكين هذا لضمان تحسين الأصول للمحررين والمسؤولين الذين قاموا بتسجيل الدخول. هذا مهم إذا كنت تختبر إعدادات التحسين التلقائي كمستخدم مسجّل الدخول.
هل تحتاج إلى استضافة من الدرجة الأولى وسريعة وآمنة لموقع التجارة الإلكترونية الجديد الخاص بك؟ توفر Kinsta خوادم فائقة السرعة ودعمًا عالميًا على مدار الساعة طوال أيام الأسبوع من خبراء WooCommerce. تحقق من خططنا
يتميز Autoptimize بتكامل مدمج مع ShortPixel لتحسين الصور . بالإضافة إلى إعداد جودة الصورة ، يتيح لك تكامل Autoptimize أيضًا إنشاء إصدارات WEBP من صورك وتقديمها .
بالنسبة لمستخدمي Kinsta ، لا نوصي باستخدام ميزة تحسين الصورة في Autoptimize. بدلاً من ذلك ، نوصي باستخدام المكونات الإضافية كاملة الميزات من ShortPixel أو Imagify مباشرةً. باستخدام المكون الإضافي الكامل ، سيكون لديك المزيد من التحكم الدقيق في إعدادات التحسين بما في ذلك إعادة كتابة الصور لاستخدام <picture>العلامة ، وهو أمر مطلوب لدعم WEBP على Kinsta.
تحميل الصور البطيئة مع التحسين التلقائي.
تحميل الصور البطيئة مع التحسين التلقائي.
يتضمن التحسين التلقائي أيضًا وظيفة التحميل البطيء للصور. نوصي بتمكين هذه الميزة لتحسين سرعة الصفحة للصفحات ذات الصور الثقيلة. عند تمكين التحميل البطيء ، تتيح لك ميزة Autoptimize استبعاد بعض فئات الصور وأسماء الملفات من التحميل البطيء.
يعد إعداد الاستبعاد مفيدًا للصور مثل الشعارات والرموز الاجتماعية وعناصر الصور المهمة الأخرى التي لا ينبغي تحميلها كسولًا. إذا كنت تبحث عن حل يوفر مزيدًا من التحكم في التحميل البطيء ، فراجع دليلنا حول التحميل البطيء للصور ومقاطع الفيديو في وورد بريس .
تحسينات إضافية في التحسين التلقائي.
تحسينات إضافية في التحسين التلقائي.
يحتوي Autoptimize على عدد قليل من الخيارات المختلفة لتحسين خطوط Google . سيعتمد الخيار الأفضل بالنسبة لك على كيفية استخدام موقعك لخطوط Google.
اتركه كما هو.
إزالة خطوط جوجل.
الجمع والربط في الرأس.
الجمع والتحميل المسبق في الرأس.
قم بدمج وتحميل الخطوط بشكل غير متزامن مع webfont.js.
لا نوصي باستخدام خيار “ترك كما هي” لأنه لا يوفر ميزة السرعة.
إذا لم تكن Google Fonts من المتطلبات المهمة على موقعك ، فإن إزالتها واستخدام مجموعة خطوط النظام بدلاً من ذلك يمكن أن يكون لها تأثير إيجابي كبير على سرعة صفحتك.
إذا كنت ترغب في الاحتفاظ بخطوط Google على موقعك ، فنحن نوصي باختبار الخيارات الثلاثة الأخيرة لمعرفة الخيار الأفضل لموقعك.
يعمل خيار التحسين التلقائي هذا على إزالة CSS وجافا سكريبت المرتبطين بالرموز التعبيرية الأساسية لـ وورد بريس. نوصي بتمكين هذا الخيار لأنه يمكن أن يساعد في تقليل حجم صفحتك. علاوة على ذلك ، تأتي معظم أنظمة التشغيل السائدة مع مجموعات الخطوط التي تتضمن الرموز التعبيرية. بالطبع ، هناك طرق أخرى لتعطيل الرموز التعبيرية على موقع وورد بريس الخاص بك .
إذا كنت ترغب في إزالة سلاسل الاستعلام (على سبيل المثال؟ ver =) من الموارد الثابتة ، يمكنك تمكين هذا الخيار. لن تؤثر إزالة سلاسل الاستعلام على وقت التحميل ، ولكنها قد تساعد في تحسين درجة موقعك في GTmetrix و Google Pagespeed وخدمات اختبار الأداء الأخرى.
التوجيه المسبق ليسمح المستعرض الخاص بك للاتصال المجالات المحددة لعملية المشاهدة DNS و SSL مصافحة المفاوضات قبل أن يتم إرسال طلب HTTP الكامل.
على سبيل المثال ، إذا كان موقعك يحتوي على صورة شعار يتم تقديمها من https://site.kinsta.cdn.com/logo.png، فيمكنك توجيه “تحسين تلقائي” لإضافة توجيه اتصال مسبق للتعامل مع اتصالات DNS و SSL الأولية في <head>العنصر قبل إجراء طلب HTTP في <body>عنصر HTML الخاص بك.
يمكنك استخدام أدوات مطور المستعرض الخاص بك أو المفتش للعثور على المجالات الخارجية المهمة للاتصال المسبق بها. في مثال الصفحة أدناه ، توجد طلبات خارجية للنطاقات التالية.
يمكن إضافة هذه المجالات الثلاثة إلى قائمة الاتصال المسبق الخاصة بالتحسين التلقائي.
ابحث عن الأصول الخارجية باستخدام أدوات المطور.
ابحث عن الأصول الخارجية باستخدام أدوات المطور.
لأسباب تتعلق بالأداء ، نوصي بإضافة ما لا يزيد عن ستة مجالات إلى قائمة التوصيل المسبق الخاصة بالتحسين التلقائي لأن تحديد توجيهات الاتصال المسبق للعديد من المجالات يمكن أن يؤدي إلى نتيجة أداء.
توجه توجيهات التحميل المسبق تعليمات لمتصفح الويب لتنزيل أحد الأصول في أسرع وقت ممكن. هذا التوجيه مفيد لتنزيل الأصول المطلوبة في وقت مبكر جدًا من عملية تحميل الصفحة. من الناحية العملية ، غالبًا ما يتم استخدام التحميل المسبق لتسريع أوقات تحميل الخطوط المخصصة عن طريق تحميلها قبل طلبها في CSS للصفحة.
نوصي بالتشاور مع مطور فيما يتعلق بالأصول ، إن وجدت ، لتحميلها مسبقًا على موقع وورد بريس الخاص بك. كما هو الحال مع العديد من التعديلات الأخرى المتعلقة بالأداء ، يمكن أن يؤدي التحميل المسبق لعدد كبير جدًا من الأصول إلى تحميل موقعك بشكل أبطأ.
تتيح لك ميزة “ملفات جافا سكريبت غير المتزامنة” في Autoptimize تحديد ملفات جافا سكريبت خارجية معينة لتحميلها بشكل غير متزامن عبر asyncعلامة HTML. بينما يمكن أن يؤدي تحميل ملفات JS بشكل غير متزامن إلى تحسين سرعة الصفحة ، فإننا نوصي بإجراء اختبار مناسب للتأكد من عدم تأثر أي وظيفة بالموقع.
إذا لم تكن تستخدم Autoptimize بالفعل ، فستحتاج إلى إضافة هذا المكون الإضافي لتحسين وورد بريس إلى موقعك في أسرع وقت ممكن بعد قراءة هذا الدليل 🚀
انقر للتغريد
إذا كنت تعرف كيفية تعديل إعداداته ، فإن المكون الإضافي Autoptimize يعد خيارًا قويًا لمستخدمي وورد بريس الذين يتطلعون إلى تعزيز أداء الموقع.
مع الميزات الأساسية مثل تحسين HTML و CSS والمزيد من الميزات المتقدمة ، مثل تكامل CDN والقدرة على تحديد توجيهات الاتصال المسبق والتحميل المسبق ، فإن Autoptimize لديه كل ما تحتاجه لتحسين أداء الواجهة الأمامية لموقع وورد بريس الخاص بك.
إذا كنت مهتمًا بمعرفة المزيد حول تحسين وورد بريس وكيفية تحسين الواجهة الخلفية لموقعك ، فتأكد من مراجعة دليل أداء وورد بريس الشامل .
وفر الوقت والتكاليف وحقق أقصى قدر من أداء الموقع من خلال:
مساعدة فورية من خبراء استضافة وورد بريس ، 24/7.
تكامل Cloudflare Enterprise.
يصل الجمهور العالمي إلى 28 مركز بيانات حول العالم.
التحسين من خلال مراقبة أداء التطبيقات المضمنة لدينا.
