چگونه یک استریم به نمایش در می آید؟

برای اینکه بدونیم پروسه دیدن یه ویدئو به صورت لایو چجوریه، بهتره اول یه کم با مفاهیم اولیه ویدئو آشنا بشیم.مفهوم اول: FPSعکس شماره 1در واقع مخفف شده Frame Per Second هستش و به تعداد Frame هایی که تو یک ثانیه نمایش داده میشه رو میگن FPS. حالا هر چقد که FPS بالاتر باشه، تصویری که میبینیم روان تر هستش.حالا به تصویر زیر نگاه کنید. یه تصویر ثابت با FPS های مختلف.عکس شماره 2میبینیم که هر چی FPS بالاتر میره، تصویر روان تری رو میبینیممفهوم دوم: Codecعکس شماره 3مخفف compression/decompression هستش و برای code/decode کردن ویدئو ازش استفاده میکنیم.کارش اینه که یه ویدئو حجیم و فشرده نشده یا raw رو میگیره و اون ویدئو رو فشرده میکنه. نوع های مختلفی داره که از معروف ترین هاش میشه به MPEG-4 یا XviD - DivX یا H.264 - x264 اشاره کرد.مفهوم سوم: Key Frameعکس شماره 4گفتیم Codec میاد حجم ویدئو رو کم میکنه. یکی از روش هایی که با اون این کارو انجام میده اینه که فرض کنید میاد Frame اول ویدئوتون رو میگیره و Frame های بعدی رو نسبت به تغییر اون Frame قبلی در نظر میگیره، به جای اینکه کل Frame رو نمایش بده.حالا به Frame هایی که به صورت کامل گرفته شدن و فریم هاشون از Frame دیگه ای Reference داده نشده رو میگن Key Frameحالا یه مفهوم دیگه هم داریم به اسم Key Frame Interval که میگه هر چند Frame ما یه Key Frame داریم که تو عکس شماره 5 میبینیم که Key Frame Interval ما 8 و 4 هستش.عکس شماره 5مفهوم چهارم: Bitrateعکس شماره 6به حجم دیتایی که در یه زمان مشخص انتقال داده میشه میگن Bitrate. حالا چه کارایی داره؟هر کیفیتی از ویدئو مثل 1080 یا 720 یا 360 یا ... دارای Bitrate متفاوت هستش. هر چقد که Bitrate شما بالاتر باشه، کیفیت ویدئویی که میبیند بالاتره.حالا بیایید ببینیم چجوری محاسبه میشه.حجم کل ویدئورو تقسیم بر ثانیه میکنیم و Bitrate حساب میشه.فرض کنید یه ویدئو یک ساعته داریم با حجم 298,598,400,000 بایت حالا برای اینکه Bitrate رو حساب کنیم از این فرمول استفاده میکنیم:Bitrate = 298,598,400,000 / (60*60) = 81,000 KBps = 0.61 Gbpsمفهوم پنجم: Containerعکس شماره 7حتما شنیدید که میگن فرمت یه فایل mp4 هستش یا webm یا...در واقع این ها Container هستن که هر Container میتونه یک یا چنتا Stream ویدئو یا Audio داشته باشه که با Codec های مختلفی encode شده باشن.حالا میتونیم یه Container داشته باشیم فقط Audio باشه یا فقط Video یا یه Video باشه با چنتا Audio مختلف.عکس شماره 8مفهوم ششم: Adaptive Bitrate Streamingعکس شماره 9در واقع میخواییم بالاترین کیفیت ممکن یه ویدئو رو به یوزر بدیم. برای این کار ویدئو رو با اندازه و کیفیت های مختلف میسازیم و با توجه به اندازه صفحه نمایش، ویدئو رو بهش نمایش میدیم. البته این همه ماجرا نیست و برای اینکه یوزر Loading نبینه و Buffer ویدئو متوقف نشه ویدئو مناسب با Bandwidth یوزر رو بهش نمایش میدیم.مفهوم هفتم: Transcoding vs Transmuxingعکس شماره 10فرض کنید یه Video رو بگیریم و فقط Codec ویدئو رو عوض کنیم بدون اینکه به چیز دیگه ای دست بزنیم به این مفهوم میگن Transcoding. به خاطر encode و decode کردن Sourse ویدئویی CPU بالایی از سرور مصرف میکنه. (عکس شماره 11)ممکنه توی این حالت FPS یا Bitrate یا Resolotion ویدئو هم تغییر بدیم.عکس شماره 11حالا فرض کنید که ما به هیچ کدوم از مشخصات ویدئو دست نزنیم و فقط بیاییم Container ویدئو رو تغییر بدیم به این حالت میگن Transmuxing. (عکس شماره 12)عکس شماره 12ممکنه برای یه ویدئو هم Transcoding انجام بشه و هم Transmuxing یا یکی از این موارد.مفهوم هشتم: RTMP چیست؟عکس شماره 13مخفف شده Real-Time Messaging Protocol هستش و برای جریان زنده صوت و تصویر استفاده میشه.در واقع برای دریافت کردن Stream از Streamer استفاده میشه.نکته دیگه ای که باید درباره RTMP بدونیم اینه که RTMP یه چرخه کامل از ویدئو هستش که استریمر میتونه ویدئو رو بفرسته و بیننده ببینه ولی نکته ای که وجود داره اینه که RTMP قابل نمایش تو Flash Player ها هستن که اکثر Browser ها جلوی Flash Player رو میگیرن. برای همین این ویدئو ها که از طریق پروتکل RTMP ارسال میشن به یه فرمت دیگه ویدئویی تبدیل میشن مثل HLS یا Dash یا هر چیز دیگه ای که جلوتر البته HLS رو توضیح میدم.بریم سر اصل مطلبحالا ما به صورت کلی با مفاهیم اولیه آشنا شدیم.استریمر با پروتکل RTMP یه ویدئو رو برای سرور میفرسته که به نمایش در بیاد و داخل سرور Transcoding و Transmuxing انجام میشه و برای تبدیل ویدئو به فرمت قابل پخش توسط پلیر. تو این بین Bitrate و FPS و Resulotion ها برای ویدئو هم ساخته میشه و تحت عنوان یه فایل به اسم HLS به پلیر برای نمایش استریم داده میشه.حالا آخرین چیزی که باید دربارش یه کم بیشتر بدونیم اینه که HLS چجوری ساخته میشه و چجوری از روش ویدئو به نمایش در میاد.عکس شماره 14به عکس شماره 14 توجه کنید. HLS از یه فایل که به اصطلاح Master Manifest میگن تشکیل میشه و پسوندش هم m3u8 هستش. این Master Manifest درواقع Manifest کیفیت های مختلف ویدئو رو در اختیار داره. هر کدوم از این کیفیت یا Level یا Profile ها دارای یه سری لینکن که مارو میرسونن به Chunk های ویدئویی. پسوند این فایل ها ts هستش.حالا Chunk چیه و چه کاربردی داره؟ در واقع یه ویدئو به قسمت های کوچک تر تبدیل میشه که به هر کدومشون ما میگین Chunk. حالا این Chunk ها و اینکه طول و زمانشون چقد باشه، قابل Set کردن هستش و میتونه تو هر جایی متفاوت باشه.وقتی شما دارین یه ویدئو رو مشاهده میکنید بر اساس Bitrate و Resulotion ئی که دارین یه کیفیت برای شما به نمایش در میاد. به هر دلیلی اگر Bitrate شما افت کنه، Chunk ویدئویی تغییر میکنه و به Resolotion بالاتر یا پایینتر هدایت میشین.البته میشه شما بگین که فقط این ویدئو رو میخوام با یه کیفیت خاص ببینم. در اون صورت ممکنه کیفیت ویدئویی که انتخاب کردین کم باشه یا اینکه Loading زیاد ببینین.عکس شماره 15حالا بیایین ساختار کلی این حرفایی که زدیم رو تو یه عکس ببینیم.عکس شماره 16یه نکته کوچیک تو عکس وجود داره اونم اینه که Storage DVR چیه؟در واقع مخفف شده Digital Video Recorder هستش. برای اینکه استریمی که داره پخش میشه رو ضبط کنی و بعدا به صورت VOD یا Video On Demand یا ویدئو از قبل ضبط شده نمایش بدی.این ساختار کلیه یه استریم هستش و قطعا کامل نیست و نکته های فراوانی داره.امیدوارم از این مقاله لذت برده باشین...یه تشکر ویژه از استاد محمد صمیمی عزیز که من ازشون این مطالب رو یاد گرفتم.همچنین محمد حسین عابدین پور عزیز بابت ویدئو مفیدشون.منابع:https://blog.ghm.me/fa/live_streaming/105/setup-media-server-rtmp-hls-with-nginx-windows/https://kavimo.com/blog/104/adaptive-bitrate-vs-multi-bitrate-streaminghttps://www.arvancloud.com/help/fa/article/360011465059-Adaptive-bitrate-streaming-%E2%80%8E%E2%80%8F-%DA%86%DB%8C%D8%B3%D8%AA%D8%9Fhttps://falnic.com/blog/what-is-bit-rate.htmlhttps://itbaz.net/7256/what-is-bit-rate/https://www.youtube.com/watch?v=TRQdkvs6wlMhttps://bytegate.io/%DA%A9%D8%AF%DA%A9-codec-%DA%86%DB%8C%D8%B3%D8%AA%D8%9F-%D9%88-%D9%81%D8%B1%D9%82-%DA%A9%D8%AF%DA%A9-%D8%A8%D8%A7-%D9%81%D8%B1%D9%85%D8%AA/