ما هو تأخير الإدخال الأول (FID)؟ كيفية تقليله في WordPress

هناك اسم لتلك اللحظة المحرجة عندما تحاول التفاعل مع صفحة لأول مرة ويستغرق الأمر بعض الوقت حتى تستجيب. هذا يسمى تأجيل الإدخال الأول (FID) وهو مقياس يمنحك فكرة عن مدى جودة تجربة مستخدم موقع الويب (UX).

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

في هذه المقالة ، سوف نتحدث عن ما يعنيه "تأخير الإدخال الأول" ولماذا يعتبر مقياسًا مهمًا. ثم سننتقل إلى أربع طرق لتقليل درجات FID في WordPress. دعنا نذهب اليها!

جدول المحتويات:

• ما هو أول تأخير في الإدخال؟
• كيفية قياس تأخير الإدخال الأول لموقعك على الويب
• طرق لتقليل درجات تأخير الإدخال الأول في WordPress

ما هو أول تأخير في الإدخال (ولماذا يعتبر مقياسًا مهمًا)

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

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

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

من الناحية المثالية ، يجب أن يكون تأخير الإدخال الأول لموقعك أقل من 100 مللي ثانية. هذا هو المعيار الذي تعتبره Google مقبولاً لمواقع الويب:

نذكر Google على وجه التحديد لأن FID هو أحد المقاييس الثلاثة التي يستخدمها لقياس تجارب المستخدم الإيجابية أو السلبية على موقع الويب. تسمى هذه المقاييس الثلاثة "أساسيات الويب الأساسية" وهي تتضمن أيضًا المقياسين التاليين:

1. أكبر رسم محتوى (LCP): يقيس هذا المقياس المدة التي يستغرقها تحميل أكبر عنصر في الصفحة.
2. إزاحة التنسيق التراكمي (CLS): يقيس هذا مقدار "إزاحة" الصفحة بصريًا أثناء تحميلها. إذا تحركت العناصر كثيرًا أثناء تحميلها ، فستحصل على نتيجة CLS ضعيفة. لدينا دليل حول إصلاح تغيير التخطيط التراكمي لـ WordPress.

هناك سببان رئيسيان لأهمية Core Web Vitals. الأول هو أنها توفر مقياسًا لمدى جودة موقعك على الويب. إذا كان موقع الويب الخاص بك يحتوي على نتائج رائعة ، فهذا يعني أنه يتم تحميله بسرعة ، وأنه مستقر بصريًا ، ولا يتعين على المستخدمين الانتظار طويلاً للتفاعل معه.

السبب الثاني لأهمية Core Web Vitals هو أنها تؤثر على تحسين محرك البحث في موقعك (SEO). تستخدم Google هذه المقاييس كإشارة صغيرة عند تحديد التصنيفات. في الواقع ، كان محرك البحث العملاق واضحًا أن Core Web Vitals مهمة عندما يتعلق الأمر بـ SEO ، ولكن ليس بنفس الدرجة مثل المحتوى والروابط الخلفية.

كيفية قياس تأخير الإدخال الأول لموقعك على الويب

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

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

دعنا نتحدث عن كيفية عمل PageSpeed ​​Insights أولاً ثم سنشارك بعض البدائل التي يمكنك تجربتها إذا لم تقدم PageSpeed ​​Insights مقاييس تأخير الإدخال الأول لموقعك:

لاستخدام PageSpeed ​​Insights ، امض قدمًا وأدخل عنوان URL للصفحة التي تريد اختبارها. سيستغرق PageSpeed ​​Insights بضع لحظات لتحليله ثم سيعرض تقريرًا يبدو كالتالي:

بشكل عام ، لا يحتوي موقع الويب هذا على أفضل نتائج Core Web Vital. ومع ذلك ، يمكنك أن ترى أنه يعمل بشكل جيد للغاية عندما يتعلق الأمر بمقياس تأخير الإدخال الأول ، بمتوسط ​​وقت أقل من 100 مللي ثانية.

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

في هذه الحالة ، لديك خياران:

1. بسيط : يمكنك استخدام مقياس إجمالي وقت الحظر من قسم بيانات المعمل كوكيل تقريبي لوقت تأخير الإدخال الأول. إنه ليس تمثيلًا مثاليًا ، لكن مقياس إجمالي وقت الحظر مشابه جدًا لمقياس تأخير الإدخال الأول. بشكل عام ، إذا قمت بتحسين إجمالي وقت الحظر ، فسترى أيضًا تحسينات مماثلة لوقت تأخير الإدخال الأول.
2. متقدم : يمكنك استخدام أداة مراقبة أداء المستخدم الحقيقي مثل مقاييس الطلب. باستخدام هذه الأدوات ، ستحتاج إلى إضافة برنامج نصي للتتبع إلى موقعك لجمع بيانات المستخدم الحقيقية.

