تعتبر تقنية DNS Prefetch لصفحات موقع الويب طريقة ممتازة من أجل زيادة سرعة موقع الويب. يمكننا استخدامه لإخبار المتصفح بتحميل الأكواد البرمجية التي يحتاجها المستخدم لتظهر له المعلومات المطلوبة في أسرع وقت.
الشرح الكامل اضافة اكواد DNS Prefetch لتسريع مدونات بلوجر |
وبالتالي تجنب الأكواد البرمجية التي لا يحتاجها الزائر الى حين ظهور الأكواد الأساسية فقط ، ومنه يتم تحميل لصفحة الويب بشكل أسرع ، ويمكن للمستخدمين تحقيق أهدافهم في أسرع وقت ممكن.
في هاذا الدرس، سأوضح لك كيفية اكواد dns prefetch لمدونة بلوجر من أجل تسريع مدونات بلوجر الخاص بك بإستخدام اكواد DNS-Prefetch.
ماهو كود تسريع مدونة بلوجر DNS Prefetch
التحميل المسبق (dns prefetch blogger) هو معيار ويب يهدف إلى تحسين إستجابة موقع الويب وتوفير المزيد من التحكم الدقيق في التحميل لأصحاب المواقع و المدونات.
إنه يمنح المطورين القدرة على تحديد منطق التحميل المخصص دون التعرض لعقوبة الأداء التي تتكبدها الأكواد البرمجية الثقيلة مثل أكواد js.
فوائد أكواد DNS Prefetch (التحميل المسبق)
تقنية التحميل المسبق لمواقع الويب تعتبر أكثر من أسلوب رائع لتحسين سرعة الموقع الخاص بك، وهو أسلوب عملي يتم تطبيقه بشكل سلس سواءا في منصة Blogger او wordpress.
وتتلخص بعض مزايا DNS Prefetch في العناصر التالية:
- زيادة سرعة استجابة الموقع الخاص بك
- يسمح للمتصفح بتحميل الموارد الأساسية فقط، التي يضعها صاحب الموقع
- تأخير المزيد من الموارد الغير ضرورية
- تحميل الصور و الأكواد البرمجية بشكل أسرع
- يأمر المتصفح بحفظ الموارد التي تم إستخدامها سابقا، ويتم إستخدامها اذا تمت عملية مشابهة
- تحديد أولويات تحميل الموارد بشكل أكثر دقة
- يتم تحميل الخطوط بشكل مبكر
مشكلات DNS Prefetch يجب عليك تجنبها
لكل تقنية مشاكل، ومشاكل هاته التقنية يمكن أن تنقلب عليك إذا لم يتم إستخدامها بالشكل المطلوب. فبدل أن تسرع استجاية الموقع الخاص بك يمكن أن تبطئ الموقع. لهاذا تجنب مايلي:
- عمليات بحث DNS الغير مستخدمة: نعم، يمكن لبعض الأشخاص أن يقومو بوضع أكواد DNS Prefetch زائدة ولا يتم إستخدامها أساسا. لهاذا إحرص على عدم إستخدام أكواد DNS التي لا تحتاجها
- وضع رابط موقعك داخل كود dns: لا تقم بإجراء الجلب المسبق لنظام أسماء النطاقات بالنطاق نفسه، لا يوجد سبب لتضمين رابط موقعك في كل من اكواد dns prefetch جديدة إلى نفس النطاق او الدومين
- تجنب إستخدام نطاقات مغلقة وغير ضرورية في كود DNS
كيفية تسريع مدونة بلوجرعبراضافة dns prefetch بلوجر
لتركيب اكواد dns prefetch لمدونة بلوجر يجب عليك أخذ نسخة إحتياطية للقالب الخاص بك، ثم إتباع الخطوات الأتية:
- إفتح منصة بلوجر وإختر الموقع الخاص بك
- إضغط على قسم المظهر، ثم تعديل html
- اضغط Ctrl+F وابحث عن قسم <head>
- اضف هاته الأكواد تحت قسم <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='//ajax.googleapis.com' rel='dns-prefetch'/>
<link href='//resources.blogblog.com' rel='dns-prefetch'/>
<link href='//feeds.feedburner.com' rel='dns-prefetch'/>
<link href='https://pagead2.googlesyndication.com' rel='dns-prefetch'/>
<link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/>
<link href='//www.gstatic.com' rel='preconnect'/>
<link href='https://fonts.gstatic.com' rel='dns-prefetch'/>
<link href='//static.xx.fbcdn.net' rel='dns-prefetch'/>
<link href='//tpc.googlesyndication.com' rel='dns-prefetch'/>
<link href='//apis.google.com' rel='dns-prefetch'/>
<link href='//themes.googleusercontent.com' rel='dns-prefetch'/>
<link href='//www.googletagservices.com' rel='dns-prefetch'/>
<link as='script' href='https://www.google-analytics.com/analytics.js' rel='preload'/>
<link href='//cdnjs.cloudflare.com' rel='dns-prefetch'/>
<link href='//www.youtube.com' rel='dns-prefetch'/>
<link href='https://www.facebook.com' rel='dns-prefetch'/>
<link href='//connect.facebook.net' rel='dns-prefetch'/>
<link href='//twitter.com' rel='dns-prefetch'/>
<link href='//platform.twitter.com' rel='dns-prefetch'/>
<link href='//www.pinterest.com' rel='dns-prefetch'/>
<link href='//www.linkedin.com' rel='dns-prefetch'/>
<link href='//use.fontawesome.com' rel='dns-prefetch'/>
طبعا الأكواد التي في الأعلى هي الأكواد التي يجب إضافتها في كل مدونة، على أساس انها الأكواد الأم ويجب إضافتها من أجل تسريع مدونة بلوجر بإستخدام نظام التحميل المسبق.
اكود dns prefetch ثانوية
كما نوهت سابقا، يوجد أكواد dns أخرى غير ضرويرية يجب عليك إضافتها في حالة تحقق شرط واحد. وهو إستخدامك لإضافة معينة او كود معين يحمل أحد الأسماء التي سوف أشرحها في الأسفل.
فمثلا: اذا كنت مثبت مثلا كود برمجي تابع لشركة github في الموقع الخاص بك. في هاته الحالة يجب عليك إضافة كود dns prefetch مخصص لشركة github ويكون بهاذا الشكل <link href='//github.com' rel='dns-prefetch'/> .
لهاذا عليك عزيزي المتابع إذا رأيت كود في قالبك يحمل احد هاته الأسماء في القائمة التالية فيجب عليك إضافة كود dns الخاص به.
<!-- Microsoft -->
<link href='//ajax.microsoft.com ' rel='dns-prefetch'/>
<link href='//ajax.aspnetcdn.com ' rel='dns-prefetch'/>
<!-- Github -->
<link href='//github.com' rel='dns-prefetch'/>
<!-- Twitter -->
<link href='//syndication.twitter.com' rel='dns-prefetch'/>
<link href='//r.twimg.com ' rel='dns-prefetch'/>
<link href=' http://p.twitter.com ' rel='dns-prefetch'/>
<link href=' http://cdn.api.twitter.com ' rel='dns-prefetch'/>
<!-- Vimeo -->
<link href='//player.vimeo.com' rel='dns-prefetch'/>
<!-- Amazon -->
<link href='//s3.amazonaws.com ' rel='dns-prefetch'/>
<!-- BuySellads -->
<link href='//s3.buysellads.com ' rel='dns-prefetch'/>
<link href='//stats.buysellads.com ' rel='dns-prefetch'/>
<link href='//cdn.adpacks ' rel='dns-prefetch'/></div>
الى هنا نكون أكملنا درس اضافة كود DNS Prefetch لتسريع مدونات بلوجر. الى دروس اخرى ومع السلامة.