القائمة الرئيسية

الصفحات

أخبار عاجلة[LastPost]

طرق تسريع تحميل المدونة

  

تسريع التحميل.

كيفية تسريع تحميل الموقع على الويب :


أفضل طرق لزيادة سرعة تحميل المدونة وموقعك:

المقال خدمة لتطوير الموقع العربي على شبكة الانترنت

محتوى المقال :

- أهمية سرعة تحميل الموقع والمدونة
- طرق التسريع بين الوهم والحقيقة 
- اربع طرق حقيقية ومؤثرة في سرعة التحميل
- عرض أفضل مواقع مفيدة في وسائل التسريع
- قياس سرعة بعض المواقع الشهيرة 
-ثانيا : 
التسريع عن طريق اضافة الأكواد  والسكريبتات

أهمية سرعة تحميل الموقع والمدونة:

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

طرق التسريع بين الوهم والحقيقة :

البعض من المطورين وأصحاب المواقع يتجه نحو طرق سهلة وسريعة لكنها قليلة الفائدة أو قل عديمة الفائدة مثل أكواد جافا سكريبت ووضعها في القالب بغرض زيادة السرعة ، ويطلب منك وضعها أعلى وسم /head أو فوق /body ،
ثم أني وجدتها أحيانا تبطئ تحميل الموقع  بنسبة 15 % ، فأنصحك الابتعاد عن تلك المواضيع والمواقع التي تقدم تلك السكريبات .
بل ان بعض تلك المواقع غرضها هو الحصول على معلومات عنك بهدف خبيث .
أما الأفضل عزيزي المطور والمدون ولتحقيق تحسن في زيادة سرعة التحميل فقد قمنا بتجميع أفضل الطرق وأكثرها فعالية وآمنة  فتعال معنا نستعرضها كالتالي :       

طرق حقيقية في تحسين سرعة تحميل الموقع :


تسريع الموقع.

1- ضغط أكواد الموقع :

مثل HTML , JAVA,CSS
يساهم في تقليل حجم كود الموقع وزيادة سرعة التحميل .
من المواقع التي توفر خدمة ضغط الأكواد /   http://www.htmlcompressor.com
وموقع http://www.refresh-sf.com 

ادخل الى المظهر / تعديل HTML / ثم ابحث عن السكريبات بامتداد .JS  -.CSS وانسخ الأكواد وضعها في الخانة المخصصة في موقع الضغط ، وبعد الضغط قم بنسخها
ولصقها مكان الكود الأصلي .

2- ضغط أحجام الصور :

فكلما كان حجم الصور( GIF , PNG, JPG ) أقل زاد سرعة تحميلها وبالتالي تحميل الصفحة .
ويكون ذلك عن طريق تقليل أبعاد الصورة وبالتالي وزنها ، فصورة حجمها مثلا 300 كليو بايت أو أكبر ،
ليس مثل صورة حجمها 25 أو 40 كيلو بايت عند تحميلها .
ويكون ثانيا : عن طريق ضغط الصورة .
ومن مواقع ضغط الصور الهامة : موقع iloveimg
يقدم مجاني ضغط وتغيير الحجم ونوع الصورة : ويقلل حجمها بنسب تتراوح بين 40 و 70 % حسب البرامج التي استخدمتها في تصميم الصور:
والرابط   , http://www.iloveimg.com/ar
ويتميز بسهولة التعامل في رفع وتنزيل الصورة تلقائيا .

3- تجنب الأكواد المحظورة :

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

4- أكواد الاعلانات Ads:

من الأسباب التي تؤثر بقوة في سرعة التحميل وتؤدي الى تقليل السرعات بنسبة كبيرة هي أكواد الاعلانات Ad Tag.
وعليك بالاكتفاء بعدد اثنين أو ثلاثة على الأكثر من الاعلانات ، 
ويفضل نوع البانر Banner Ad ،
وتجنب بعض أنواع الاعلانات خاصة النوافذ المنبثقة pop-Up" " فهي مزعجة و ضارة وأقل منها الجانبية slider. 

5- الاستفادة من المواقع الخاصة بالتحليل وأدوات قياس سرعات التحميل ،

ومعايرة موقعك عليها .
والوقوف على أسباب البطيء وكيفية التخلص من أسباب ضعف تحميل الموقع .
ودلالة نتائج قياس سرعة موقعك بعد اضافة رابطه الى أداة التحليل :
فان كانت نسبة السرعة أقل من 50 فهذا يعني أن تحميل الموقع بطيء وغير مقبول .
أما من 50 الى 90: فهو متوسط مقبول ،
وأكبر من 90 : فهو جيد .
موقع قياس وتحليل السرعة : PageSpeed Insights من جوجل .
 http://www.developers.google.com/speed/pagespeed/insights 

- قياس سرعة المواقع الشهيرة :

نتائج التحليل بعضها كان مفاجأة فهي بطيئة بمعايير سيو وجوجل 
-فمن المواقع الاخبارية مثلا تم رصد سرعة : موقع اليوم السابع youm7.com
حيث كانت السرعة على الجوال : 11 وعلى الكمبيوتر: 30

قياس اليوم السابع 


-ومن المواقع الرياضية : موقع في الجول filgoal.com
نسبة السرعة على الجوال كانت (27) وأجهزة سطح المكتب (38)
في الجول 

