Chrome Dev Summit - สรุปข้อมูลเกี่ยวกับแพลตฟอร์มเว็บแบบเปิด

โดย Greg Simon และ Eric Seidel

Blink เป็นเครื่องมือแสดงผลโอเพนซอร์สของ Chrome ทีม Blink กำลังพัฒนาเว็บและแก้ไขปัญหาที่นักพัฒนาซอฟต์แวร์พบ

เราได้ปรับปรุงการทำงานเบื้องหลังหลายอย่างตั้งแต่การเปิดตัวในเดือนเมษายน

สิ่งแรกที่เราทำคือลบแหล่งข้อมูลของเราครึ่งหนึ่ง ซึ่งเราไม่จำเป็น ยังไม่จบเพียงเท่านี้ และเราไม่ได้ทำตาบอดนี้ การนำโค้ดออกจะอิงตามสถิติรวมที่มีการรายงานแบบไม่ระบุตัวตนจากผู้ใช้ Chrome ที่เลือกรับการรายงาน

เราเผยแพร่ API สำหรับนักพัฒนาซอฟต์แวร์ใหม่ทุก 6 สัปดาห์ ในลักษณะเดียวกับกำหนดการจัดส่งของ Chrome

การเปลี่ยนแปลงสำคัญอย่างหนึ่งที่เราทำเมื่อแยกออกจาก Blink คือการเพิ่มระบบ Intent โดยทุกครั้งก่อนที่เราจะเปลี่ยนแพลตฟอร์มเว็บ เราจะส่งประกาศสาธารณะไปยัง Blink dev เพื่อประกาศความตั้งใจที่จะเพิ่มหรือนำฟีเจอร์ออก จากนั้นก็เริ่มเขียนโค้ด และในวันถัดไปหลังจากเช็คอิน คุณลักษณะก็มีการจัดส่งในเวอร์ชัน Canary แล้ว ฟีเจอร์นี้จะปิดอยู่โดยค่าเริ่มต้น แต่คุณสามารถเปิดได้โดยใช้ about:flags

จากนั้นจึงประกาศความตั้งใจที่จะจัดส่งในรายชื่ออีเมลสาธารณะ

ที่ chromestatus.com คุณจะเห็นฟีเจอร์ที่เราพัฒนาแล้ว ฟีเจอร์ที่เราจัดส่ง และฟีเจอร์ที่เราวางแผนจะเลิกใช้งาน นอกจากนี้ คุณยังสามารถดูบล็อก Chromium Releases ซึ่งมีลิงก์ไปยังข้อบกพร่องและแดชบอร์ดเครื่องมือติดตามของเรา

การเปลี่ยนแปลงที่ยิ่งใหญ่อีกอย่างหนึ่งคือเราจะนำคำนำหน้า WebKit ออก เจตนาไม่ได้ใช้คำนำหน้า Blink แต่ใช้แฟล็กรันไทม์ (ไม่ใช่แค่แฟล็กเวลาคอมไพล์)

Android WebView เป็นความท้าทายที่ยิ่งใหญ่ แต่ HTML5Test แสดงให้เห็นว่าสิ่งต่างๆ กำลังดีขึ้นเรื่อยๆ เราใกล้เคียงกับเดสก์ท็อปมากในแง่ของการมี API ของแพลตฟอร์มเว็บเพียงชุดเดียวในทุกที่ (Web Audio เป็นตัวอย่างที่ดีในเรื่องนี้)

แต่เครื่องผลิตไส้กรอกทำงานอย่างไร ทุกการเปลี่ยนแปลงที่เราดำเนินการกับ Blink จะผ่านการทดสอบกว่า 30,000 ครั้งในทันที ยังไม่รวมถึงการทดสอบ Chromium ทั้งหมดที่เรียกใช้เพิ่มเติมในภายหลัง เราใช้ระบบปราบปรามตลอด 24 ชั่วโมง โดยใช้บ็อตนับพัน ตัวเปรียบเทียบหลายพันรายการ และระบบที่ช่วยบล็อกหน้าเว็บที่เสียหายหลายล้านหน้าเพื่อป้องกันไม่ให้หน้าเว็บตกหล่น เราทราบว่าอุปกรณ์เคลื่อนที่ช้าลงมากและนี่เป็นสิ่งที่เรากำลังพยายามปรับปรุง

