Blink چیست؟

یکی از قدرت های ویژه وب، ترکیب پذیری آن است. صفحات وب شامل انواع منابع مختلف، به طور بالقوه از چندین منبع هستند.

Blink به عنوان موتور رندر برای مرورگرهای مبتنی بر Chromium ، از جمله Chrome، Android WebView، Microsoft Edge، Opera و Brave عمل می‌کند.

موتور رندر جزء یک مرورگر وب است که کدهای HTML، CSS و جاوا اسکریپت را - همراه با تصاویر و سایر منابع - به صفحات وب تبدیل می کند که می توانید مشاهده کنید و با آنها تعامل داشته باشید.

Blink فرآیند رندر را با جمع آوری تمام منابع لازم مانند HTML، CSS، جاوا اسکریپت، ویدئوها و تصاویر آغاز می کند. برای بازیابی این منابع، Blink تعاملات با پشته شبکه را در Chromium و سیستم عامل زیرین مدیریت می کند.

به محض بارگیری CSS و HTML، Blink می‌تواند آن کد را به شکل متن به نمایشی تبدیل کند که می‌تواند با آن کار کند - که تجزیه نامیده می‌شود. جاوا اسکریپت نیز باید تجزیه و سپس اجرا شود.

پس از انجام تمام کارها، Blink می‌تواند کار طرح‌بندی و نمایش صفحات وب را که می‌توانید مشاهده کنید و با آنها تعامل داشته باشید، آغاز کند. این رندر است.

نمودار زیر مراحل در خط لوله اجرای وظایف، شامل اجزا، فرآیندها و منابع درگیر در هر یک را نشان می دهد. پلک زدن کارهای زیادی برای انجام دادن دارد!

چشمک زدن خط لوله رندر، با فلش هایی که پیشرفت در مراحل را نشان می دهد.
خط لوله رندر Blink دارای بارگذار منبع، APIهای اسکریپت و تجزیه HTML/CSS است. این کار در چندین مرحله به سمت کشیدن پیکسل ها روی صفحه پیش می رود.

رندر گرافیک

Blink از موتور گرافیکی منبع باز Skia برای تعامل با سخت افزار گرافیکی رایانه یا دستگاه تلفن همراه استفاده می کند.

Skia API های رایجی را ارائه می دهد که در انواع پلتفرم های سخت افزاری و نرم افزاری کار می کنند. این به عنوان موتور گرافیکی برای Google Chrome و بسیاری از محصولات دیگر عمل می کند.

Skia به جای تلاش برای پشتیبانی از سیستم عامل ها و دستگاه های مختلف، همزمان با تغییرات پلت فرم، از کتابخانه های گرافیکی از جمله OpenGL ، Vulkan و DirectX استفاده می کند. کتابخانه ای که Skia استفاده می کند بستگی به پلتفرمی دارد که روی آن اجرا می شود، مانند Android در تلفن همراه یا Windows در دسکتاپ.

جاوا اسکریپت را تجزیه و اجرا کنید

برای تجزیه و اجرای کدهای جاوا اسکریپت و WebAssembly، Blink از V8 ، یک موتور منبع باز توسعه یافته توسط پروژه های Chromium استفاده می کند.

V8 این امکان را برای یک توسعه دهنده فراهم می کند تا از کد جاوا اسکریپت یا WebAssembly برای دسترسی به قابلیت های مرورگر اصلی استفاده کند. به عنوان مثال: برای دستکاری Document Object Model ، که نمایش داخلی سندی است که Blink از کد HTML می‌سازد.

V8 جاوا اسکریپت را مطابق با استاندارد جاوا اسکریپت، معروف به ECMAScript پردازش می کند.

ارائه به استانداردها

V8 جاوا اسکریپت را مطابق با استاندارد جاوا اسکریپت، معروف به ECMAScript پردازش می کند. موتورهای رندر مانند Blink برای پیاده سازی متقابل استانداردهای وب طراحی شده اند. استانداردهای وب به توسعه دهندگان و کاربران نهایی این امکان را می دهد که بدون توجه به مرورگری که استفاده می کنند، مطمئن باشند که صفحات وب به خوبی کار می کنند.

Blink از مشخصات مرورگر و ویژگی های زبان تعریف شده در استانداردهای وب از جمله HTML ، CSS و DOM پیروی می کند.

HTML و DOM

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

مشخصات رابط در WebIDL نوشته شده است: Web Interface Definition Language. WebIDL زیر بخشی از تعریف استاندارد HTML از HTMLImageElement است.

[Exposed=Window,
 LegacyFactoryFunction=Image(optional unsigned long width, optional unsigned
long height)]
interface HTMLImageElement : HTMLElement {
 [HTMLConstructor] constructor();

