داخل مرورگر چه خبره! - rendering pipeline و DOM

تو این ویدیو ما درباره اینکه مرورگر چه طوری HTML, CSS رو تبدیل میکنه به تصویری که ما روی مرورگر میبینیم و میتونیم با اون interact کنیم صحبت میکنیم.

مروگر یک فرایند داره به نام rendering pipeline که از ۵ قسمت تشکیل شده.
Javascript Style Layout Paint Composite

هرکدوم از این‌ها یک عملیات خاص رو انجام میدن، و اگر ما بدونیم مرورگر چه طوری این کارو انجام میده میتونیم بهش کمک کنیم که سریعتر و بهتر رندر صفحه رو انجام بده و درنتیجه اپ هایی که پرفورمنس بهتری دارن برای کاربرامون بسازیم


اگر سوالی داشتید همینجا تو قسمت comment ها میتونید بپرسید یا داخل تلگرام به ادرس @nima_arf بهم پیام بدید.

وب سایت: https://react.ir
کانال تلگرام: https://t.me/react_ir

Some of the assets used in this video got copied from web.dev and chrome for developers website, the assets in the blog posts are released under Creative Commons Attribution 4.0 License

link to the original blog posts:

https://web.dev/articles/rendering-pe...
https://web.dev/articles/optimize-cls
https://developer.chrome.com/blog/ins...


0:00 Intro
0:55 Rendering Pipeline
DOM 1:36
Style 2:08
Layout 5:07
Paint 7:33
Composite 15:38
Javascript 18:40
Future Project 19:35
Outro 20:31