แล้วมีอะไรใหม่

  • Web Components: ดูการบรรยายของ Eric Bidelman
  • ภาพเคลื่อนไหวบนเว็บ: ภาพเคลื่อนไหวคุณภาพสูงที่ซับซ้อน ซิงค์ข้อมูล ซึ่งใช้ GPU ทุกครั้งที่เป็นไปได้
  • เลย์เอาต์บางส่วน: คำนวณเฉพาะสิ่งที่คุณต้องการ
  • ตารางกริด CSS
  • รูปภาพที่ปรับเปลี่ยนตามอุปกรณ์: srcset หรือ srcN หรือ ?
  • การปรับขนาดข้อความอัตโนมัติที่รวดเร็วขึ้นและแบบอักษรพิกเซลย่อยที่สม่ำเสมอ
  • Skia ซึ่งเป็นระบบกราฟิกที่ Blink ใช้กำลังเปลี่ยนจาก GDI ไปใช้ DirectWrite ใน Windows

เราต้องการทราบความคิดเห็นของคุณ

ถ้าคุณรู้สึกว่า C++ อยู่ในสายเลือดและต้องการเขียน C++ กับเรา โค้ดทั้งหมดของเราเปิดกว้าง คุณไม่จำเป็นต้องบอกใครหรือชักจูงเราเลย คุณเพียงแค่โพสต์แพตช์หรือรายงานข้อบกพร่อง

สไลด์: กะพริบตา

ความปลอดภัย

โดย Parisa Tabriz

ในปัจจุบัน ผู้คนเชื่อมต่อกับเว็บมากกว่าที่เคย และจากหลายๆ ที่

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

เหนือสิ่งอื่นใด ในฐานะนักพัฒนาซอฟต์แวร์ เราจําเป็นต้องเข้าใจถึงความจําเป็นและการใช้งานได้จริงของ SSL

SSL คืออะไร ย่อมาจาก Secure Sockets Layer ซึ่งเป็นโปรโตคอลการเข้ารหัสที่ออกแบบมาเพื่อมอบความปลอดภัยในการสื่อสารผ่านอินเทอร์เน็ต โดยจะรับประกันความเป็นส่วนตัวผ่านการเข้ารหัสและความสมบูรณ์ เพื่อป้องกันการสอดแนมหรือรบกวนการเชื่อมต่ออินเทอร์เน็ต SSL มีข้อบกพร่อง แต่ก็เป็นวิธีการชั้นนำและเป็นวิธีเดียวที่จะช่วยรับประกันความปลอดภัยให้กับการสื่อสารข้อมูลทุกรูปแบบบนอินเทอร์เน็ต

จากข้อมูลของ SSL Pulse ปีที่ผ่านมาเรามีการใช้ SSL เพียง 15% โดยประมาณ แต่ปัจจุบันเรามีผู้นำไปใช้มากกว่า 50%

ตัวย่อสองคำ:

  • TLS: สำหรับ Intent และวัตถุประสงค์ส่วนใหญ่เหมือนกับ SSL กล่าวให้ชัดเจนคือ ได้เปลี่ยนชื่อ SSL 3.1 เป็น TLS และ TLS เป็นชื่อมาตรฐาน IETF แต่ใช้แทนกันได้

  • HTTPS: คือ HTTP บน SSL ซึ่งเป็นเพียงการซ้อนความสามารถในการรักษาความปลอดภัยของ SSL และ HTTP มาตรฐานซ้อนกัน วิธีแรกคือ แฮนด์เชคไคลเอ็นต์และเซิร์ฟเวอร์ โดยใช้วิทยาการเข้ารหัสคีย์สาธารณะ/คีย์ส่วนตัวในการสร้างคีย์ที่ใช้ร่วมกัน ซึ่งใช้โดยโปรโตคอล SSL ส่วนที่สองเพื่อเข้ารหัสการสื่อสาร

เครือข่ายบนอินเทอร์เน็ตอาจให้ความรู้สึกปลอดภัย ฉับไว ฉับไว ให้ความรู้สึกเหมือนเรากำลังพูดคุยกับเว็บไซต์โดยตรง แต่จริงๆ แล้ว มันไม่ได้เป็นความสัมพันธ์โดยตรง การสื่อสารของเราเกิดขึ้นผ่านเราเตอร์ Wi-Fi, ISP หรือพร็อกซีตัวกลางอื่นๆ ระหว่างอุปกรณ์ของคุณและเว็บไซต์ หากไม่มี HTTPS การสื่อสารทั้งหมดของเราจะเป็นข้อความธรรมดา

