العودة
مطوّر يخزّن موقعًا كاملًا داخل بكسلات أيقونة الموقع
SiTech AI Team2 წთ. საკითხავი

مطوّر يخزّن موقعًا كاملًا داخل بكسلات أيقونة الموقع

قام تيم فيرله بترميز صفحة HTML داخل صورة favicon: محتوى بحجم 208 بايت يتّسع في صورة PNG بقياس 9x9 بكسلات، ويقرأه المتصفح مجددًا عبر واجهة canvas، غير أن المطوّر نفسه يعترف بأن الفائدة العملية شبه معدومة.

لكل موقع على الويب أيقونة favicon: الرمز الصغير الذي يظهر في تبويب المتصفح، يُرفع مرة واحدة ثم يُنسى. قلب المطوّر تيم فيرله هذه الفرضية، وبنى عرضًا تجريبيًا تُخزَّن فيه صفحة ويب كاملة داخل بكسلات أيقونة الموقع، ويقوم المتصفح بفك ترميزها وقت التشغيل.

بايتات مخفية داخل قنوات RGB

النهج شكل مباشر من إخفاء المعلومات. كل بكسل في الصورة يحمل قيم الأحمر والأخضر والأزرق، أي ثلاثة بايتات. أخذ فيرله بايتات UTF-8 لمستند HTML صغير وكتبها مباشرة في هذه القنوات، بكسلًا بعد بكسل، فأنتج صورة تبدو كتشويش بصري. تُضاف في البداية ترويسة من أربعة بايتات تحمل طول البيانات، لأن الصورة قد تحتوي في نهايتها بكسلات غير مستخدمة، وبدون قيمة الطول لا سبيل لمعرفة أين تنتهي البيانات الحقيقية.

بلغ حجم البيانات نفسها 208 بايتات فقط من HTML، ومع الترويسة صار المجموع 212 بايتًا. وبحساب ثلاثة بايتات لكل بكسل يلزم 71 بكسلًا، وأصغر صورة مربعة تتّسع لها هي 9x9 بكسل، أي 81 بكسلًا. وتستخدم الصورة النهائية 87 في المئة من سعتها البالغة 239 بايتًا.

كيف تُقرأ الصفحة مرة أخرى

استعادة الصفحة تعتمد على واجهات يوفّرها كل متصفح أصلًا. تُحمَّل أيقونة الموقع كصورة، وتُرسم على عنصر canvas، ثم يقرأ JavaScript البكسلات عبر واجهة canvas. يعيد الكود بناء مصفوفة البايتات، ويقرأ البايتات الأربعة الأولى لمعرفة طول البيانات، ويستخرجها ويفكّ ترميزها كنص UTF-8، وعندها يعود مستند HTML الأصلي متاحًا.

ثمة تفصيل مهم: أيقونة الموقع لا تحتوي الموقع نفسه، بل تحتوي محتوى الموقع. لا يزال هناك حاجة إلى سكربت إقلاع صغير لفك ترميز الصورة؛ فمن دون JavaScript لا يعدّ الملف سوى صورة PNG تصادف أنها تحمل HTML. ويتضمّن صفحة العرض التجريبي زرًا باسم "Render Website" يقرأ الأيقونة ويفك ترميز HTML ويستبدل الصفحة بالمحتوى المستعاد.

هل هذا مفيد؟ في الواقع لا — وهذا هو بيت القصيد

يقول فيرله ذلك صراحة: السعة ضئيلة، والصفحة لا تستطيع إقلاع نفسها من دون JavaScript، لذا توجد عشرات الطرق الأفضل لنشر مستند HTML صغير. وتجربة اليوم امتداد لعمل سابق خزّن فيه بايتين داخل سجل DPI في الفأرة، وهي تنتمي إلى الفئة نفسها: اختبار ما يحتمله تنسيق عادي.

ويعدّد أيضًا بدائل: تضمين الترميز مباشرة في أيقونة SVG، أو استخدام كتل التعليقات في PNG مثل tEXt وzTXt وiTXt، أو صيغة ICO القادرة على حمل عدة أيقونات بدقات مختلفة. العرض التجريبي متاح على موقعه، والشفرة المصدرية منشورة على GitHub.

SSiTech

SiTech — تطوير ويب مدعوم بالذكاء الاصطناعي

نبني مواقع سريعة وعصرية وندمج الذكاء الاصطناعي في سير عمل الشركات. لديك مشروع أو سؤال؟ يسعدنا مساعدتك.