العناصر التفاعلية في رسائل تيليجرام هي برامج صغيرة مبنية من HTML وCSS وJavaScript، تعيش مباشرة داخل حجرة المحادثة: لعبة، آلة حاسبة، استطلاع، أو رد من روبوت يُفتح دون نافذة منفصلة وبلا تطبيق صغير (Mini App). تُعرف هذه العناصر في تطبيقات تيليجرام بأسماء مختلفة — "عناصر الرسائل" (message widgets)، أو "بالونات HTML" (HTML bubbles) في النسخة التجريبية لـ macOS، أو ككتلة tgwidget في الرسائل الغنية — لكنها تشير إلى آلية واحدة. هذه الآلية تعمل بالفعل في النسخ التجريبية لتيليجرام لأجهزة أندرويد، آيفون، وماك أو إس، وقائمة الانتظار لمنشئ العناصر بدون كود مفتوحة الآن في @catalogue_app.
الانضمام إلى قائمة الانتظار للعناصر التفاعلية
ما هي العناصر التفاعلية في الرسائل؟
الرسالة العادية تعرض نصًا ووسائط. أما العنصر التفاعلي فهو نوع من الوسائط الخاص بـ messageMediaWidget: يحتوي داخله على مستند HTML مضغوط مع أنماطه ونصوصه، وحجمين مختلفين للبيانات. يرسم العميل المستند داخل حجرة المحادثة ويُنفّذ JavaScript الخاص به داخل بيئة آمنة (سандبوكس)، ويتفاعل العنصر مع النقرات، ويُظهر تأثيرات حركية، ويحفظ حالته، ويتكيف مع موضوع المحادثة.
| العنصر التفاعلي في الرسالة | تطبيق صغير (Mini App) | |
|---|---|---|
| مكان الفتح | مباشرة داخل تدفق المحادثة | في نافذة منفصلة فوق المحادثة |
| المكونات | HTML وCSS وJavaScript داخل الرسالة | صفحة ويب على خادم المطور |
| الاتصال بالإنترنت | لا: كل ما يحتاجه موجود داخل الرسالة | نعم، مثل موقع ويب |
| إعادة الإرسال | تُرسل كرسالة مع حالته الخاصة | تُرسل رابطًا فقط |
| الاتصال بالروبوت | طلب عند النقر، رد يصل إلى 1024 بايت | أي طلبات إلى خادمه الخاص |
أين تعمل العناصر التفاعلية بالفعل؟
| العميل | الإصدار التجريبي | الحالة |
|---|---|---|
| أندرويد، تجريبي | 13.2.0 | العناصر تُرسم وتنفذ JavaScript |
| آيفون، تجريبي | 13.2 | العناصر في الرسائل وأدوات فحصها |
| ماك أو إس، تجريبي | 13.1.0 | بيئة آمنة، طلبات للروبوت، مشاهد 3D باستخدام three.js |
| تيليجرام ديسكتوب | 7.3 | لا يزال غير مدعوم |
تُوزع النسخة التجريبية لأندرويد عبر قناة مختبرات التجريبي أو عبر رابط مباشر من موقع تيليجرام. بروتوكول العميل فيها يستخدم طبقة 233، وهي واحدة أكثر من النسخة العامة: تضم بالفعل أنواعًا لتسليم العناصر من الخادم، وإجابات داخلية للروبوتات، وتحديث البيانات بعد الإرسال.
كيف تعمل العناصر التفاعلية على أندرويد
لا يوجد متصفح تحت العنصر التفاعلي. يتم ترتيب التصميم ورسمه بواسطة محرك أصلي مبني على litehtml، ويُنفّذ JavaScript بواسطة مفسر منفصل يُسمى QuickJS في خيط منفصل. يتم محاكاة DOM للسّكريبت: التغييرات تُرسل إلى المحرك كحزم، ويتم التحقق من صحتها بواسطة مُحقق قبل كل عملية رسم. النقر الحقيقي يُحدد بواسطة "القاضي الأصلي" (Native Touch Judge)، وليس بواسطة السكربت — لذلك لا يمكن للنقر الاصطناعي أن يُقلّد نقرة المستخدم الحقيقي.
لتحليل مفصل للإصدار التجريبي، انظر المقال عن النسخ التجريبية لأندرويد وآيفون.
كيف تعمل العناصر التفاعلية على آيفون وماك أو إس
على منصات آبل، يتم رسم المستند بواسطة WebKit داخل وحدة منفصلة تُسمى WidgetSandbox، وتُعزل عن الإنترنت بثلاث طبقات: سياسة أمان المحتوى، قائمة قواعد تمنع http وhttps وws، وحذف فئات الشبكة من النافذة قبل تشغيل الكود. في النسخة التجريبية لـ ماك أو إس، تأتي الوحدة HTMLBubbles مع مكتبة three.js، التي تُربط داخل الرسالة عبر رابط داخلي app:three: تُرسم المشاهد ثلاثية الأبعاد بواسطة محرك Metal داخل التطبيق. كيف بدا الأمر في الإصدارات الأولى — انظر المقال عن النسخة التجريبية لـ ماك أو إس.
ماذا يستطيع العنصر التفاعلي؟
- التصميم والتحريك — دعم لـ
flex، التدرجات، الحواف الدائرية،transform، والتحريك باستخدام CSS والـ transitions. - الرسومات — دعم لـ SVG وcanvas 2D: مسارات، تدرجات، أنماط، وعمل مباشر على البكسلات.
- النماذج — حقول نصية، قوائم، شريط تمرير، أزرار، وأقسام قابلة للانفراج.
- الحالة — كل عنصر يملك
localStorageخاص به، يُخزن مع الرسالة: عدد النقاط في اللعبة أو البيانات المدخلة تبقى حتى بعد إعادة تشغيل العميل. - السمة البصرية — ألوان المحادثة تصل عبر متغيرات CSS
--tg-theme-*، ويُعدّل العنصر تلقائيًا حسب الوضع الفاتح أو المظلم. - الاستجابة — اهتزاز عبر
HapticFeedback، روابط عند النقر، نسخ نص. - الروبوت — عند النقر، يرسل العنصر إلى روبوته حتى 64 بايت، ويستقبل ردًا يصل إلى 1024 بايت؛ ويمكن للروبوت تحديث بيانات العنصر المرسل مسبقًا.
- المُشاهد — يعرف العنصر من فتحه (ID، الاسم، Premium)، وفي أي محادثة يقع.
ماذا لا يستطيع العنصر التفاعلي، ولماذا؟
لا يوجد اتصال بالإنترنت على الإطلاق: fetch وXMLHttpRequest وWebSocket وWorkers تم استبدالها بمحاكيات. هذه ليست عيبًا، بل خاصية مقصودة: لا يمكن للعنصر المُستقبل أن يكشف عن IP القارئ، ويُعمل دون اتصال بالإنترنت. البيانات الحية تأتي عبر الروبوت — إما بطلب عند النقر، أو بتحديث بيانات الرسالة.
الحد الأقصى للعملية: 500 مللي ثانية من المعالج، و64 ميجابايت من الذاكرة. ارتفاع حجرة الرسالة: من 50 إلى 600 dp على أندرويد، ومن 24 إلى 900 pt على آيفون. تُوقف التحريك عند الخروج عن الشاشة.
كيف تلتزم بالحد الأقصى
تُقسّم المهام الثقيلة إلى أجزاء أقل من 500 مللي ثانية باستخدام requestAnimationFrame أو setTimeout. دورة الألعاب ذات الخطوة الثابتة في الفيزياء تُناسب الحد بسعة: مُنافس من نوع Geometry Dash يُكمل مستوى كاملًا في 3289 إطارًا بـ 30 مللي ثانية من المعالج، مع ما يصل إلى 109 أمرًا على canvas لكل إطار.
ماذا يمكن إنشاؤه باستخدام العنصر التفاعلي؟
- ألعاب — ألعاب أركادا على canvas، ألغاز، ألعاب نقر، مغامرات نصية، بطولات للنقاط مباشرة داخل المحادثة.
- عناصر ذكية بالذكاء الاصطناعي — سؤال بنقرة، إجابة من نموذج عبر الروبوت داخل نفس الحجرة.
- آلات حاسبة ومحوّلات — عملات، نسب مئوية، وحدات قياس، تقسيم فاتورة بين الفريق.
- استبيانات ومسابقات — بتصميم خاص، مع عداد ونتائج مباشرة في المكان.
- بطاقات ورسوم بيانية — ملف شخصي، توقعات، إحصائيات، مرسومة حسب بيانات الرسالة.
- واجهات ذكية — واجهة يُنشئها الروبوت حسب الطلب: نموذج حجز، اختيار وقت، سلة مشتريات.
وليس هذا كل شيء: العنصر هو مستند HTML، وكل ما يُمكن دمجه داخل البيئة الآمنة يمكن إرساله كرسالة.
🎮 ألعاب في الرسائل — الانضمام إلى قائمة الانتظار
🤖 عناصر ذكاء اصطناعي — الانضمام إلى قائمة الانتظار
🧮 آلات حاسبة ومحوّلات — الانضمام إلى قائمة الانتظار
اصنع عنصرك التفاعلي بدون كتابة كود
العنصر التفاعلي هو رسالة واحدة تحتوي مستندًا داخليًا، لذا يمكن تجميعه من كتل جاهزة دون برمجة. منشئ العناصر بدون كود جاهز في @catalogue_app: اختر قالب لعبة، استبيان، أو آلة حاسبة، عدّل النصوص والألوان، وستحصل على عنصر جاهز يُرسل إلى أي محادثة. يمكن إرسال نسخة خاصة من خلال روبوتك الخاص المُنشأ في نفس @catalogue_app، ومشاركة القالب لتمكين الآخرين من إنشاء نسخة مُستنسخة (fork).
تجمع قائمة الانتظار من يرغبون في إنشاء عناصرهم الخاصة: عندما تُطرح العناصر في جميع إصدارات تيليجرام الرسمية، سيُخبرهم @catalogue_app أولًا.
🧩 اصنع عنصرك بدون كود — الانضمام إلى قائمة الانتظار
لعبة-عنصر تفاعلي تعمل بالفعل في النسخة التجريبية لأندرويد لتيليجرام، تُرسل عبر الأمر /game في @catalogue_app.
الأسئلة الشائعة
ما هو "بالونات HTML" في تيليجرام؟
هذا هو اسم الوحدة التي تُستخدم لعرض العناصر التفاعلية في النسخة التجريبية لتيليجرام على ماك أو إس: رسالة مُصممة بـ HTML وCSS مع JavaScript مدمج، تعيش مباشرة داخل حجرة المحادثة. في أندرويد وآيفون، يُعرف نفس المفهوم بـ "العناصر التفاعلية في الرسائل".
هل يمكن إرسال عنصر تفاعلي الآن؟
نعم، تُرسم العناصر التفاعلية في النسخ التجريبية لأندرويد، آيفون، وماك أو إس. لا يزال لا يوجد وسيلة لإرسالها عبر Bot API، لكن بروتوكول النسخة التجريبية يحتوي بالفعل على أنواع لتسليم العنصر من الخادم وإرسال إجابة داخلية من الروبوت.
ما الفرق بين العنصر التفاعلي وتطبيق صغير (Mini App)؟
يُفتح تطبيق صغير في نافذة منفصلة ويحمّل صفحة من خادم المطور، بينما العنصر التفاعلي يعيش داخل تدفق المحادثة ويحمل كل الكود داخل الرسالة نفسها. لا يوجد اتصال بالإنترنت للعنصر التفاعلي، والاتصال بالعالم الخارجي يتم عبر الروبوت فقط.
هل أحتاج إلى معرفة البرمجة؟
لإنشاء عنصر من الصفر — نعم، تحتاج إلى HTML وCSS وJavaScript. لكن لبناء عنصر من قالب جاهز — لا، وهذا بالضبط ما يُعدّه منشئ العناصر بدون كود في @catalogue_app.
متى ستُطرح العناصر التفاعلية في الإصدارات الرسمية؟
لم يُعلن تيليجرام عن تاريخ محدد. الآلية موجودة بالفعل في النسخ التجريبية لجميع المنصات الثلاث، وتم تجهيز أنواع بروتوكول للخادم في النسخة التجريبية لأندرويد.