แต่ปัญหาคือผู้ใช้แทบจะไม่พิมพ์ URL แบบเต็มที่ระบุ HTTPS หรือคลิกลิงก์โดยใช้ HTTP ที่แย่กว่านั้นคือ คุณสามารถติดตั้งการโจมตีแบบ (wo)man-in-the-middle และแทนที่ HTTPS ด้วย HTTP ได้ เครื่องมือที่เรียกว่า SSLstrip ที่นำมาใช้ในปี 2009 สามารถทำเช่นนั้นได้ Firesheep จากปี 2010 ได้ฟังการเปิดเครือข่าย Wi-Fi เพื่อให้คุกกี้ที่ส่งไปในที่โล่ง ซึ่งหมายความว่าคุณสามารถฟังในแชทหรือลงชื่อเข้าสู่ระบบบัญชี Facebook ของคนอื่นได้

แต่ SSL มีราคาถูก (ค่อนข้าง) ถูก รวดเร็ว และใช้งานง่าย (ลองดูที่ ssllabs.com และหนังสือเรื่อง High Performance Browser Networking ของ Ilya Grigorik) การปักหมุดคีย์สาธารณะออกแบบมาเพื่อช่วยให้ผู้ให้บริการเว็บไซต์สามารถจำกัดผู้ออกใบรับรองที่สามารถออกใบรับรองสำหรับเว็บไซต์ของตนได้จริง

"ในเดือนมกราคมของปีนี้ (2010) Gmail เปลี่ยนไปใช้ HTTPS กับทุกอย่างโดยค่าเริ่มต้น เราจึงไม่ต้องใช้เครื่องเพิ่มอีกและไม่ต้องใช้ฮาร์ดแวร์พิเศษใดๆ เลย สำหรับเครื่องฟรอนท์เอนด์ที่ใช้งานจริงของเรา SSL รองรับการใช้งาน CPU น้อยกว่า 1%, หน่วยความจำน้อยกว่า 10 KB ต่อการเชื่อมต่อ และโอเวอร์เฮดเครือข่ายน้อยกว่า 2%...

ถ้าคุณหยุดอ่านตอนนี้ คุณต้องจำไว้อย่างเดียวว่า SSL ไม่ได้มีค่าใช้จ่ายในการคำนวณอีกต่อไป"

Overclocking SSL, Adam Langley (Google)

สุดท้ายนี้ ข้อบกพร่อง 2-3 อย่างที่เราพบบ่อยที่สุด ได้แก่

  • เนื้อหาผสม: เว็บไซต์ที่ใช้ HTTP และ HTTPS ผู้ใช้จะรำคาญเพราะต้องคลิกปุ่มสิทธิ์เพื่อโหลดเนื้อหา (จริงๆ แล้ว Chrome และ Firefox บล็อกเนื้อหาผสมจาก iframe) ตรวจสอบว่าทรัพยากรทั้งหมดในหน้า HTTPS โหลดโดยใช้ HTTPS โดยใช้ URL แบบสัมพัทธ์หรือแบบสัมพัทธ์ เช่น <style src="//foo.com/style.css">
  • คุกกี้ที่ไม่ปลอดภัย: ส่งในการล้างข้อมูลผ่านการเชื่อมต่อ HTTP คุณหลีกเลี่ยงปัญหานี้ได้โดยการตั้งค่าแอตทริบิวต์ที่ปลอดภัยในส่วนหัวของคุกกี้ นอกจากนี้ คุณยังใช้ส่วนหัว "Strict Transport Security" ใหม่เพื่อกำหนด SSL Transport Security (HSTS) ได้ด้วย

แย่งลูกกลับมา

  • หากคุณให้ความสำคัญกับความเป็นส่วนตัวและความถูกต้องของข้อมูลผู้ใช้ คุณต้องใช้ SSL ซึ่งเร็วกว่า ง่ายกว่า และถูกกว่าที่เคย
  • หลีกเลี่ยง Getcha ในการติดตั้งใช้งานที่พบได้บ่อย เช่น ข้อบกพร่องของเนื้อหาผสม หรือการไม่ตั้งค่าบิตของส่วนหัว HTTP ที่ถูกต้อง
  • ใช้ URL สัมพัทธ์หรือ URL สัมพัทธ์ของรูปแบบ
  • ลองดูตัวอย่างสุดเจ๋งใหม่ๆ เช่น HSTS และการปักหมุดใบรับรอง

