هل الاضطرار إلى العديد من الصور الخلفية في CSS يؤثر على perfomance؟

StackOverflow https://stackoverflow.com/questions/937439

سؤال

بعض المستخدمين يبلغون أن موقعي بطيئ جدا وأعتقد أن الصور الخلفية في CSS قد تكون كولبري ممكن

لدي موقع يستخدم نظام بناء مخصص لتسلسل جميع CSS، وضغطها (ضاغط YUI)، وجعل Sprites CSS تلقائيا (SmartsPrite) وينتهي بك الأمر باستخدام CSS 9KB للصفحة بأكملها، وهذا يشمل جميع CSS للحصول على صور الخلفية في النهاية هو D هم حوالي 60 (عدة اذهب إلى نفس العفريت غير متأكد من عدد)

كنت أتساءل ما إذا كان السلوك الافتراضي للمتصفحات هو تنزيل الصور حسب الحاجة (عند مطابقة محدد) أو قم بتنزيلها جميعا.

الآن يبدو أن Firebug في Firefox يشير إلى أنه تم تنزيله جميعا. ما هي التقنيات التي تقترحها كنت أستخدمها لتجنب المشكلة، أو تخفيفها.

عدل

هل كانت مفيدة؟

المحلول

لا، في الواقع من الأفضل وضعها في CSS من في العلامة.

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

(يذهب دون أن يقول أن كل صورة من هذه الصور سوف تشغل عرض النطاق الترددي وطلبات HTTP إضافية)

نصائح أخرى

هو سلوك المتصفح الافتراضي هو تنزيل عنصرين في وقت واحد (أي طلبات HTTP 2)، إذا كنت تعتقد أن لديك الكثير من الصور إنشاء مجال فرعي لصورك images.yoursite.com وسوف تبدأ في رؤية المتصفحات التي تجعل طلب متوازي، ويمكنك أن ترى بعض التحسن في الأداء

(موضوع جانبي. لا يجيب حقا على سؤالك. ولكن قد تكون مثيرة للاهتمام أو حتى ذات صلة.)

أعتقد أن الجاني المحتمل آخر هو أن "بعض المستخدمين" سوف يشعرون دائما أن موقعك هو "بطيء جدا". (ربما يكون هناك الكثير من الانهيار العقلي من الشيء الفائض المكدس؟ ماذا يفعل هؤلاء المستخدمون أن يكونوا موقع سريع؟ هل يمكنهم إعطاء أمثلة؟ ما مدى سرعة اتصالهم والكمبيوتر؟ أين هم، وأين يقع الخادم الخاص بك؟ بالضبط بطيء؟ عملية الاشتراك؟ مشاهدة مقاطع الفيديو في HD؟ التمرير النافذة؟ تحميل فايرفوكس؟ بعد كل شيء، إنه البشر .. N'est PAS؟)

ربما نلقي نظرة فاحصة على الصورة (الصور) التي ترسلها، خاصة إذا كان هناك الكثير منهم يتم تجميعها في صورة واحدة "Sprite" واحدة.

ما يمكن أن يحدث هو أن الصورة التي تشير إليها كبيرة جدا. بالتأكيد، يجب تحميلها مرة واحدة فقط (فائدة طريقة العفريت)، ولكن إذا كان الأمر عدة مئات KB، فقد تسبب بالتأكيد بعض مشاكل الأداء.

هناك مساعد فايرفوكس لطيف يسمى Yslow الذي يمنحك بعض المعلومات المفيدة حول تحسين الأداء. يظهر لك مشاكل الأداء التي تم اكتشافها، ويمنحك روابط للمقالات التي تشير إلى تحسن.http://developer.yahoo.com/yslow/

بعض المعلومات حول أفضل الممارساتhttp://developer.yahoo.com/performance/rules.html.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top