-ومن أشهر المدونات العربية :
موقع عالم التقنية 
قياس السرعة جاء كالتالي ( 25 /جوال ، 85 / سطح المكتب )..


قياس موقع فكر الاسلام :



تحليل السرعة باستخدام GTmetrix



تحليل سرعة الموقع PageSpeed






تسريع التحميل بالأكواد 


ثانيا تسريع المدونة والموقع بالأكواد 

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

أولا : استبدال  وسم head , body


1- head

قم بالبحث في الصفحة الخاصة بكود الموقع (HTML) عن <head> وتعويضه ب

&lt;head&gt;


2- body

قم كذلك بالبحث عن <body> وتعويضه ب

<!-- <body><div></div> -->


ثانيا : حذف ملف Cookiechoices.js

وهو المسؤول عن إشعار ملفات تعريف الإرتباط حيث أنه يقرأ الدولة والمكان ويقوم بتخزين المعلومات لقرائتها يمكنك التخلص منه بإستبدال الرمز </body> بالكود  التالي:

&lt;noscript&gt;

&lt;!--</body>--&gt;

&lt;/noscript&gt;

&lt;/body&gt;


ثالثا : جلب المتصفح للموارد


بمساعدة علامة <“link rel = “preload>، يمكنك إعلام المتصفح بأن هناك حاجة إلى مورد كجزء من الشفرة المسؤولة عن عرض محتوى الجزء المرئي من الصفحة، وجعله يجلب المورد في أقرب وقت ممكن 

قم بنسخ تلك الأكواد وضعها معها الميتا تاج أعلا الوسم /head 

<link rel="preload" as="script" href="super-important.js"/>

<link rel="preload" as="style" href="critical.css"/>


رابعا : توفير وقت انشاء الاتصالات


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

<link rel="preconnect" href="https://example.com"/>


خامسا :تحسين ملف أجاكس

ملف اجاكس أو مكتبة ajax موجودة في جميع قوالب بلوجر ويجب تضمين علامة async='async' كما هي في الكود الآتي : 



<script async='async' src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' type='text/javascript'/>


سادسا : تقليل وقت إستجابة خوادم الروابط الخارجية



تتضمن هذه الطريقة فعالية في تسريع إستجابة الـ DNS والتخزين المؤقت فقط بإضافة الكود التالي أسفل الرمز <head> لتسهم في تحسين ذاكرة التخزين المؤقت بالمتصفح.

<link href='//1.bp.blogspot.com' rel='dns-prefetch'/>

<link href='//28.2bp.blogspot.com' rel='dns-prefetch'/>

<link href='//3.bp.blogspot.com' rel='dns-prefetch'/>

<link href='//4.bp.blogspot.com' rel='dns-prefetch'/>

<link href='//2.bp.blogspot.com' rel='dns-prefetch'/>

<link href='//www.blogger.com' rel='dns-prefetch'/>

<link href='//maxcdn.bootstrapcdn.com' rel='dns-prefetch'/>

<link href='//fonts.googleapis.com' rel='dns-prefetch'/>

<link href='//use.fontawesome.com' rel='dns-prefetch'/>

<link href='//ajax.googleapis.com' rel='dns-prefetch'/>

<link href='//resources.blogblog.com' rel='dns-prefetch'/>

<link href='//www.facebook.com' rel='dns-prefetch'/>

<link href='//plus.google.com' rel='dns-prefetch'/>

<link href='//twitter.com' rel='dns-prefetch'/>

<link href='//www.youtube.com' rel='dns-prefetch'/>

<link href='//feedburner.google.com' rel='dns-prefetch'/>

<link href='//www.pinterest.com' rel='dns-prefetch'/>

<link href='//www.linkedin.com' rel='dns-prefetch'/>

<link href='//feeds.feedburner.com' rel='dns-prefetch'/>

<link href='//github.com' rel='dns-prefetch'/>

<link href='//player.vimeo.com' rel='dns-prefetch'/>

<link href='//platform.twitter.com' rel='dns-prefetch'/>

<link href='//apis.google.com' rel='dns-prefetch'/>

<link href='//connect.facebook.net' rel='dns-prefetch'/>

<link href='//cdnjs.cloudflare.com' rel='dns-prefetch'/>

<link href='//www.google-analytics.com' rel='dns-prefetch'/>

<link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/>

<link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/>

<link href='//www.gstatic.com' rel='preconnect'/>

<link href='//www.googletagservices.com' rel='dns-prefetch'/>

<link href='//static.xx.fbcdn.net' rel='dns-prefetch'/>

<link href='//tpc.googlesyndication.com' rel='dns-prefetch'/>

<link href='//syndication.twitter.com' rel='dns-prefetch'/




: لتأجيل تحميل الصور خارج الشاشة - lazy load سابعا: كود 


ضع هذا السكريبت فوق  الوسم  /head



<script type='text/javascript'>/* by : www.arabes1.com */

//<![CDATA[

(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"http://i22.servimg.com/u/f22/15/42/72/40/grey10.gif",effect:"fadeIn",threshold:"-50"})})//]]>

/* by : www.arabes1.com */ </script>

نرجو ان نكون قدمنا لكم أغلب طرق الفعالة والحقيقية في تحسين سرعة تحميل مواقع الويب

تعليقات