สไลด์: หากมี SSL

API สื่อสำหรับเว็บที่มีอุปกรณ์หลายเครื่อง

โดย Sam Dutton และ Jan Linden

ปัจจุบันเราเห็นการเติบโตอย่างมากในด้านการสื่อสารผ่านเสียง วิดีโอ และการสื่อสารแบบเรียลไทม์ควบคู่ไปกับการเพิ่มขึ้นอย่างรวดเร็วของอุปกรณ์และแพลตฟอร์มใหม่บนเว็บ สื่อออนไลน์กำลังเปลี่ยนแปลงวิธีที่เราบริโภคสื่อทุกประเภท

การศึกษาของรัฐบาลสหราชอาณาจักรพบว่า 53% ของผู้ใหญ่ใช้ "สื่อมัลติทาสก์" ขณะดูทีวี โดยใช้อุปกรณ์เคลื่อนที่เพื่อแชร์และรับชมสื่อ ในหลายประเทศ จำนวนการรับชมทีวีลดลงแต่การดูทางออนไลน์นั้นเพิ่มขึ้น ตัวอย่างเช่น ในประเทศจีน ในปี 2012 มีเพียง 30% ของครัวเรือนในปักกิ่งที่ดูทีวี ซึ่งลดลงจาก 70% ในปี 2009 จากไฮไลต์ของ W3C ปี 2013 ระบุว่า "ในปีที่ผ่านมามีการดูวิดีโอบนอุปกรณ์เคลื่อนที่เพิ่มขึ้นถึง 2 เท่า ปีนี้ในสหรัฐอเมริกา เวลาเฉลี่ยที่ใช้กับสื่อดิจิทัลต่อวันจะแซงหน้าทีวี การดูไม่ใช่การกระทำเฉยๆ อีกต่อไป ในสหรัฐอเมริกา ผู้บริโภคสายบันเทิง 87% กล่าวว่าตนใช้อุปกรณ์ที่มีหน้าจอที่ 2 อย่างน้อย 1 เครื่องขณะดูโทรทัศน์" จากข้อมูลของ Cisco "วิดีโอ... จะอยู่ในช่วงการเข้าชมของผู้บริโภคทั่วโลก 80-90 เปอร์เซ็นต์ภายในปี 2017" ซึ่งเท่ากับว่าแต่ละวินาทีมีวิดีโอเกือบ 1 ล้านนาที

แล้วเราอยากให้นักพัฒนาเว็บทำอะไรได้บ้าง ระบบนิเวศของ API สื่อสำหรับเว็บแบบเปิด: เทคโนโลยีที่ได้มาตรฐานและทำงานร่วมกันได้ และทำงานในหลายแพลตฟอร์ม

แย่งลูกกลับมา

  • WebRTC ให้บริการการสื่อสารแบบเรียลไทม์ในเบราว์เซอร์ และขณะนี้รองรับอย่างกว้างขวางทั้งในอุปกรณ์เคลื่อนที่และเดสก์ท็อป โดยรวมแล้วมีปลายทาง WebRTC แล้วกว่า 1.2 พันล้านรายการ
  • Web Audio มีเครื่องมือที่ซับซ้อนสำหรับการสังเคราะห์และการประมวลผลเสียง
  • Web MIDI ที่ผสานรวมกับ Web Audio ช่วยให้โต้ตอบกับอุปกรณ์ MIDI ได้
  • ปัจจุบันเบราว์เซอร์ในอุปกรณ์เคลื่อนที่และเดสก์ท็อปมากกว่า 85% รองรับองค์ประกอบเสียงและวิดีโอแล้ว
  • ส่วนขยายแหล่งที่มาของสื่อสามารถใช้สำหรับสตรีมมิงแบบปรับได้และการเปลี่ยนเวลา
  • EME เปิดใช้การเล่นเนื้อหาที่มีการป้องกัน
  • ข้อความถอดเสียง คำบรรยายวิดีโอ และองค์ประกอบแทร็กจะเปิดใช้คำบรรยาย คำบรรยายวิดีโอ ข้อมูลเมตาที่กำหนดเวลา การทำ Deep Link และการค้นหาแบบเจาะลึก

สไลด์: API สื่อสำหรับเว็บแบบหลายอุปกรณ์