ضغط (ضغط) الصور بتنسيقات مختلفة

لكي تفتح صفحات الموقع بسرعة ، تحتاج إلى استخدام صور بأصغر وزن ممكن (حجم الملف). في نفس الوقت ، بعد الضغط ، يجب ألا تعاني جودة الصورة كثيرًا.

لمعرفة التنسيق الأفضل ، اختبرنا تنسيقات GIF و JPG و PNG و WEBP وقارنا أحجام الملفات الناتجة.

منهجية الاختبار

تم تنفيذ الضغط على موقع العمل باستخدام برنامجين:
• مكتبة رسومات GD ، مضمنة في PHP بشكل افتراضي.
• برنامج ImageMagick التابع لجهة خارجية وامتداد php Imagick .

من خلال تقليل إعداد الجودة من 100 إلى 0 في المائة ، تم العثور على قيمة ظلت فيها جودة الصورة مقبولة.

فقط قل أن كلاً من برنامجي GD و Imagick يعطي نفس النتيجة مع نفس معلمة الجودة (Q) ، لذلك يتم تقديم جميع الأمثلة فقط للصور التي تم الحصول عليها في برنامج GD .

الأحجام الفعلية للصور الكبيرة هي 1600x900 بكسل ، للصور المصغرة 400x225 بكسل - قد تختلف الأحجام المرئية.

صورة مصغرة (صورة مصغرة) 400x225 بكسل

من حيث الضغط ، فإن تنسيق WEBP هو زعيم لا يمكن إنكاره.

WEBP 3.55 كيلوبايت عند Q = 20٪	JPG 6.54 كيلوبايت عند Q = 30٪
GIF 53.2K ، Q مستقل	PNG 154 كيلوبايت ، بشكل مستقل عن Q

ملاحظة PNG

و شكل PNG هو انضغاط عمليا كلا البرنامجين ويعطي حجم الملف أمر من حجم أكبر من جميع الأشكال الأخرى. على وجه الخصوص ، في هذا الاختبار ، كان حجم ملفات PNG أكبر من تنسيق WEBP بأكثر من 40 مرة .

يمكن للمرء استخدام تنسيق PNG للصور ذات الخلفية الشفافة ، ومع ذلك ، يعمل تنسيق WEBP أيضًا مع قناة ألفا ، ويعطي ، في نفس الوقت ، نتيجة أفضل بكثير.

, , PNG .

GIF

GIF . GIF , . SVG, GIF ( gif-).

1600x900px

WEBP JPG, 50% .

WEBP 60,5 Q=30%

JPG 89,6 Q=40%

, WEBP . , , .

WEBP , .

400x225px.

JPG 2,24 Q=5%

JPG 3,35 Q=10%

JPG 5,16 Q=20%

WEBP 2,30 Q=5%

WEBP 2,73 Q=10%

WEBP 3,35 Q=20%

WEBP .

بالنسبة لبرامج GD و Imagick ، يوصى بتعيين قيمة الجودة على 20-30٪.