ویجتهای پیام تلگرام همان برنامه‌های کوچک HTML، CSS و جاوااسکریپت هستند که مستقیماً داخل حباب گفتگو زندگی می‌کنند: بازی، ماشین حساب، نظرسنجی یا پاسخ بات بدون باز کردن پنجره جداگانه و بدون مینیاپ اجرا میشوند. در کلاینت‌های تلگرام به آن‌ها نام‌های متفاوتی داده شده است — message widgets، HTML bubbles (ماژول HTMLBubbles در بتا برای مکاواس)، بلوک tgwidget در پیام غنی — اما همه درباره یک مکانیزم صحبت می‌کنند. این قابلیت در بتاهای تلگرام برای اندروید، iOS و مکاواس فعال است و لیست انتظار سازنده ویجت بدون کد در @catalogue_app باز شده است.
در لیست انتظار ویجتها بپیوندید
ویجت پیام چیست
پیام معمولی متن و مدیا را نشان می‌دهد. ویجت نوع جداگانه‌ای از مدیا، messageMediaWidget است: داخلش سند HTML فشرده با استایل و اسکریپت خودش، اندازه و دو مجموعه داده قرار دارد. کلاینت سند را در حباب رسم و جاوااسکریپت را در ساندباکس اجرا میکند؛ ویجت به کلیک‌ها واکنش نشان می‌دهد، انیمیشن دارد، وضعیت را ذخیره میکند و به موضوع چت پاسخ می‌دهد.
| ویجت پیام | مینیاپ | |
|---|---|---|
| کجا باز میشود | مستقیماً در نوار چت | در پنجره جداگانه روی چت |
| از چه چیزی ساخته شده | HTML، CSS و جاوااسکریپت داخل پیام | صفحه وب روی سرور توسعه‌دهنده |
| شبکه | ندارد: همه چیز لازم در پیام است | دارد، مثل سایت |
| ارسال مجدد | به عنوان پیام ارسال میشود، با وضعیت خودش | لینک ارسال میشود |
| ارتباط با بات | درخواست با کلیک، پاسخ تا 1 024 بایت | هر درخواستی به سرور خودش |
ویجتها کجا فعلاً کار می‌کنند
| کلاینت | نسخه | وضعیت |
|---|---|---|
| اندروید، بتا | 13.2.0 | ویجتها رسم و جاوااسکریپت اجرا میشوند |
| iOS، بتا | 13.2 | ویجتهای پیام و ابزارهای تست آن‌ها |
| مکاواس، بتا | 13.1.0 | ساندباکس، درخواست به بات، صحنه‌های سه بعدی با three.js |
| تلگرام دسکتاپ | 7.3 | هنوز ندارد |
بتای اندروید از طریق کانال بتا-تستینگ و لینک مستقیم در سایت تلگرام توزیع میشود. پروتکل کلاینت در آن لایه 233 است، یکی جدیدتر از نسخه عمومی: زیر ویجت در آن انواعی برای ارسال توسط سرور، پاسخ‌های اینلاین بات و بروزرسانی داده‌ها پس از ارسال وجود دارد.
ویجت چگونه روی اندروید کار میکند
مرورگری زیر ویجت وجود ندارد. ساختار توسط رندرر بومی بر پایه litehtml چیده و رسم میشود، و جاوااسکریپت توسط تفسیرگر QuickJS در جریان خودش اجرا میشود. DOM برای اسکریپت شبیه‌سازی شده است: تغییرات دسته‌جمعی به رندرر می‌روند و هر دسته قبل از رسم توسط اعتبارسنجی بررسی میشود. تشخیص اینکه آیا کلیک واقعی است یا نه، توسط قاضی لمس بومی انجام میشود، نه اسکریپت — بنابراین کلیک مصنوعی خود را به عنوان انگشت کاربر نشان نمی‌دهد.
تحلیل دقیق نسخه در مقاله درباره بتاهای اندروید و iOS آمده است.
ویجت چگونه روی iOS و مکاواس کار میکند
در پلتفرم‌های اپل، سند توسط WebKit در ماژول جداگانه WidgetSandbox رسم میشود که از شبکه با سه لایه بسته شده است: سیاست امنیت محتوا، لیست قوانینی که http، https و ws را مسدود میکند، و حذف کلاس‌های شبکه از پنجره قبل از اجرای کد. در بتای مکاواس همراه با ماژول HTMLBubbles کتابخانه three.js هم هست که پیام با لینک داخلی app:three به آن وصل میشود: صحنه‌های سه بعدی توسط رندرر متال برنامه رسم میشوند. اینکه این در اولین نسخه‌ها چه شکلی بود — در مقاله درباره بتای مکاواس آمده است.
توانایی‌های ویجت
- چیدمان و انیمیشن — flex، گرادینت، گرد کردن گوشه‌ها،
transform، انیمیشن‌های CSS و transitions. - گرافیک — SVG و canvas 2D: مسیرها، گرادینت، الگوها، کار با پیکسل‌ها.
- فرم‌ها — فیلدهای متنی، لیست‌ها، اسلایدرها، دکمه‌ها، بخش‌های کشویی.
- وضعیت —
localStorageبرای هر ویجت خاص است و با پیام ذخیره میشود: امتیاز بازی و داده‌های وارد شده با راه‌اندازی مجدد کلاینت زنده می‌مانند. - تم — رنگ‌های چت از متغیرهای CSS
--tg-theme-*می‌آیند و ویجت خودش در تم روشن و تیره رنگ عوض میشود. - بازخورد — لرزش از طریق
HapticFeedback، لینک با کلیک، کپی متن. - بات — با کلیک ویجت تا 64 بایت به بات خودش می‌فرستد و تا 1 024 بایت پاسخ می‌گیرد؛ بات می‌تواند داده‌های ویجت ارسالی قبلی را بروزرسانی کند.
- مشاهده‌گر — ویجت می‌داند چه کسی آن را باز کرده (id، نام، Premium) و در کدام چت است.
ویجت چه چیزی ندارد و چرا
شبکه‌ای اصلاً برای ویجت وجود ندارد: fetch، XMLHttpRequest، WebSocket و ورکرها جایگزین‌های توخالی دارند. این ویژگی است، نه نقص: ویجت دریافت شده نمی‌تواند IP خواننده را لو دهد و بدون اینترنت کار میکند. داده‌های زنده از طریق بات می‌آیند — با درخواست کلیک یا بروزرسانی پیام.
محدودیت برای یک وظیفه جاوااسکریپت — 500 میلی‌ثانیه پردازنده، حافظه — 64 مگابایت. ارتفاع حباب — از 50 تا 600 dp در اندروید و از 24 تا 900 pt در iOS. انیمیشن‌های خارج از صفحه متوقف میشوند.
چطور در محدوده سهمیه بمانیم
کار سنگین به قطعات کوچکتر از 500 میلی‌ثانیه از طریق requestAnimationFrame یا setTimeout تقسیم میشود. چرخه بازی با گام فیزیکی ثابت در سهمیه با فاصله جا میشود: رنر به سبک Geometry Dash کل سطح را در 3 289 فریم طی میکند در 30 میلی‌ثانیه پردازنده، تا 109 دستور کانواس در هر فریم.
چه چیزی میتوان ویجت کرد
- بازی‌ها — آرکیدهای کانواس، معماها، کلیک‌کننده‌ها، داستان‌های متنی، تورنمنت‌های امتیاز در همان چت.
- ویجتهای هوش مصنوعی — سوال با کلیک، پاسخ مدل از طریق بات در همان حباب.
- ماشین‌حساب‌ها و تبدیل‌کننده‌ها — ارزها، درصد، واحدها، تقسیم هزینه شرکت.
- نظرسنجی و کوئیز — با طراحی اختصاصی، امتیاز و نتیجه در محل.
- کارت‌ها و نمودارها — پروفایل، پیش‌بینی، آمار، ترسیم شده بر اساس داده‌های پیام.
- UI هوشمند — رابطی که بات برای درخواست خاص جمع میکند: فرم رزرو، انتخاب زمان، سبد خرید.
فقط همین نیست: ویجت سند HTML است و هر چیزی که در ساندباکس جا میشود می‌تواند در پیام ارسال شود.
🎮 بازی‌های پیامی — در لیست انتظار
🤖 ویجتهای هوش مصنوعی — در لیست انتظار
🧮 ماشین‌حساب‌ها و تبدیل‌کننده‌ها — در لیست انتظار
ویجت شخصی بدون کد
ویجت یک پیام با سند داخل است، بنابراین میتوان آن را از بلوک‌های آماده ساخت، بدون برنامه‌نویسی. سازنده ویجت بدون کد در @catalogue_app آماده است: قالب بازی، کوئیز یا ماشین حساب، متن و رنگ‌های خودش — و ویجت آماده به هر چتی می‌رود. نمونه شخصی را میتوان از بات مخصوص خودش، ساخته شده در همان @catalogue_app، ارسال کرد و قالب را به اشتراک گذاشت تا دیگران فورک کنند.
لیست انتظار کسانی را جمع میکند که ویجت شخصی می‌خواهند: وقتی ویجتها در همه برنامه‌های تلگرام منتشر شوند، @catalogue_app اول به آن‌ها می‌نویسد.
🧩 ویجت شخصی بدون کد — در لیست انتظار
بازی-ویجتی که فعلاً در بتای اندروید تلگرام کار میکند، با دستور /game در @catalogue_app ارسال میشود.
سوالات
HTML bubbles در تلگرام چیست؟
این نام ماژول ویجتها در بتای تلگرام برای مکاواس است: پیامی که با HTML و CSS چیده شده و جاوااسکریپت داخلی دارد، مستقیماً در حباب چت زندگی میکند. در اندروید و iOS همان مکانیزم با نام ویجتهای پیام شناخته میشود.
آیا میتوان فعلاً ویجت ارسال کرد؟
ویجتها در بتاهای اندروید، iOS و مکاواس رسم میشوند. روش ارسال در Bot API فعلاً وجود ندارد؛ در پروتکل بتا انواعی برای ارسال ویجت توسط سرور و پاسخ اینلاین بات وجود دارد.
تفاوت ویجت با مینیاپ چیست؟
مینیاپ پنجره جداگانه باز میکند و صفحه را از سرور بارگذاری میکند، ویجت در نوار چت زندگی میکند و تمام کد را در خود پیام حمل میکند. ویجت شبکه ندارد، ارتباط با جهان بیرون از طریق بات انجام میشود.
آیا باید برنامه‌نویسی بلد باشیم؟
برای نوشتن ویجت از صفر — بله، این HTML، CSS و جاوااسکریپت است. برای ساختن ویجت شخصی از قالب — خیر: برای همین سازنده بدون کد در @catalogue_app آماده میشود.
ویجتها کی در نسخه‌های پایدار منتشر میشوند؟
تلگرام تاریخ را اعلام نکرده است. مکانیزم فعلاً در بتاهای همه سه پلتفرم است و در بتای اندروید انواع پروتکل سروری برای آن وجود دارد.
