أفضل طرق لزيادة سرعة مدونة بلوجر

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

<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'/>

هذا هوا jquery.J's للمكتبة ، كل ما نفعل هوا أننا سنقوم بتأجيل تحميل السكريبت وذلك إضافة وسم التأجيل هكذا يبدو السكريبت بعد الإضافة.

<script async='async' src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'/>

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

<link href='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'/>

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

ملاحطة: ضع الوسم Link تحت وسم <head> مباشرة.

<link as='script' href='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js' rel='preload'/>

كيف أتخلص من CSS

هل يوجد طرق لي التخلص من كتل وأحجام منطقة CSS هذا مستحيل ، ولكن توجد طريقة ناجحة لتقليل طرر الألوان وأحجام منطقة CSS لنقوم بشرح صغير عن هده النطقة الحساسة.

تقليل تأثيرات الرسوم في منطقة CSS

الأن سنقوم بالإضافات الازمة لنتخلص من التحميل المسبق لي الكتل مثل إقونات التواصل الإجتماعي واليوتيوب وغيرها من الكتل وترمز لها وسم dns ، وكذلك وسم fontawesome J's و التحميل المسبق font woff2 بالنسبة لي الصفحة كذلك نضع سكريبت خاص بها.

إضافة DNS prefetch

أضف هذا الوسم تحت أسفل هدا الوسم <head> مباشرة.

&lt;head&gt;
<link href='//fonts.gstatic.com' rel='dns-prefetch'/> 
  <link href='//1.bp.blogspot.com' rel='dns-prefetch'/> 
  <link href='//2.bp.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='//www.blogger.com' rel='dns-prefetch'/> 
  <link href='//dnjs.cloudflare.com' rel='dns-prefetch'/> 
  <link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/> 
  <link href='//www.googletagmanager.com' rel='dns-prefetch'/> 
  <link href='//www.google-analytics.com' rel='dns-prefetch'/> 
  <link href='//connect.facebook.net' rel='dns-prefetch'/> 
  <link href='//c.disquscdn.com' rel='dns-prefetch'/> 
  <link href='//disqus.com' rel='dns-prefetch'/> 
  <link href='//www.w3.org' rel='dns-prefetch'/> 
  <link href='//www.youtube.com' rel='dns-prefetch'/> 
<link href='//feeds.feedburner.com' rel='dns-prefetch'/>

هده الإضافة تجلب أسبقية التحمل المسبق لي الصفحات في بلوجر ، وتقلل من تحميل الإقونات الغير طرورية في أولوية التحمل.

إضافة تأجيل fontawesome J's

أضف هذا الوسم كما هوا موضح وترك السكريبت في مكانه.

<script crossorigin='anonymous' src='https://kit.fontawesome.com.js'/>

أضفنا هذا الوسم anonymous في بداية الوسم سكريبت لي الكتل في منطقة CSS لتأجيل عرض الإقونات.

تأجيل تحميل المسبق للخطوط الإفتراطية في منطقة CSS

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

<link as='font' crossorigin='' href='https://ka-f.fontawesome.com/releases/v5.15.4/webfonts/free-fa-solid-900.woff2' rel='preload' type='font/woff2'/>

في محرك قياس سرعة الموقع بعد إختبارك لي الصفحة ، من المحتمل أنك ستواجه مشكلة في خطوط الويب الغير مرإية ، كل ما عليك فعله هوا أنك ، تقوم بستبذال الرابط فقط بالرابط الخاص بك و هدا حسب ما يوعطيك متصفح قياس السرعة ، في خطأ الخطوط woff2 غير المرئية ضع الكود تحت وسم <head> مباشرة.

Warning message : ملاحطة يوجد 3 خطوط أو أكثر في القوالب ، قوالب مدون ميتيوم غير مختارة في هده العملية.

هنا نكون قد إنتهينا شكرا لكم جزيل الشكر تابعنا بالبريد.