أدناه ، يمكنك معرفة مكان العثور على مقياس إجمالي وقت الحظر في PageSpeed ​​Insights:

الآن بعد أن عرفت كيفية قياس FID وأساسيات الويب الأساسية الأخرى ، فلنتحدث عن كيفية تحسينها.

طرق لتقليل درجات تأخير الإدخال الأول في WordPress

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

1. إزالة البرامج النصية غير الضرورية من موقع الويب الخاص بك

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

يمكن أن يمثل تحديد البرامج النصية المفيدة وأيها غير مفيد تحديًا ، ولكن هذا هو المكان الذي يأتي فيه PageSpeed ​​Insights. إذا أجريت اختبارًا لأي من صفحات موقعك ، فسيتضمن تقرير PageSpeed ​​Insights أيضًا قسم الفرص :

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

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

2. تأجيل الكود غير الحرج أثناء التحميل

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

إذا لم تكن هذه البرامج النصية "حرجة" ، يمكنك ببساطة إخبار متصفحك بتركها حتى النهاية حتى لا تبطئ الأمور لأي شخص آخر. هذا ما نسميه "تأجيل الكود غير الهام".

يجب أن تكون محطتك الأولى عند اكتشاف البرامج النصية التي يمكنك تأجيلها هي PageSpeed ​​Insights. بمجرد إنشاء تقرير لصفحة ما ، ستتضمن PageSpeed ​​Insights توصيات حول كيفية تحسين نتائجها.

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

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

لإعداد هذا على WordPress ، يمكنك استخدام البرنامج المساعد Async JavaScript الإضافي المجاني. أو ، تتضمن العديد من المكونات الإضافية للأداء في WordPress ميزات لتأجيل الكود. إذا كنت على استعداد للدفع مقابل مكون إضافي متميز ، فإن WP Rocket لديه ميزات لتأجيل CSS و JavaScript غير المهمين تلقائيًا.

3. استخدم أدوات تصغير CSS و JavaScript

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

بالنسبة لتلك البرامج النصية التي لا يمكنك إزالتها ، فإن أفضل رهان لك هو تصغيرها. هذا يعني إزالة المسافات البيضاء والأحرف غير الضرورية من الكود لتقليل حجم كل نص برمجي. هناك العديد من الأدوات التي ستعمل على تصغير البرامج النصية تلقائيًا في WordPress ، مثل Autoptimize و Fast Velocity Minify:

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

4. استخدم شبكة توصيل المحتوى (CDN)

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

في معظم الحالات ، سيؤدي استخدام CDN إلى تحسين أوقات تحميل موقع الويب الخاص بك ونتائج FID. يعد دمج WordPress مع CDN أمرًا بسيطًا وربما يكمن التحدي الأكبر في تحديد الخدمة التي يجب استخدامها.

إذا كنت تبحث عن خيارات CDN مجانية ، فإننا نوصي باختيار أحد الخيارات التالية:

1. Cloudflare: هذه واحدة من أكثر شبكات CDN شيوعًا في السوق. من السهل أن تتكامل مع WordPress وتقدم خطة مجانية.
2. Jetpack: يوفر المكون الإضافي Jetpack ميزة تسمى Site Accelerator ، والتي تستخدم خوادم WordPress.com لتخزين العناصر الثابتة من موقع الويب الخاص بك. على الرغم من أن Jetpack يتطلب حساب WordPress.com ، إلا أنه يمكنك استخدامه على مواقع WordPress ذاتية الاستضافة أيضًا.

ومع ذلك ، للحصول على أفضل أداء ، قد ترغب في التفكير في CDN متميز مثل KeyCDN أو StackPath أو Bunny CDN.

قلل تأخير الإدخال الأول لموقعك اليوم

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

إذا كنت تبحث عن طرق لتحسين درجة FID الخاصة بك في WordPress ، فإليك ما عليك القيام به:

1. إزالة البرامج النصية غير الضرورية من موقع الويب الخاص بك.
2. تأجيل CSS و JavaScript غير المهمين أثناء التحميل.
3. استخدم أدوات تصغير CSS و JavaScript ، مثل Autoptimize و Fast Velocity Minify.
4. استخدم CDN ، مثل Cloudflare أو Jetpack.

هل لديك أي أسئلة حول كيفية تقليل درجات FID في WordPress؟ دعنا نتحدث عنها في قسم التعليقات أدناه!