مساحة اعلانية

آخر المواضيع


Enable preload functionality on blog posts rel = 'preload' | تمكين وظيفة التحميل المسبق على مدونات بلوجر rel='preload'

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


يمكن بكل سهولة تمكين التحميل المسبق على بلوجر بإضافة رمز التحميل المسبق لملفات التغذية وملفات .js و .css. والصور والمستندات بإضافة الرمز rel='preload' لكل عنصر موجود على مدونتك.

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


ولتمكين وظيفة التحميل المسبق لملفات مدونتك يجب إضافة الرمز rel='preload' لجميع ملفات .js و.css والتغذية والتي تأتي بالشكل:

<script rel='preload' src='/feeds/posts/default?published&amp;alt=json-in-script&amp;callback=Sliderthumbs' type='text/javascript'/>
<script rel='preload' src='/feeds/posts/default?published&amp;alt=json-in-script&amp;callback=Sliderthumbs' type='text/javascript'/
او ملف فيسبوك وajax وملفات الخطوط
<script async='async' rel='preload' src='https://connect.facebook.net/ar_AR/all.js#xfbml=1'/>
<script async='async' rel='preload' src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' type='text/javascript'/>

<link rel="preload" href="/assets/font.woff2" as="font" type="font/woff2">
<link rel="preload" href="/style/other.css" as="style">
<link rel="preload" href="//example.com/resource" as="fetch" crossorigin>
<link rel="preload" href="https://fonts.example.com/font.woff2" as="font" crossorigin type="font/woff2">

الكــاتــب

    • مشاركة

ليست هناك تعليقات:

لا تذهب دون أن تترك تعليقك على الموضوع

جميع الحقوق محفوظة لــ مدونة كل العرب 2019 © DMCA.com Protection Status