Blink คืออะไร

Sam Dutton

ความสามารถพิเศษอย่างหนึ่งของเว็บคือความสามารถในการประกอบ หน้าเว็บมี ทรัพยากรที่แตกต่างกันหลากหลาย ซึ่งอาจมาจากหลายต้นทาง

Blink เป็นเครื่องมือแสดงผลสำหรับเบราว์เซอร์ที่ใช้ Chromium ซึ่งรวมถึง Chrome, Android WebView, Microsoft Edge, Opera และ Brave

เครื่องมือแสดงผลคือคอมโพเนนต์ของเว็บเบราว์เซอร์ที่แปลงโค้ด HTML, CSS และ JavaScript รวมถึงรูปภาพและทรัพยากรอื่นๆ ให้เป็นหน้าเว็บที่คุณดูและโต้ตอบได้

Blink แสดงหน้าเว็บอย่างไร

Blink เริ่มกระบวนการแสดงผลด้วยการรวบรวมทรัพยากรที่จำเป็นทั้งหมด เช่น HTML, CSS, JavaScript, วิดีโอ และรูปภาพ Blink จัดการการโต้ตอบกับสแต็กเครือข่ายใน Chromium และระบบปฏิบัติการ พื้นฐานเพื่อดึงข้อมูลทรัพยากรเหล่านี้

ทันทีที่โหลด CSS และ HTML แล้ว Blink จะแปลงโค้ดนั้นในรูปแบบข้อความเป็นตัวแทนที่สามารถทำงานด้วยได้ ซึ่งเรียกว่าการแยกวิเคราะห์ นอกจากนี้ ยังต้องแยกวิเคราะห์และเรียกใช้ JavaScript ด้วย

เมื่อดำเนินการทั้งหมดเสร็จแล้ว Blink จะเริ่มแสดงผล การแสดงผลคือการทำงานของ การจัดวางและแสดงหน้าเว็บที่คุณดูและโต้ตอบด้วย

แผนภาพต่อไปนี้แสดงขั้นตอนในไปป์ไลน์ของงานการแสดงผล รวมถึงคอมโพเนนต์ กระบวนการ และทรัพยากรที่เกี่ยวข้องในแต่ละขั้นตอน Blink มี งานที่ต้องทำอีกมาก

แสดงผลกราฟิก

Blink ใช้เครื่องมือแสดงกราฟิก Skia แบบโอเพนซอร์สเพื่อ โต้ตอบกับฮาร์ดแวร์กราฟิกพื้นฐานของคอมพิวเตอร์หรืออุปกรณ์เคลื่อนที่

Skia มี API ทั่วไปที่ทํางานในแพลตฟอร์มฮาร์ดแวร์และซอฟต์แวร์ ที่หลากหลาย โดยเป็นเครื่องมือด้านกราฟิกสำหรับ Google Chrome และผลิตภัณฑ์อื่นๆ อีกมากมาย

Skia ใช้ไลบรารีกราฟิกต่างๆ เช่น OpenGL, Vulkan และ DirectX แทนที่จะพยายามรองรับระบบปฏิบัติการและอุปกรณ์ต่างๆ พร้อมทั้ง ติดตามการเปลี่ยนแปลงของแพลตฟอร์ม ไลบรารีที่ Skia ใช้จะขึ้นอยู่กับแพลตฟอร์มที่ทำงานอยู่ เช่น Android บน อุปกรณ์เคลื่อนที่หรือ Windows บนเดสก์ท็อป

แยกวิเคราะห์และเรียกใช้ JavaScript

Blink ใช้ V8 ซึ่งเป็นเครื่องมือโอเพนซอร์สที่พัฒนาโดยโปรเจ็กต์ Chromium เพื่อแยกวิเคราะห์และเรียกใช้โค้ด JavaScript และ WebAssembly

V8 ช่วยให้นักพัฒนาซอฟต์แวร์ใช้โค้ด JavaScript หรือ WebAssembly เพื่อ เข้าถึงความสามารถของเบราว์เซอร์พื้นฐานได้ เช่น เพื่อจัดการ แบบจำลองออบเจ็กต์เอกสาร ซึ่งเป็นการแสดงเอกสารภายในที่ Blink สร้างจากโค้ด HTML

V8 ประมวลผล JavaScript ตามมาตรฐาน JavaScript ที่เรียกว่า ECMAScript

แสดงผลตามมาตรฐาน

V8 ประมวลผล JavaScript ตามมาตรฐาน JavaScript ซึ่งรู้จักกันในชื่อ ECMAScript เครื่องมือการแสดงผล เช่น Blink ได้รับการออกแบบมาให้ใช้มาตรฐานเว็บร่วมกันได้ มาตรฐานเว็บช่วยให้นักพัฒนาซอฟต์แวร์และผู้ใช้ปลายทางมั่นใจได้ว่า หน้าเว็บจะทำงานได้ดี ไม่ว่าจะใช้เบราว์เซอร์ใดก็ตาม

