5 أدوات تساعدك على تحسين أداء موقع الويب
سوف نعرِّفكم في هذه المقالة على أهم الأدوات التي تساعدكم على تحسين أداء موقع الويب الذي يعتبر أمراً مهماً جداً قبل إطلاقه.
فهرس المحتويات
تحسين أداء موقع الويب هو الهاجس الأكبر للمطورين ودائما يجب أن يكون على رأس الأولويات، خاصة عندما يكون هناك الكثير من المنافسة عبر الإنترنت.
في عالمنا الرقمي اليوم، هناك ملايين من المواقع التي يتم الوصول إليها كل يوم لأسباب متنوعة وتقاس جودة هذه المواقع بسرعة تحميلها والوقت الذي تحتاجه الصفحة لتتحمل والكثير من هذه المواقع مزعجة وبطيئة وتعاني من مجموعة متنوعة من المشكلات بما في ذلك أوقات التحميل البطيئة كونها غير جاهزة للجوال مثلا أو عدم توافقها مع المتصفح وما إلى ذلك. ونحتاج في هذه الحالات إلى تحسين أداء موقع الويب وقياس سرعة التحميل وغير ذلك.
سنتجاوز هذه التقنيات والمشاكل للحصول على أفضل أداء لموقعك من خلال التركيز على الشفرة النظيفة وضغط الصور وتقليل الطلبات الخارجية وبعض الطرق الأخرى لزيادة السرعة والأداء العام لموقعك بشكل كبير.
ولكن قبل أن نبدأ ونتعمق بالنصائح سنأخذك بجولة عن الإحصائيات والأدوات التي يجب أن تكون على دراية بها لكي تتمكن من معرفة ماذا يحدث وثانيا حتى تتمكن من تحديد مشكلات أداء الموقع الخاص بك
الإحصائيات والأدوات
- أولا: لنبدأ رحلتنا بالإحصائيات، فبحسب آخر الدراسات والأبحاث أن الوقت الأمثل لتحميل الصفحة او المعدل الوسطي هو 3.21 ثانية حيث قامت pingdom بجمع هذه الإحصائية من ملايين المستخدمين.
- علينا أن نعلم أن 40% من العملاء يتخلون عن موقع الويب يستغرق تحميله أكثر من 3 ثوان.
- يتوقع الناس أن يتم تحميل موقع الويب الخاص بك تحت 3 ثوان وأكثر من ذلك يبدأون بالابتعاد عن الموقع.
- 73% من مستخدمي الهواتف المحمولة قالوا إنهم واجهوا موقع ويب استغرق وقتا طويلا جدا.
- بدراسة من شبكة BBC لاحظت أن في كل ثانية تأخير إضافية استغرقها موقعهم، فقدوا 10% من المستخدمين.
- ونفس الأمر بالنسبة لأمازون الذي تحدث عن كل 100ms تأخير في تحميل الموقع، فقدوا 1% من المستخدمين.
- ثانيا يجب أن تكون على دراية ببعض الأدوات التي تساعدنا على قياس سرعة وتحسين أداء موقع الويب:
- اختبار سرعة موقع الويب الخاص بك : يمكن استخدام أداة KEYCDN أو WebPageTest لاختبار سرعة موقع الويب لتحليل السرعة الإجمالية لموقع الويب.
- حساب ميزانية تحسين أداء موقع الويب الخاص بك: قام Jonathan Fielding بتجميع أداة صغيرة رائعة يمكنك من خلالها حساب ميزانية أدائك. ما عليك سوى إدخال السرعة التي تريد تحميل موقعك بها في ثواني واختيار سرعة الاتصال.
اقرأ أيضا: ويندوز 10 أسباب ستجبرك للانتقال إليه
نصائح من أجل تحسين أداء موقع الويب
الآن وقد أجريت بعض الاختبارات على موقع الويب الخاص بك لمعرفة مكان التأخير أو التحميل، فقد حان الوقت الآن لبدء التحسين، حان وقت العمل الجاد للبدء بتحسين موقعك.
انقل الكود الخاص بالجافاسكربت “Javascript” إلى ذيل الصفحة “footer”
يعد نقل ملفات JavaScript إلى تذييل الصفحة أسرع شيء يمكنك القيام به لتحسين الأداء. بذلك ستبدأ المتصفحات بتحميل أشياء أخرى أولا ولكن يجب الانتباه للآثار الجانبية لذلك فمثلا إذا كنا نستخدم JavaScript لتغير مظهر عنصر ما، فلن يتم تنفيذه إلا بعد فترة زمنية أطول بسبب وضعه في الـ Footer.
وضع ملفات الـ CSS أولاً
يعتبر تحميل CSS أولاً بنفس أهمية وضع JavaScript في نهاية مستند HTML ، لسببين:
- يحتوي CSS غالبًا على صور الخلفية والتي تتطلب جولة أخرى من الطلبات. الحصول على هذه الصور في أسرع وقت ممكن هو المهم.
- يتم عرض الصفحات بمجرد أن تصبح CSS جاهزة.
من خلال وضع CSS أعلى المستند ، فإنك تضمن بدء تحميل جميع صور الخلفية فورًا وأن يتم عرض موقع الويب الخاص بك في أسرع وقت ممكن.
تقليل عدد ملفات الجافاسكربت “Javascript” و الـ CSS
عند البدء بكتابة الكود، فإن استخدام العديد من ملفات الـ CSS وملفات جافا سكريبت المختلفة يكون أمرًا في كثير من الأحيان منطقيًا، وذلك من أجل تقسيم العمل عندما يكون المشروع كبير ولكن:
عند تحسين الأداء، يكون هذا أسوأ شيء يمكنك القيام به تقريبًا. حيث مع كل ملف تضيفه ، يجب إرسال رأس “Head”ويجب أن يشغل طلب إضافي طريقه من وإلى الخادم.
لذلك يجب دمج كل CSS في ملف واحد وكل JavaScript في ملف آخر، ثم قللهما كليهما. (لا تنس أن تضع CSS في الجزء العلوي من مستند HTML وجافا سكريبت في تذييل الصفحة).
على الرغم من أن إعادة تجميع ملفاتك وتصغيرها بعد كل تغيير قد يبدو مؤلمًا، إلا أن اختلاف الأداء مثير للغاية.
الطلبات الخارجية
تحتوي العديد من مواقع الويب اليوم على برامج نصية وعناصر واجهة خارجية تقوم بتحميل البيانات من خوادم أخرى.
ومن الأمثلة على ذلك زر Tweet ومربع معجبين على Facebook والزر “مشاركة هذا” وحتى Google Analytics. قد تعتقد أن هذه كلها ستتم هندستها جيدًا وستعمل بشكل ممتاز، لكن الكثيرين ليسوا كذلك. على سبيل المثال ، تقدم الأداة Digg تسعة طلبات ، وهي 52 كيلوبايت وتمنع تحميل الصفحة الرئيسية!
لذلك يجب استخدم هذه الأدوات المصغّرة بشكل بسيط، والقيام بقياس أدائها والبحث عن بدائل غير متزامنة. تتوفر بدائل إلى الحاجيات الأكثر شعبية. تثبيتها أكثر تعقيدًا قليلاً ، لكنها تؤدي بشكل أفضل كثيرًا. يمكنك عادة العثور عليها مع القليل من البحث وسنقدم لك بعضا منها Google Analytics ، Tweet Button, WordPress
قياس النتائج الخاص
هناك عدد من الأدوات الرائعة التي تجعل من السهل قياس أداء موقع الويب الخاص بك. بعض يمكن استخدامها في المتصفح. البعض الآخر يكون أونلاين وسنعرفك على بعض منها:
- Firefox Firebug: من خلالها تستطيع الاطلاع على جدول زمني مرئي للمدة التي يستغرقها تحميل موقع الويب الخاص بك ولماذا.
2-YSlow for Firebug: أصدرت Yahoo مكونًا إضافيًا لمتصفح Firebug يحلل موقع الويب مقابل توصيات YSlow ويقترح طرقًا لتحسين الأداء.
3-PageSpeed for Firebug: يعمل هذا تمامًا مثل YSlow، ولكنه يعتمد على توصيات PageSpeed من Google.
مما سبق نستطيع القول أنه يمكن لمعظم مطوري الويب تنفيذ النصائح الخمسة أعلاه بسهولة إلى حد ما ومع ذلك، فإن هناك العديد من الأشياء الأخرى التي تستحق القيام بها إذا كنت ترغب في البحث بشكل أعمق وتحسين أداء الموقع الخاص بك.
اقرأ أيضا: تنظيف سماعة الهاتف من الماء والغبار بدون فكه
الذهاب نحو الاحتراف لتحسين أداء موقع الويب
- تتضمن العديد من مواقع الويب ملف CSS نفسه في كل صفحة، ولكن لا يوجد سبب يدعو الزائر إالى تنزيله لكل صفحة، لذلك عليك أن تتعلم التخزين المؤقت.
- استخدام Gzip Compression من أجل ضغط وحفظ النطاق الخاص بموقعك وتسريعه حيث يقوم Gzip بمطالبة الخادم بضغط كل ملف قبل إرساله إلى الزائر ثم يقوم متصفح الزائر بتنزيله وفك ضغطه. تابع معنا الصور أدناه ولاحظ الفرق بنفسك.
3- تحميل تقنية mod_pagespeed: هي تقنية مقدمة من google لجعل الويب أسرع وتحسين سرعة وأداء الموقع وذلك لجعل الأمور أسهل للمطورين من أجل تحسين الأداء، حيث تقوم هذه التقنية بتنفيذ العديد من الأمور السابقة التي ذكرناها بشكل تلقائي وتقوم بأكثر من 15 عملية تحسين فورية تلبي جوانب مختلفة من أداء الويب، بما في ذلك تحسين التخزين المؤقت وتقليل الرحلات بين الخادم والعميل، وتقلل غالبا أوقات تحميل الصفحة بنسبة تصل إلى 50%.
الخلاصة
أن تحسين أداء موقع الويب وسرعته يستحق منك المزيد من الاهتمام والدراسة والتركيز أكثر وأكثر، حيث تتمثل مهمتنا كمطورين في معرفة أفضل الممارسات في هذه الصناعة من أجل تقديم أفضل الأعمال لعملائنا ومستخدمينا.
هل تعرف طريقة سهلة من أجل تحسين أداء موقع الويب ولم يتم ذكرها في هذه المقالة؟ يرجى مشاركتها وكتابتها في التعليقات أدناه.
يجب أنت تكون مسجل الدخول لتضيف تعليقاً.