ใหม่ใน Chrome 88

Pete LePage

Chrome 88 กำลังเริ่มเปิดตัวเวอร์ชันเสถียรแล้ว

สิ่งที่จำเป็นต้องทราบมีดังนี้

  • ตอนนี้คุณอัปโหลดส่วนขยายโดยใช้ Manifest V3 ไปยัง Chrome เว็บสโตร์ได้แล้ว
  • พร็อพเพอร์ตี้ CSS aspect-ratio ช่วยให้คุณกำหนดสัดส่วนการแสดงผลในองค์ประกอบใดก็ได้
  • Chrome 88 จะจำกัดตัวจับเวลา JavaScript ที่ลิงก์กันอย่างมากสำหรับหน้าเว็บที่ซ่อนอยู่ในบางเงื่อนไข
  • ตอนนี้คุณใช้ Play Billing ในกิจกรรมในเว็บที่เชื่อถือได้แล้ว
  • วิดีโอทั้งหมดจาก Chrome Dev Summit พร้อมให้รับชมแล้ว
  • และยังมีอีกมากมาย

ผมชื่อ Pete LePage ทำงานและถ่ายทำจากที่บ้าน ไปดูกันว่ามีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 88

Manifest V3

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

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

โดยแนะนำ Service Worker มาใช้แทนหน้าเว็บเบื้องหลัง เนื่องจาก Service Worker จะอยู่ในหน่วยความจำเมื่อจำเป็นเท่านั้น ส่วนขยายจึงใช้ทรัพยากรระบบน้อยลง

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

ดูรายละเอียดทั้งหมดและวิธีย้ายข้อมูลส่วนขยายปัจจุบันไปยัง Manifest V3 ได้ที่ developer.chrome.com


พร็อพเพอร์ตี้ aspect-ratio ของ CSS

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

<!-- Height is auto-computed from width & aspect ratio -->
<img src="..." style="width: 800px;">

ใน Chrome 88 พร็อพเพอร์ตี้ aspect-ratio ช่วยให้คุณระบุสัดส่วนการแสดงผลได้อย่างชัดเจน ซึ่งจะทําให้มีลักษณะการทํางานคล้ายกัน

.square {
  aspect-ratio: 1 / 1;
}

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

.square {
  aspect-ratio: 1 / 1;
}

@supports not (aspect-ratio: 1 / 1) {
  .square {
    height: 4rem;
    width: 4rem;
  }
}

ขอขอบคุณ Jen Simmons ที่แจ้งให้เราทราบว่า Safari Technical Preview เวอร์ชันล่าสุดรองรับฟีเจอร์นี้ เราจึงน่าจะได้เห็นฟีเจอร์นี้ใน Safari เร็วๆ นี้ และดูการสาธิตของ Una เพื่อดูการใช้งานจริง

การควบคุมตัวจับเวลา JS ที่ต่อกันอย่างหนัก

Chrome 88 จะควบคุมตัวจับเวลา JavaScript ที่ลิงก์กันสำหรับหน้าที่ซ่อนอยู่อย่างหนักในบางเงื่อนไข ซึ่งจะช่วยลดการใช้งาน CPU และการใช้แบตเตอรี่ด้วย ในกรณีที่ไม่ปกติบางอย่าง การตั้งค่านี้จะเปลี่ยนลักษณะการทํางาน แต่มักจะใช้ตัวจับเวลาในกรณีที่ API อื่นมีประสิทธิภาพและเชื่อถือได้มากกว่า

ข้อความข้างต้นเป็นศัพท์เทคนิคและค่อนข้างคลุมเครือ ดังนั้นโปรดอ่านบทความของ Jake เรื่องการจำกัดตัวจับเวลา JS ที่ต่อกันอย่างหนักตั้งแต่ Chrome 88 เพื่อดูรายละเอียดทั้งหมด

การเรียกเก็บเงินของ Play ในกิจกรรมในเว็บซึ่งเชื่อถือได้

ตอนนี้คุณใช้ Play Billing ในกิจกรรมบนเว็บที่เชื่อถือได้เพื่อขายสินค้าดิจิทัลและการสมัครใช้บริการโดยใช้ Digital Goods API ใหม่ได้แล้ว ฟีเจอร์นี้พร้อมให้ทดลองใช้เป็นแหล่งที่มาใน Chrome 88 บน Android และเราคาดว่าจะขยายการทดลองใช้แหล่งที่มาไปยัง ChromeOS ในรุ่นถัดไป

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

// Get list of potential digital goods

const itemService =
  await window.getDigitalGoodsService("https://play.google.com/billing");

const details =
  await itemService.getDetails(['ripe_bananas', 'walnuts', 'pecans' ]);

Adriana และ Andre อธิบายรายละเอียดเพิ่มเติมในการพูดคุยเกี่ยวกับ Chrome Dev Summit หัวข้อมีอะไรใหม่สำหรับเว็บแอปใน Play หรืออ่านเอกสารประกอบ

และอื่นๆ

และยังมีอีกมากมาย

  • เพื่อให้สอดคล้องกับการเปลี่ยนแปลงมาตรฐาน HTML ตอนนี้แท็กแอตทริบิวต์ที่มี target="_blank" จะนัยถึง rel="noopener" โดยค่าเริ่มต้น ซึ่งจะช่วยป้องกันการโจมตีด้วยการแตะแท็บ
  • ระบบปฏิบัติการส่วนใหญ่จะเปิดใช้การเร่งความเร็วเมาส์โดยค่าเริ่มต้น แต่อาจทำให้เกิดปัญหากับบางเกม ใน Chrome 88 Pointer Lock API ช่วยให้คุณปิดใช้การเร่งความเร็วของเมาส์ได้ ซึ่งหมายความว่าการเคลื่อนไหวของร่างกายแบบเดียวกันไม่ว่าจะช้าหรือเร็วจะทำให้เกิดการหมุนแบบเดียวกัน ซึ่งมอบประสบการณ์การเล่นเกมที่ดีขึ้นและความแม่นยำสูงขึ้น
  • และตอนนี้ addEventListener จะใช้สัญญาณยกเลิกเป็นตัวเลือก การเรียกใช้ abort() จะนํา Listener เหตุการณ์นั้นออก ซึ่งทำให้ปิด Listener เหตุการณ์ได้ง่ายเมื่อไม่จําเป็นต้องใช้แล้ว

อ่านเพิ่มเติม

ข้อมูลนี้เป็นเพียงไฮไลต์สำคัญบางส่วนเท่านั้น ดูการเปลี่ยนแปลงเพิ่มเติมใน Chrome 88 ได้ที่ลิงก์ด้านล่าง

สมัครใช้บริการ

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

ผมชื่อ Pete LePage และทันทีที่ Chrome 89 เปิดตัว เราจะมาบอกคุณถึงสิ่งใหม่ๆ ใน Chrome