4 مستودعات
Using HTML attributes like sizes and srcset to optimize the selection of image sources.
Distinct from Image Loading: Candidates focus on container images or specific list-based loading, not native HTML image loading attributes.
Explore 4 awesome GitHub repositories matching web development · Image Loading Optimization. Refine with filters or upvote what's useful.
Simpl هي مكتبة أمثلة HTML وCSS وJavaScript توفر مجموعة من العروض التوضيحية الوظيفية البسيطة لتقنيات الويب الأساسية وواجهات برمجة تطبيقات المتصفح الأصلية. تعمل كمرجع للتنفيذ ومعرض أنماط لتطوير الواجهة الأمامية، حيث تقدم أمثلة عملية لكيفية تنفيذ ميزات الويب الشائعة. يعرض المشروع مجموعة واسعة من إمكانيات المتصفح، بما في ذلك اتصالات الويب في الوقت الفعلي عبر WebSockets وWebRTC، وتقنيات تصميم الويب المستجيب للتخطيطات التكيفية، وتنفيذ سير العمل دون اتصال باستخدام عمال الخدمة (service workers). كما يوفر عروضاً توضيحية للتخزين من جانب العميل باستخدام IndexedDB ومخازن القيمة الرئيسية القائمة على المتصفح. تغطي المكتبة سطحاً واسعاً من إمكانيات الويب، بما في ذلك تكامل الأجهزة مع مستشعرات الجهاز وتحديد الموقع الجغرافي، والتقاط وتشغيل الوسائط المتقدم للصوت والفيديو، واستخدام canvas لعرض الرسومات ثنائية وثلاثية الأبعاد. تشمل المجالات الإضافية معالجة البيانات، والبرمجة غير المتزامنة، واستخدام واجهات برمجة تطبيقات المتصفح لمراقبة الأداء واتصال الشبكة.
Shows how to use the sizes attribute to select the optimal image source based on display width.
هذا المشروع عبارة عن منهج تعليمي متقدم لـ CSS يتكون من ملفات أولية ومشاريع نهائية. يوفر مجموعة من التنفيذات الواقعية ومعرض مشاريع مصمم لإتقان تقنيات التخطيط والتصميم الحديثة. يركز المنهج على نهج نمطي لأوراق الأنماط باستخدام متغيرات Sass والمعمارية. يؤكد على اتفاقية تسمية المعدل-العنصر-الكتلة (BEM) لإنشاء CSS قابل للصيانة وإعادة الاستخدام. تغطي المادة عدة مجالات قدرات أساسية، بما في ذلك تصميم الويب المتجاوب باستخدام CSS Grid، وFlexbox، واستعلامات الوسائط. كما تتضمن تطوير تأثيرات الحركة من خلال إطارات CSS الرئيسية والانتقالات، بالإضافة إلى دمج رسومات المتجهات القابلة للتوسع والصور المحسنة لتصميم الواجهة الأمامية.
Optimizes page load speeds through efficient responsive image loading techniques.
Solito is a cross-platform navigation library and routing bridge that enables the development of mobile apps and web pages from a single codebase using React Native and Next.js. It functions as an orchestrator that synchronizes file-system based routing and screen logic across both platforms. The project provides a unified navigation interface that maps a single set of URLs to either web pages or native screens. This allows for synchronized linking and route parameters, ensuring that users land on the correct content regardless of whether they are using a browser or a mobile application. The
Generates optimized image URLs through a loader function and selects assets based on screen dimensions.
Imagor هو خادم معالجة صور عالي الأداء ومكتبة Go تعمل كوكيل صور عند الطلب. يوفر واجهة برمجة تطبيقات (API) آمنة لتحويل الصور وتغيير حجمها وتصفيتها وتحسينها، بالإضافة إلى أداة لإنشاء صور مصغرة ثابتة من ملفات الفيديو. يتميز النظام باستخدام محرك معالجة قائم على الطلب للتعامل مع الصور الكبيرة دون تحميل الملفات بالكامل في الذاكرة. ويتميز بتوقيع الطلبات المشفر لمنع التلاعب غير المصرح به في الروابط، ويستخدم تفاوض التنسيق القائم على الترويسة (header-based) لتقديم تنسيق الصورة الأكثر كفاءة الذي يدعمه متصفح العميل تلقائياً. يغطي المشروع مجموعة واسعة من القدرات، بما في ذلك اكتشاف منطقة الاهتمام، وإضافة العلامات المائية، وخلفيات التخزين القابلة للتوصيل. كما يدير دورات حياة الموارد من خلال تدفق البيانات المتزامن ويوفر تدابير أمنية مثل تنقية مسار الإدخال لمنع هجمات البرمجة عبر المواقع (XSS). يتضمن الخادم واجهة HTML لعرض صفحات الهبوط ونماذج الرفع.
Automatically serves the most efficient image format supported by the client's browser headers.