 [CEReactions] attribute DOMString alt;
 [CEReactions] attribute USVString src;
 [CEReactions] attribute USVString srcset;
 [CEReactions] attribute DOMString sizes;
 [CEReactions] attribute DOMString? crossOrigin;
 [CEReactions] attribute DOMString useMap;
 [CEReactions] attribute boolean isMap;
 [CEReactions] attribute unsigned long width;
 [CEReactions] attribute unsigned long height;
 readonly attribute unsigned long naturalWidth;
 readonly attribute unsigned long naturalHeight;
 readonly attribute boolean complete;
 readonly attribute USVString currentSrc;
 [CEReactions] attribute DOMString referrerPolicy;
 [CEReactions] attribute DOMString decoding;
 [CEReactions] attribute DOMString loading;
 [CEReactions] attribute DOMString fetchPriority;

 Promise<undefined> decode();

 // also has obsolete members
};

WebIDL یک روش استاندارد برای توصیف رابط های کاربردی است، مانند آنهایی که اکثر استانداردهای وب را تشکیل می دهند.

برای پیاده سازی یک ویژگی، مهندسان کد WebIDL را در یک فایل قرار می دهند و این کد به طور خودکار توسط Blink تغییر شکل می دهد تا یک رابط برای توسعه دهندگان برای آن ویژگی فراهم کند. هنگامی که رابط با WebIDL تعریف شد، مهندسان می توانند پیاده سازی هایی را بسازند که به تماس های رابط پاسخ می دهند.

html_image_element.idl در منبع Chromium.

کتابخانه های شخص ثالث

Blink از چندین کتابخانه شخص ثالث استفاده می کند. به عنوان مثال، WebGL برای ارائه گرافیک های تعاملی دو بعدی و سه بعدی استفاده می شود.

کتابخانه های شخص ثالث در منبع Chromium—از جمله WebGL مورد استفاده Blink.

کتابخانه هایی مانند WebGL بسیار بهینه شده و با دقت تست شده اند. آنها بدون نیاز به اختراع مجدد چرخ، به Blink دسترسی به ویژگی ها و عملکردهای مهم می دهند. WebGL IDL تعریف شده است و مهندسان Blink آن رابط وب را با کدها و کتابخانه های موجود در backend که برای رندر کردن بسیاری از عناصر مختلف استفاده می شوند، متصل می کنند.

اگر می‌خواهید WebGL را در عمل ببینید، برنامه رندر فراکتال Fractious را بررسی کنید که از WebGL استفاده می‌کند.

Fractious : یک نمایشگر مبتنی بر WebGL برای مجموعه Mandelbrot.

رندر کراس پلتفرم

شاید بپرسید، آیا Chrome در همه جا، در همه سیستم عامل ها و دستگاه ها از Blink استفاده می کند؟

در iOS و iPadOS، Chrome از WebKit به عنوان موتور رندر خود استفاده می‌کند. WebKit در واقع فورک پروژه دیگری به نام KDE بود که به سال 1998 باز می گردد. در واقع، Safari و Chromium هر دو در ابتدا بر پایه WebKit بودند. امروزه، سافاری و همه مرورگرهای موجود در اکوسیستم اپل، طبق الزامات فروشگاه App اپل، از WebKit استفاده می‌کنند.

با گذشت زمان، پروژه‌های Chromium یک معماری نرم‌افزار چند فرآیندی متفاوت ایجاد کردند، زیرا حفظ دو معماری مجزا در یک پایگاه کد مشکل‌ساز می‌شد.

علاوه بر این، Chromium می خواست از ویژگی هایی استفاده کند که در WebKit ساخته نشده بودند. بنابراین، با شروع از نسخه 28، مهندسان Chromium تصمیم گرفتند کار بر روی موتور رندر خود را آغاز کنند. آنها کد خود را از WebKit جدا کردند و آن را Blink نامیدند. شایعات حاکی از آن است که Blink از روی برچسب محبوب <blink> (نه چندان) نامگذاری شده است که در مرورگر Netscape Navigator برای روشن و خاموش کردن متن موجود بود.

به طور خلاصه: Chrome، Microsoft Edge، Opera، Vivaldi، Arc، Brave و سایر مرورگرها و چارچوب‌های مبتنی بر Chromium از Blink استفاده می‌کنند. سافاری و برخی مرورگرهای دیگر از WebKit به همراه همه مرورگرهای iOS و iPadOS از جمله کروم استفاده می‌کنند. فایرفاکس از یک موتور رندر به نام Gecko استفاده می کند.

مراحل بعدی

بررسی کنید اهداف چشمک زدن چیست؟ .

