عند ضبط ميزانية شخصية أو نشاط تجاري أو عائلة، يعني ذلك أنّك تضع حدًا لإنفاقك مع الحرص على عدم تجاوزها. تعمل ميزانيات الأداء بالطريقة نفسها، ولكن بالنسبة إلى المقاييس التي تؤثر في أداء الموقع الإلكتروني.
ومن خلال وضع ميزانية للأداء وفرضها، يمكنك التأكّد من عرض موقعك الإلكتروني في أسرع وقت ممكن. سيؤدي ذلك إلى تقديم تجربة أفضل لزوارك والتأثير إيجابيًا في مقاييس النشاط التجاري.
في ما يلي كيفية تحديد ميزانية الأداء الأولى ببضع خطوات بسيطة.
التحليل الأولي
إذا كنت تحاول تحسين أداء موقع حالي، ابدأ بتحديد أهم الصفحات. على سبيل المثال، يمكن أن تكون هذه الصفحات على شكل صفحات تتلقّى أكبر عدد من زيارات المستخدمين أو صفحة مقصودة لمنتج.
بعد تحديد صفحاتك الرئيسية، يحين وقت تحليلها. أولاً، سنركز على المراحل الرئيسية ذات التوقيت التي تقيس تجربة المستخدم على أفضل وجه.
ضمن لوحة التدقيق في "أدوات مطوري البرامج في Chrome"، ستجد Lighthouse. يمكنك إجراء عمليات التدقيق على كل صفحة في نافذة الضيف لتسجيل هاتين المرتين:
لنأخذ على سبيل المثال محرك بحث متخصص للغاية، Dogos.com. يهدف Pagegos.com إلى فهرسة كل المحتوى الخاص بالكلاب على الإنترنت، وأهم صفحاته هي الصفحة الرئيسية وصفحات النتائج. في ما يلي أرقام FCP وTITI التي تم قياسها للموقع الإلكتروني على أجهزة الكمبيوتر المكتبي والأجهزة الجوّالة.
| أجهزة الكمبيوتر المكتبي | سرعة عرض المحتوى على الصفحة | مُؤَشِّرْ تَارِيخْ |
|---|---|---|
| الصفحة الرئيسية | 1,680 مللي ثانية | 5,550 مللي ثانية |
| صفحة النتائج | 2,060 مللي ثانية | 6,690 مللي ثانية |
| الأجهزة الجوّالة | سرعة عرض المحتوى على الصفحة | مُؤَشِّرْ تَارِيخْ |
|---|---|---|
| الصفحة الرئيسية | 1,800 مللي ثانية | 6,150 مللي ثانية |
| صفحة النتائج | 1,100 مللي ثانية | 7,870 مللي ثانية |
تحليل تنافسي
بعد الانتهاء من تحليل موقعك، يحين وقت تحليل مواقع منافسيك. مقارنة النتائج من مواقع الويب المشابهة لموقعك هي طريقة رائعة لمعرفة ميزانية الأداء. سواء كنت تعمل في مشروع قائم أو تبدأ من الصفر، فهذه خطوة مهمة. تحصل على ميزة تنافسية عندما تكون أسرع من منافسيك.
إذا لم تكن متأكدًا من المواقع الإلكترونية التي يجب الاطّلاع عليها، إليك بعض الأدوات التي يمكنك تجربتها:
- الكلمة الرئيسية "related:" في "بحث Google"
- ميزة المواقع الإلكترونية المشابهة في Alexa
- SimilarWeb
للحصول على صورة واقعية، جرِّب العثور على 10 منافسين أو نحو ذلك.
الميزانية لمعالم التوقيت
يتضمن محرك البحث المتخصص في هذا المثال مجموعة من المنافسين وسنركز على تحسين الصفحة الرئيسية للأجهزة المحمولة. أكثر من نصف الزيارات على الإنترنت اليوم تتم على شبكات الجوّال، وسيؤدي استخدام أرقام الهواتف الجوّالة كإعداد تلقائي إلى الفائدة ليس فقط لمستخدمي الأجهزة الجوّالة، بل أيضًا لمستخدمي أجهزة الكمبيوتر المكتبي.
يمكنك إنشاء رسم بياني يتضمّن أوقات FCP وTTI لجميع المواقع الإلكترونية المشابهة وسلِّط الضوء على أسرعها في المجموعة. يمنحك الرسم البياني مثل هذا الرسم البياني صورة أوضح عن أداء موقعك الإلكتروني مقارنة بالمنافسين.
| الموقع/الصفحة الرئيسية | سرعة عرض المحتوى على الصفحة | مُؤَشِّرْ تَارِيخْ |
|---|---|---|
| goggles.com | 880 مللي ثانية | 3,150 مللي ثانية |
| Doggos.com | 1,800 مللي ثانية | 6500 مللي ثانية |
| quackquackgo.com | 2,680 مللي ثانية | 4,740 مللي ثانية |
| ding.xyz | 2,420 مللي ثانية | 7,040 مللي ثانية |
هناك مجال للتحسين وهناك إرشادات جيدة لذلك وهي قاعدة% 20. تنص الأبحاث على أن المستخدمين يعرفون الفرق في أوقات الاستجابة عندما تكون أكبر من 20٪. هذا يعني أنك إذا كنت تريد أن يكون موقعك الإلكتروني أفضل بشكل ملحوظ من أفضل موقع إلكتروني مشابه، يجب أن تكون أسرع بنسبة% 20 على الأقل.
| قياس | الوقت الحالي | الميزانية (أسرع بنسبة 20% من المنافسة) |
|---|---|---|
| سرعة عرض المحتوى على الصفحة | 1,800 مللي ثانية | 704 مللي ثانية |
| مُؤَشِّرْ تَارِيخْ | 6500 مللي ثانية | 2,520 مللي ثانية |
عند محاولة تحسين موقع حالي، قد يبدو هذا الهدف مستحيلاً. هذا ليس إشارة إلى الاستسلام. ابدأ بخطوات صغيرة وحدِّد ميزانية أسرع بنسبة% 20 من سرعتك الحالية. يمكنك مواصلة التحسين من هنا.
بالنسبة إلى Dogos.com، يمكن أن تبدو الميزانية المنقحة على النحو التالي.
| قياس | الوقت الحالي | الميزانية المبدئية (أسرع بنسبة 20% من الوقت الحالي) | الهدف طويل المدى (أسرع بنسبة 20% من المنافسة) |
|---|---|---|---|
| سرعة عرض المحتوى على الصفحة | 1,800 مللي ثانية | 1,440 مللي ثانية | 704 مللي ثانية |
| مُؤَشِّرْ تَارِيخْ | 6500 مللي ثانية | 5200 مللي ثانية | 2,520 مللي ثانية |
دمج المقاييس المختلفة
تجمع ميزانية الأداء القوية بين أنواع مختلفة من المقاييس. لقد حددنا بالفعل الميزانية لتوقيتات المعلم الرئيسي وسنضيف الآن اثنين آخرين إلى المزيج:
- المقاييس المستنِدة إلى الكمية
- المقاييس المستندة إلى القواعد
الميزانية للمقاييس المستنِدة إلى الكمية
مهما كان إجمالي وزن الصفحة الذي توصلت إليه، حاوِل عرض أقلّ من 170 كيلوبايت من موارد المسار الحرج (المضغوطة/المصغرة). وهذا يضمن سرعة موقعك الإلكتروني حتى على الأجهزة غير المكلفة وشبكة الجيل الثالث البطيئة.
يمكنك تعيين ميزانية أكبر لتجربة سطح المكتب، ولكن لا تبذل مجهودًا كبيرًا. يتجاوز متوسط وزن الصفحة على كل من أجهزة الكمبيوتر المكتبي والأجهزة الجوّالة 1 ميغابايت استنادًا إلى بيانات أرشيف HTTP خلال العام الماضي. للحصول على موقع إلكتروني جيّد، عليك استهداف عدد أقل بكثير من هذه الأرقام المتوسطة.
في ما يلي بعض الأمثلة استنادًا إلى ميزانيات TTI:
| الشبكة | الجهاز | JS | الصور | CSS | HTML | الخطوط | المجموع | مدّة التفاعل مع الميزانية |
|---|---|---|---|---|---|---|---|---|
| شبكة الجيل الثالث بطيئة | Moto G4 | 100 | 30 | 10 | 10 | 20 | حوالي 170 كيلوبايت | 5 ثوانٍ |
| شبكة الجيل الرابع بطيئة | Moto G4 | 200 | 50 | 35 | 30 | 30 | حوالي 345 كيلوبايت | 3 ث |
| WiFi | أجهزة الكمبيوتر المكتبي | 300 | 250 | 50 | 50 | 100 | حوالي 750 كيلوبايت | 2 ثانية |
يعد تحديد الميزانية بناءً على مقاييس الكمية عملاً صعبًا. يختلف موقع التجارة الإلكترونية الذي يحتوي على الكثير من صور المنتجات عن بوابة الأخبار التي غالبًا ما تكون نصًا. وإذا كان موقعك الإلكتروني يتضمّن إعلانات أو إحصاءات، يؤدي ذلك إلى زيادة مقدار محتوى JavaScript الذي تشحنه.
استخدم الجدول أعلاه كنقطة بداية وعدّله بناءً على نوع المحتوى الذي تعمل عليه. حدّد ما ستشمله صفحاتك، وراجع بحثك وخذ تخمينًا مدروسًا بشأن أحجام مواد العرض الفردية. على سبيل المثال، إذا كنت تنشئ موقعًا إلكترونيًا يحتوي على الكثير من الصور، ضَع حدودًا أكثر صرامة على حجم JavaScript.
بعد أن يكون لديك موقع إلكتروني يعمل، تحقَّق من مستوى أدائك في مقاييس الأداء التي تركّز على المستخدم وعدِّل ميزانيتك.
ميزانية المقاييس المستندة إلى القواعد
المقاييس الفعّالة جدًا المستندة إلى القواعد هي نتائج Lighthouse. تُصنِّف أداة Lighthouse تطبيقك إلى 5 فئات، وإحدى هذه الفئات هي الأداء. يتم احتساب نتائج الأداء استنادًا إلى 5 مقاييس مختلفة، بما في ذلك "سرعة عرض أول محتوى مرئي" و"وقت التفاعل".
عند محاولة إنشاء موقع إلكتروني رائع، عليك ضبط ميزانية نتيجة أداء Lighthouse على 85 (من إجمالي 100). استخدِم Lighthouse CI لفرضها على طلبات السحب.
تحديد الأولويات
اسأل نفسك عن مستوى التفاعل الذي تتوقعه على موقعك. وإذا كان هو موقع إلكتروني إخباري، يتمثّل الهدف الأساسي للمستخدمين في قراءة المحتوى، لذا عليك التركيز على العرض بسرعة وإبقاء مقياس "سرعة عرض المحتوى على الصفحة" منخفضًا. يرغب زوار الموقع الإلكتروني Dogos.com في النقر على الروابط ذات الصلة في أقرب وقت ممكن، لذا فإنّ أهم أولوياتنا هي "مؤشر جودة الصفحة فقط" (TTI).
تعرَّف بدقة على الجزء الذي يتصفحه جمهورك على أجهزة الكمبيوتر المكتبي مقارنةً بالأجهزة الجوّالة، وحدِّد الأولويات وفقًا لذلك. لمعرفة ما يفعله الجمهور على المواقع الإلكترونية للمنافسين، يمكنك معرفة ذلك من خلال لوحة بيانات تقرير تجربة المستخدم على Chrome.
الخطوات التالية
تأكد من فرض ميزانية الأداء الخاصة بك طوال المشروع ودمجها في عملية البناء الخاصة بك.