ฟีเจอร์ใหม่ใน Chrome 75

พีต เลอเพจ

ใน Chrome 75 เราได้เพิ่มการสนับสนุนสำหรับ

ผมชื่อ Pete LePage ผมจะมาเจาะลึกว่า มีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 75!

บันทึกการเปลี่ยนแปลง

ซึ่งจะกล่าวถึงไฮไลต์ที่สำคัญเพียงบางส่วนเท่านั้น โปรดดูการเปลี่ยนแปลงเพิ่มเติมใน Chrome 75 จากลิงก์ด้านล่าง

คำแนะนำสำหรับ canvas บริบทที่มีเวลาในการตอบสนองต่ำ

การวาดบนหน้าจอด้วยเอลิเมนต์ Canvas ทำให้หน้าเว็บต้องซิงโครไนซ์การอัปเดตกราฟิกกับ DOM บางครั้งการซิงค์นี้อาจทำให้เกิดความล่าช้า เช่น ในแอปวาดภาพ เวลาในการตอบสนองที่นานกว่า 50 มิลลิวินาทีอาจรบกวนการทำงานที่ประสานกันระหว่างมือและตา ซึ่งทำให้ใช้งานยาก

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

คุณสามารถใช้คำแนะนำที่ไม่ซิงค์กันได้ง่ายๆ เพียงเพิ่ม desynchronized: true ลงในออบเจ็กต์ตัวเลือกเมื่อสร้าง Canvas

const opts = { desynchronized: true };
const ctx = canvas.getContext('2d', opts);

ดูรายละเอียดเพิ่มเติมรวมถึงวิธีตรวจหาฟีเจอร์ได้จากบทความของ Joe เรื่องการแสดงผลเวลาในการตอบสนองต่ำพร้อมด้วยคำแนะนำแบบไม่ซิงค์

แชร์ไฟล์ด้วย Web Share API

Web Share API ช่วยให้คุณเชื่อมต่อกับบริการแชร์จากระบบปฏิบัติการได้ ซึ่งช่วยให้แชร์หน้าเว็บและแอปต่างๆ กับแอปอื่นๆ ที่ติดตั้งไว้ในอุปกรณ์ของผู้ใช้ได้ง่าย

ใน Chrome 75 Web Share API รองรับการแชร์ไฟล์แล้ว สิ่งที่ฉันตื่นเต้นเป็นพิเศษเพราะช่วยให้แอปแชร์รูปภาพ วิดีโอ และอื่นๆ ได้ง่ายขึ้น Squoosh เพิ่มการรองรับการดำเนินการนี้เพื่อแชร์ไฟล์ เมื่อคุณบีบอัดเสร็จแล้ว ปัจจุบัน Web Share API รองรับการแชร์ไฟล์เสียง รูปภาพ วิดีโอ และเอกสารข้อความ

วิธีที่ดีที่สุดคือใช้การตรวจหาฟีเจอร์เพื่อดูว่ามีการรองรับ Web Share API หรือไม่ และใช้กลไกดั้งเดิมแทนหากไม่รองรับ และใช้ navigator.canShare เพื่อตรวจสอบว่าระบบรองรับการแชร์ไฟล์หรือไม่


const webShareAvailable = {
  links: 'share' in navigator,
  files: 'canShare' in navigator,
};

หาก navigator.canShare แสดงผล true ระบบจะรองรับการแชร์ไฟล์เหล่านั้น คุณจึงเรียกใช้ navigator.share และส่งออบเจ็กต์ที่มีอาร์เรย์ของไฟล์ที่ต้องการแชร์ได้ Chrome จะเปิดชีตการแชร์ของระบบและแสดงรายการแอปที่ติดตั้งไว้ซึ่งคุณแชร์ไฟล์ได้

if (webShareAvailable.files) {
  const shareData = { files: filesArray };
  if (navigator.canShare(shareData)) {
    shareData.title = 'Squooshed files.';
    navigator.share(shareData)
      .then(...)
      .catch(...);
  } else {
    // File sharing not supported
  }
}

ทดลองใช้การสาธิตและอ่านบทความแชร์ไฟล์ด้วย Web Share เพื่อดูรายละเอียดทั้งหมด

เครื่องหมายคั่นตัวเลข

ตอนนี้ลิเทอรัลที่เป็นตัวเลขได้อนุญาตให้ใช้ขีดล่าง (_, U+005F) เป็นตัวคั่นเพื่อให้อ่านได้ง่ายขึ้น เช่น การดำเนินการทางคณิตศาสตร์จะตีความ 1_000_000_000 ว่าเทียบเท่ากับ 1000000000

ไม่อนุญาตให้ใช้ขีดล่างที่แสดงระหว่างตัวเลขเท่านั้น และไม่อนุญาตให้ใช้ขีดล่างติดกัน ดังนั้นลิเทอรัลอย่าง 3._14, _2.71 หรือ 1.6__2 จึงเป็นสิ่งผิดกฎหมาย

สรุปงาน Google I/O 2019

หากคุณไม่ได้มาเข้าร่วมงาน I/O หรืออาจจะได้เข้าร่วมงานและไม่เห็นการบรรยายทั้งหมด คุณสามารถคุยกันได้ที่ช่อง YouTube สำหรับนักพัฒนาซอฟต์แวร์ Chrome ในเพลย์ลิสต์ Web at Google I/O 2019

ติดตาม

หากต้องการติดตามวิดีโอล่าสุดของเรา โปรดติดตามช่อง YouTube สำหรับนักพัฒนาซอฟต์แวร์ Chrome และคุณจะได้รับการแจ้งเตือนทางอีเมลทุกครั้งที่เราเปิดตัววิดีโอใหม่

ผมชื่อ Pete LePage และทันทีที่เปิดตัว Chrome 76 ผมจะบอกคุณว่า มีอะไรใหม่ใน Chrome!

เครดิตรูปภาพ