،

یکی از قدرت های ویژه وب، ترکیب پذیری آن است. صفحات وب شامل انواع منابع مختلف، به طور بالقوه از چندین منبع هستند.

Blink به عنوان موتور رندر برای مرورگرهای مبتنی بر Chromium ، از جمله Chrome، Android WebView، Microsoft Edge، Opera و Brave عمل می‌کند.

موتور رندر جزء یک مرورگر وب است که کدهای HTML، CSS و جاوا اسکریپت را - همراه با تصاویر و سایر منابع - به صفحات وب تبدیل می کند که می توانید مشاهده کنید و با آنها تعامل داشته باشید.

Blink فرآیند رندر را با جمع آوری تمام منابع لازم مانند HTML، CSS، جاوا اسکریپت، ویدئوها و تصاویر آغاز می کند. برای بازیابی این منابع، Blink تعاملات با پشته شبکه را در Chromium و سیستم عامل زیرین مدیریت می کند.

به محض بارگیری CSS و HTML، Blink می‌تواند آن کد را به شکل متن به نمایشی تبدیل کند که می‌تواند با آن کار کند - که تجزیه نامیده می‌شود. جاوا اسکریپت نیز باید تجزیه و سپس اجرا شود.

پس از انجام تمام کارها، Blink می‌تواند کار طرح‌بندی و نمایش صفحات وب را که می‌توانید مشاهده کنید و با آنها تعامل داشته باشید، آغاز کند. این رندر است.

نمودار زیر مراحل در خط لوله اجرای وظایف، شامل اجزا، فرآیندها و منابع درگیر در هر یک را نشان می دهد. پلک زدن کارهای زیادی برای انجام دادن دارد!

چشمک زدن خط لوله رندر، با فلش هایی که پیشرفت در مراحل را نشان می دهد.
خط لوله رندر Blink دارای بارگذار منبع، APIهای اسکریپت و تجزیه HTML/CSS است. این کار در چندین مرحله به سمت کشیدن پیکسل ها روی صفحه پیش می رود.

رندر گرافیک

Blink از موتور گرافیکی منبع باز Skia برای تعامل با سخت افزار گرافیکی رایانه یا دستگاه تلفن همراه استفاده می کند.

Skia API های رایجی را ارائه می دهد که در انواع پلتفرم های سخت افزاری و نرم افزاری کار می کنند. این به عنوان موتور گرافیکی برای Google Chrome و بسیاری از محصولات دیگر عمل می کند.

Skia به جای تلاش برای پشتیبانی از سیستم عامل ها و دستگاه های مختلف، همزمان با تغییرات پلت فرم، از کتابخانه های گرافیکی از جمله OpenGL ، Vulkan و DirectX استفاده می کند. کتابخانه ای که Skia استفاده می کند بستگی به پلتفرمی دارد که روی آن اجرا می شود، مانند Android در تلفن همراه یا Windows در دسکتاپ.

جاوا اسکریپت را تجزیه و اجرا کنید

برای تجزیه و اجرای کدهای جاوا اسکریپت و WebAssembly، Blink از V8 ، یک موتور منبع باز توسعه یافته توسط پروژه های Chromium استفاده می کند.

V8 این امکان را برای یک توسعه دهنده فراهم می کند تا از کد جاوا اسکریپت یا WebAssembly برای دسترسی به قابلیت های مرورگر اصلی استفاده کند. به عنوان مثال: برای دستکاری Document Object Model ، که نمایش داخلی سندی است که Blink از کد HTML می‌سازد.

V8 جاوا اسکریپت را مطابق با استاندارد جاوا اسکریپت، معروف به ECMAScript پردازش می کند.

ارائه به استانداردها

V8 جاوا اسکریپت را مطابق با استاندارد جاوا اسکریپت، معروف به ECMAScript پردازش می کند. موتورهای رندر مانند Blink برای پیاده سازی متقابل استانداردهای وب طراحی شده اند. استانداردهای وب به توسعه دهندگان و کاربران نهایی این امکان را می دهد که بدون توجه به مرورگری که استفاده می کنند، مطمئن باشند که صفحات وب به خوبی کار می کنند.

Blink از مشخصات مرورگر و ویژگی های زبان تعریف شده در استانداردهای وب از جمله HTML ، CSS و DOM پیروی می کند.

HTML و DOM

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

مشخصات رابط در WebIDL نوشته شده است: Web Interface Definition Language. WebIDL زیر بخشی از تعریف استاندارد HTML از HTMLImageElement است.

[Exposed=Window,
 LegacyFactoryFunction=Image(optional unsigned long width, optional unsigned
long height)]
interface HTMLImageElement : HTMLElement {
 [HTMLConstructor] constructor();

