المعاينات والمرفقات
ما هي خاصية Lazy Loading ؟
هي خاصية تقوم على ايقاف تحميل الصور في المتصفح ولا يتم تحميلها إلا عندما يصل اليها الزائر مما يجعل تحميل الصفحة أسرع لانه لا يتم تحميل كل الصور دفعه واحده ايضاً الزائر لا يحمل إلا الصور التي مر عليها فقط ولا يحمل الصور التي بنهاية الصفحة ان لم يصل لها فهذا موفر لأصحاب الباقات وسرعات الإنترنت الضعيفة
لماذا لا يوجد شروحات حول تلك الخاصية سابقاً في كن مدون؟
هذه الخاصة لها سنوات طويلة وكانت معتمده على اضافات JavaScript وكانت مشكلتها انها لا تنجح مع معظم القوالب اضافة قد يكون ما تعتمد من ملفات أكبر حتى من حجم الصور التي سيتم اخفائها فكانت في رأيي عبئ كبير ويصعب إيجاد إضافة واحده فعالة تعمل مع الجميع
ماذا تغير الآن ؟
اصبحت الآن الإضافة جزء من تجربة الويب وأصبحت سطر بسيط جداً لأن أغلب المتصفحات بدأت اعتمادها كجزء برمجي متعارف عليه فلم يعد هناك داعي لكتابة اكواد ووضع مكتبات جافا سكريبت كبيرة الخ
كيف يمكن ان نستخدمها؟
هذا هو الكود الطبيعي للصور
<img src="Image.jpg" loading="lazy" />
الجزء المعلم بالأحمر هو فقط ما تضيفه لصورك لا اكثر من ذلك ومعظم المتصفحات اصبحت تدعمها والمتصفح الذي لا يدعمها لا تسبب مشكلة معه لانها ليست كالإضافات السابقة التي ان لم يدعمها المتصفح لا تظهر الصور أصلاً لكن هذه لو لم يدعمها المتصفح ما تزال الصور ستظهر لكن دفعة واحده فهي فائدة بدون ضرر
طبقها على مواضيعك التي تحتوي صور كثيرة سيسرع هذا المواضيع
سؤال يطرح نفسه هل هناك وسيلة لتطبيقها مرة واحده على كل الصور؟
الإجابة ستعود مرة أخرى لنظام مكتبات الجفاسكريت والتي لم افضلها من الأصل
الاشتراك في:
تعليقات الرسالة (Atom)
شكرا لك أستاذ
ردحذفموضوع مميز كعادتك ♥
تسلم يا غالي , مرورك وتعليقك أصبح جزء من المواضيع
حذففلا تحرمنا منه , تحياتي لك ♥♥♥
الف شكر لك علي هذا الموضوع الرائع وهي فعلاً اضافة جميلة جداَ وانا استخدمها حاليا علي مدونتي فهي تسرع التحميل للقالب وكذلك تؤدي الي السماح لاعلانات ادسنس بالظهور بصورة طبيعية لان المحتوي يتحميل تحميله جزئياَ وليس دفعة واحدة خالص ودي وتقديري لمدونة (كن مدون ) التي استفدت منها الكثير ومانذال نتعلم منكم اخ عمرو فلا تحرمنا من مثل هذة المشاركات الرائعة .
ردحذفأشكرك أخي موسى على المرور الكريم اسعدني مرورك
حذفبارك الله فيكم.
حذفكيف نستفيد منها في القوالب.؟
وفيكم بارك الله
حذفلو تستطيع تحديد اكواد صور المواضيع وصور الإضافات في قالبك اضف لها الكود فقط
استاذى الفاضل
ردحذفلدى استفسار
كيف لى ان اخفى صورة الموضوع من داخل الموضوع ولكن تكن ظاهره خارج الموضوع
محتوى المدونة الخاص بى خاص بقنوات البث المباشر وعند جعل الصورة اخر الموضوع تظهر صورة القناة فى الخارج وعند تصغيرها جدا تظهر بدرجة نقاء غير جيدة فهل من طريقة من فضلك ؟
أضف للصورة هذا الكود
حذفstyle="display:none;"
بنفس الطريقة التي يضاف بها الكود الذي بالأعلى وستكون مخفية داخل الموضوع وظاهره خارجه بإذن الله
ملحوظة بعض القوالب طريقة تصميمها لا ينفع معها هذا الحل وهذا بسبب طريقة التكويد نفسها
اين اضف الكود بالضبط ؟
حذفتم نجاح الطريقة
حذفبارك الله فيك استاذى الفاضل لا شكر يصف شخصك الكريم
تحياتى وتقديرى لك
وفيك بارك الله أخي محمود والعفو يا طيب
حذفبالتوفيق أخي الكريم
شكرا على كل ماتقدمه لنا
ردحذفالعفو أخي احمد سررت بمروك يا طيب وعوداً حميداً
حذفممكن اخي تشرح اكثر اين اضع الكود بالضبط انا مبتدئة ولم افهم جيدا
ردحذفمرحباً بك اختي كل صورة تضيفيها في بلوجر سواء في القالب او في موضوع الكود الخاص بها يبدأ بهذا الشكل
حذف<img
وينتهي بكود اغلاق بهذا الشكل
/>
انت ستضيفي الكود الأحمر قبل كود اغلاق الصورة فقط سواء كانت في موضوع او في القالب
شكرا اخي على الرد وتوضيح جزاك الله خير
حذفالعفو أختي وجزيتم بالمثل , سررت بمرورك
حذفلم اعلق مند خمسة سنوات هاها وها انا اعود موضوع رائع طال الغياب تغير الكتير والكتير
ردحذفمرحباً بعودتك , يسعدني عودة اصدقاء المدونة القدامى دائماً
حذف