15 نصائح لزيادة سرعة الموقع

أهمية سرعة الموقع

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

  في عالم اليوم الفوري ، السرعة هي كل شيء!

كيفية تحسين أداء الموقع

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

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

    

   1. 1. الحد من عدد الطلبات التي تتطلبها الصفحة. في كل مرة يرسل فيها المستخدم طلبا من متصفح إلى الخادم ، فإنه يفقد ميلي ثانية ثمينة. من خلال دمج العناصر في ملفات فردية ، مثل ملف CSS sprite واحد بدلا من عشرات ملفات الصور ، يمكنك الحد من عدد الطلبات التي سيقوم بها المتصفح

    

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

    

   1. 1. استخدم CSS كلما أمكن ذلك. تخلص من الأنماط المضمنة والصور والمحتويات الأخرى التي تتم مشاركتها عبر صفحات متعددة على موقعك على الويب.

    

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

    

   1. 1. استخدم شبكات تسليم المحتوى (CDNs). تضع CDNs محتوى موقع الويب ، وخاصة الصور الكبيرة ومقاطع الفيديو وملفات الوسائط بالقرب من المستخدم النهائي قدر الإمكان. بدلا من جميع المستخدمين الذين يتصلون بالعناصر من خادم الويب الخاص بك ، يقومون الآن بتنزيل هذه العناصر من خادم CDN الذي يتم استضافته على بعد بضع قفزات فقط في مركز بيانات بالقرب من موقعهم الجغرافي.
         طالما أنك لا تستخدم أكثر من نطاقين ، فإن تقسيم العناصر بين نطاقات متعددة (مثل نطاقك الأساسي و CDN) سيؤدي إلى زيادة التنزيلات المتوازية المتزامنة في المستعرض. عند هذه النقطة ، تبدأ تكلفة البحث عن DNS في الحساب ضدك.

    

   1. 1. قلل من عدد عمليات البحث في DNS التي يتطلبها موقعك. قد يتطلب كل عنصر يستضيفه نطاق فريد بحثا إضافيا قد يضيف ثوان إلى وقت التحميل. حتى الطلبات على النطاقات ذات الصلة (مثل www.example.com و css.example.com) لا تزال تتطلب بحثا إضافيا. إذا كان هذا يبدو غير بديهي بعد أن أوصينا للتو باستخدام CDNs ، فذلك لأنه يجب أن يكون هناك وسيط سعيد. ما عليك سوى محاولة الحد من عدد النطاقات الإضافية المشار إليها. تذهب المحسنات المتطرفة إلى حد القضاء على جميع أزرار الوسائط الاجتماعية لأنها تنادي بكل مجال.

    

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

    

   1. 1. انقل جافا سكريبت إلى أسفل صفحتك. وهذا يضمن تحميل المحتوى قبل الانتظار على ملفات جافا سكريبت أكبر للتحميل.

    

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

    

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

    

   1. 1. قم بتحسين أحجام الملفات عن طريق إرسال أصغر حجم صورة تتطلبه الصفحة فقط. قم بتحرير الصورة لتكون بحجم البكسل الدقيق المطلوب على الصفحة. عند اختيار تنسيق ملف للصور، استخدم ملفات PNG أو JPEGs، بدلا من TIFFs وBMPs. استخدم أداة ضغط صورة مثل TinyPNG. إنها أداة رائعة لتقليص حجم ملف الصور قبل وضعها على موقعك. تجنب أيضا علامات المصدر الفارغة على الصور. تؤدي العلامة الفارغة إلى قيام المستعرض بإرسال طلب إضافي إلى الخادم.

    

   1. 1. تصغير الرمز. بمجرد اكتمال الصفحة ، قم بتشغيل رمز مصغر. يزيل إصدار Google (https://developers.google.com/speed/docs/insights/MinifyResources) جميع التعليمات البرمجية غير الضرورية ، مثل المساحات الفارغة والخطوط الفارغة وما إلى ذلك ، مما يوفر KBs من حجم الملف.

    

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

    

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

    

   1. 1. نصيحة مكافأة! اختبر موقعك بانتظام للتأكد من توافقه في متصفحات مختلفة بما في ذلك الأنظمة الأساسية المختلفة للجوال. بدأ زوار الجوال في السيطرة على سوق المتصفحات. ركز على اختبار موقعك على الجوال قبل سطح المكتب.

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

   ---

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