 [CEReactions] attribute DOMString alt;
 [CEReactions] attribute USVString src;
 [CEReactions] attribute USVString srcset;
 [CEReactions] attribute DOMString sizes;
 [CEReactions] attribute DOMString? crossOrigin;
 [CEReactions] attribute DOMString useMap;
 [CEReactions] attribute boolean isMap;
 [CEReactions] attribute unsigned long width;
 [CEReactions] attribute unsigned long height;
 readonly attribute unsigned long naturalWidth;
 readonly attribute unsigned long naturalHeight;
 readonly attribute boolean complete;
 readonly attribute USVString currentSrc;
 [CEReactions] attribute DOMString referrerPolicy;
 [CEReactions] attribute DOMString decoding;
 [CEReactions] attribute DOMString loading;
 [CEReactions] attribute DOMString fetchPriority;

 Promise<undefined> decode();

 // also has obsolete members
};

WebIDL یک روش استاندارد برای توصیف رابط های کاربردی است، مانند آنهایی که اکثر استانداردهای وب را تشکیل می دهند.

برای پیاده سازی یک ویژگی، مهندسان کد WebIDL را در یک فایل قرار می دهند و این کد به طور خودکار توسط Blink تغییر شکل می دهد تا یک رابط برای توسعه دهندگان برای آن ویژگی فراهم کند. هنگامی که رابط با WebIDL تعریف شد، مهندسان می توانند پیاده سازی هایی را بسازند که به تماس های رابط پاسخ می دهند.

html_image_element.idl در منبع Chromium.

کتابخانه های شخص ثالث

Blink از چندین کتابخانه شخص ثالث استفاده می کند. به عنوان مثال، WebGL برای ارائه گرافیک های تعاملی دو بعدی و سه بعدی استفاده می شود.

کتابخانه های شخص ثالث در منبع Chromium—از جمله WebGL مورد استفاده Blink.

کتابخانه هایی مانند WebGL بسیار بهینه شده و با دقت تست شده اند. آنها بدون نیاز به اختراع مجدد چرخ، به Blink دسترسی به ویژگی ها و عملکردهای مهم می دهند. WebGL IDL تعریف شده است و مهندسان Blink آن رابط وب را با کدها و کتابخانه های موجود در backend که برای رندر کردن بسیاری از عناصر مختلف استفاده می شوند، متصل می کنند.

اگر می‌خواهید WebGL را در عمل ببینید، برنامه رندر فراکتال Fractious را بررسی کنید که از WebGL استفاده می‌کند.

Fractious : یک نمایشگر مبتنی بر WebGL برای مجموعه Mandelbrot.

رندر کراس پلتفرم

شاید بپرسید، آیا Chrome در همه جا، در همه سیستم عامل ها و دستگاه ها از Blink استفاده می کند؟

در iOS و iPadOS، Chrome از WebKit به عنوان موتور رندر خود استفاده می‌کند. WebKit در واقع فورک پروژه دیگری به نام KDE بود که به سال 1998 باز می گردد. در واقع، Safari و Chromium هر دو در ابتدا بر پایه WebKit بودند. امروزه، سافاری و همه مرورگرهای موجود در اکوسیستم اپل، طبق الزامات فروشگاه App اپل، از WebKit استفاده می‌کنند.

با گذشت زمان، پروژه‌های Chromium یک معماری نرم‌افزار چند فرآیندی متفاوت ایجاد کردند، زیرا حفظ دو معماری مجزا در یک پایگاه کد مشکل‌ساز می‌شد.

علاوه بر این، Chromium می خواست از ویژگی هایی استفاده کند که در WebKit ساخته نشده بودند. بنابراین، با شروع از نسخه 28، مهندسان Chromium تصمیم گرفتند کار بر روی موتور رندر خود را آغاز کنند. آنها کد خود را از WebKit جدا کردند و آن را Blink نامیدند. شایعات حاکی از آن است که Blink از روی برچسب محبوب <blink> (نه چندان) نامگذاری شده است که در مرورگر Netscape Navigator برای روشن و خاموش کردن متن موجود بود.

به طور خلاصه: Chrome، Microsoft Edge، Opera، Vivaldi، Arc، Brave و سایر مرورگرها و چارچوب‌های مبتنی بر Chromium از Blink استفاده می‌کنند. سافاری و برخی مرورگرهای دیگر از WebKit به همراه همه مرورگرهای iOS و iPadOS از جمله کروم استفاده می‌کنند. فایرفاکس از یک موتور رندر به نام Gecko استفاده می کند.

مراحل بعدی

بررسی کنید اهداف چشمک زدن چیست؟ .