Blink ทำตามข้อกำหนดสำหรับฟีเจอร์ของเบราว์เซอร์และภาษาที่กำหนดไว้ในมาตรฐานเว็บ ซึ่งรวมถึง HTML, CSS และ DOM

HTML และ DOM

มาตรฐาน HTML กำหนดวิธีที่วิศวกรเบราว์เซอร์ ควรใช้องค์ประกอบ HTML ข้อกำหนดสำหรับองค์ประกอบ HTML แต่ละรายการมีส่วนที่กำหนดอินเทอร์เฟซ DOM สำหรับองค์ประกอบนั้น ซึ่งจะอธิบายวิธีที่เบราว์เซอร์ควรใช้ JavaScript เพื่ออนุญาตให้มีการโต้ตอบกับองค์ประกอบในลักษณะที่เป็นมาตรฐานในอุปกรณ์และแพลตฟอร์มต่างๆ

ข้อกำหนดอินเทอร์เฟซเขียนด้วย WebIDL ซึ่งเป็นภาษาที่ใช้สื่อสารข้อมูลระหว่างคอมโพเนนต์ของเว็บ WebIDL ต่อไปนี้เป็นส่วนหนึ่งของคำจำกัดความของ HTMLImageElement ในมาตรฐาน HTML

[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 แล้ว วิศวกรจะสร้างการติดตั้งใช้งานที่ตอบสนองต่อการเรียกอินเทอร์เฟซได้

ไลบรารีของบุคคลที่สาม

Blink ใช้ไลบรารีของบุคคลที่สามหลายรายการ ตัวอย่างเช่น WebGL ใช้ในการแสดงผล กราฟิก 2 มิติและ 3 มิติแบบอินเทอร์แอกทีฟ

ไลบรารี เช่น WebGL ได้รับการเพิ่มประสิทธิภาพอย่างมากและผ่านการทดสอบอย่างละเอียด ซึ่งช่วยให้ Blink เข้าถึงฟีเจอร์และฟังก์ชันการทำงานที่สำคัญได้โดยไม่ต้อง สร้างใหม่ มีการกำหนด IDL ของ WebGL และวิศวกรของ Blink จะเชื่อมต่ออินเทอร์เฟซเว็บดังกล่าวกับโค้ดและไลบรารีในแบ็กเอนด์ที่ใช้ในการแสดงผลองค์ประกอบต่างๆ มากมาย

หากต้องการดู WebGL ในการทำงาน ให้ดูแอปการแสดงผลเศษส่วน Fractious ซึ่งใช้ WebGL

การแสดงผลข้ามแพลตฟอร์ม

คุณอาจสงสัยว่า Chrome ใช้ Blink ทุกที่ในระบบปฏิบัติการและอุปกรณ์ทั้งหมดไหม

ใน iOS และ iPadOS นั้น Chrome ใช้ WebKit เป็นเครื่องมือแสดงผล จริงๆ แล้ว WebKit เป็นโปรเจ็กต์ที่แยกออกมาจากอีกโปรเจ็กต์หนึ่ง KDE ซึ่งมีมาตั้งแต่ปี 1998 ที่จริงแล้ว Safari และ Chromium ต่างก็มีพื้นฐานมาจาก WebKit ในตอนแรก ปัจจุบัน Safari และเบราว์เซอร์ทั้งหมดในระบบนิเวศของ Apple ใช้ WebKit ตามข้อกำหนดของ App Store ของ Apple

เมื่อเวลาผ่านไป โปรเจ็กต์ Chromium ได้พัฒนาสถาปัตยกรรมซอฟต์แวร์แบบหลายกระบวนการที่แตกต่างออกไป เนื่องจาก การรักษาสถาปัตยกรรมที่แยกกัน 2 แบบในฐานของโค้ดเดียวเริ่มเป็นปัญหา

นอกจากนี้ Chromium ยังต้องการใช้ฟีเจอร์ที่ไม่ได้สร้างไว้ใน WebKit ดังนั้น ตั้งแต่เวอร์ชัน 28 เป็นต้นมา วิศวกรของ Chromium จึงตัดสินใจเริ่มพัฒนา เครื่องมือการแสดงผลของตนเอง โดยได้แยกโค้ดจาก WebKit และตั้งชื่อว่า Blink มีข่าวลือว่า Blink ตั้งชื่อตามแท็ก <blink> (ไม่ค่อยเป็นที่รัก) ที่มีอยู่ในเบราว์เซอร์ Netscape Navigator เพื่อให้ข้อความ กะพริบเปิดและปิด

สรุปได้ว่า Chrome, Microsoft Edge, Opera, Vivaldi, Arc, Brave และเบราว์เซอร์และเฟรมเวิร์กอื่นๆ ที่อิงตาม Chromium ใช้ Blink Safari และเบราว์เซอร์อื่นๆ บางเบราว์เซอร์ ใช้ WebKit รวมถึงเบราว์เซอร์ทั้งหมดใน iOS และ iPadOS ซึ่งรวมถึง Chrome ด้วย Firefox ใช้เครื่องมือแสดงผลที่ชื่อ Gecko