Baru di Chrome 94

Pete LePage

Berikut hal yang perlu Anda ketahui:

  • Ruang warna default untuk elemen <canvas> kini secara resmi ditentukan dalam spesifikasi sebagai SRGB, dan Anda dapat mengubahnya menjadi Display P3.
  • WebCodecs adalah cara tingkat rendah yang baru untuk mengakses codec audio dan video bawaan, yang penting untuk streaming game, editor video, dan sebagainya.
  • WebGPU memulai uji coba originnya.
  • PWA Summit akan diselenggarakan pada 6-7 Oktober.
  • Dan masih banyak lagi.

Saya Pete LePage, bekerja, dan mengambil gambar dari rumah. Mari selami dan lihat apa yang baru untuk developer di Chrome 94.

Ruang warna default untuk elemen canvas

Cara warna dirender di layar sangat penting bagi sebagian pengguna. Untuk fotografer, ilustrator cetak, dan banyak lagi, warna di layar harus sesuai dengan yang dicetak. Mulai Chrome 94, elemen <canvas> terkelola sepenuhnya dengan warna menggunakan sRGB. Sebelumnya, sRGB adalah konvensi, tetapi tidak didefinisikan secara eksplisit dalam spesifikasi.

opts = {colorSpace:'display-p3'};
const ctx = canvas.getContext('2d', opts);

Lebih penting lagi, kini Anda dapat menentukan ruang warna mana yang akan digunakan saat membuat objek 2d konteks rendering <canvas>, atau objek ImageData, termasuk ruang warna P3.

WebCodecs

Menempatkan video di dalam halaman itu cukup mudah. Namun, jika Anda perlu melakukan sesuatu yang sedikit lebih kompleks dan berinteraksi dengan komponen streaming video, hal ini akan sulit dilakukan, dan biasanya mengharuskan Anda menggunakan Web Assembly untuk mengirimkan codec Anda sendiri.

Namun, mengirimkan codec Anda sendiri berarti menulis kode yang sudah dimiliki browser, dan browser tidak bisa memanfaatkan akselerasi hardware. Web Codecs API memungkinkan penggunaan komponen media dan codec yang sudah ada di browser.

Secara pribadi, saya kesulitan mengingat tombol command line yang tepat untuk mengenkode video untuk web, atau mengonversi GIF ke file video. Dengan menggunakan API yang tersedia melalui WebCodecs, saya dapat dengan cepat membuat aplikasi web yang dapat membaca file dan mengekspor file yang benar-benar diperlukan untuk web.

Jalur dari Canvas atau ImageBitmap ke jaringan atau ke penyimpanan
Jalur dari Canvas atau ImageBitmap ke jaringan atau ke penyimpanan

Aplikasi web yang memerlukan kontrol penuh atas pemrosesan konten media, seperti editor video, konferensi video, aplikasi streaming, dan sebagainya. Akses ke browser yang ada di dalam kontrol media sangatlah besar.

Menampilkan apa pun yang berguna dalam tiga puluh detik itu sulit, jadi lihat Pemrosesan video dengan WebCodecs di web.dev untuk mempelajari lebih dalam tentang berbagai kode dan beberapa demo keren.

WebGPU

WebGPU adalah API baru yang menampilkan kemampuan grafis modern, khususnya Direct3D 12, Metal, dan Vulkan. Anda dapat menganggapnya seperti WebGL, tetapi menyediakan akses ke fitur GPU yang lebih canggih dan juga menyediakan dukungan untuk melakukan komputasi umum pada GPU.

Diagram arsitektur menunjukkan koneksi WebGPU antara API OS dan Direct3D 12, Metal, dan Vulkan.
Diagram arsitektur WebGPU

Aplikasi ini memulai uji coba origin di Chrome 94, dan Safari serta Firefox saat ini sedang mengerjakan implementasinya.

Demo Babylon.js tentang laut kasar yang disimulasikan menggunakan kemampuan shader komputasi WebGPU.

François memiliki artikel bagus, Mengakses fitur GPU modern dengan WebGPU di web.dev dengan detailnya, dan membandingkan performa perkalian matriks yang berjalan pada CPU terhadap GPU. Berikut petunjuknya. GPU yang unggul.

PWA Summit

PWA Summit akan diselenggarakan pada 6-7 Oktober. Ini adalah konferensi online gratis yang berfokus untuk membantu semua orang agar berhasil dengan Progressive Web App. PWA Summit adalah kolaborasi antara orang-orang dari beberapa perusahaan yang berbeda yang terlibat dalam pembuatan teknologi PWA: Google, Intel, Microsoft, dan Samsung.

Ada banyak bincang-bincang dan konten hebat. Anda dapat mempelajari lebih lanjut dan mendaftar di PWASummit.org. Sampai jumpa.

Dan banyak lagi!

Tentu saja masih banyak lagi.

Metode scheduler.postTask() yang diprioritaskan memungkinkan Anda menjadwalkan tugas, dan mengubah prioritas secara dinamis, atau membatalkan semuanya bersama-sama.

Jika Anda pernah bertarung dengan tata letak ulang saat scroll bar muncul, properti scrollbar-gutter akan membuat Anda senang. Library ini memberikan kontrol atas keberadaan gutter scrollbar, sehingga Anda dapat mencegah perubahan tata letak saat konten diperluas.

Penggunaan WebSQL dalam konteks pihak ketiga kini tidak digunakan lagi, dan penghapusan diperkirakan akan dilakukan di Chrome 97. Standar Basis Data Web SQL diabaikan pada November 2010. Metode ini tidak pernah diterapkan di Firefox, dan tidak digunakan lagi di Safari pada tahun 2019. Versi ini tidak akan digunakan lagi dan dihapus dari Chrome jika penggunaannya cukup rendah. Jika Anda masih menggunakan WebSQL, sekarang adalah saat yang tepat untuk mulai merencanakan migrasi Anda dari WebSQL.

Dan API keyboard virtual memberi Anda lebih banyak kontrol atas cara dan waktu keyboard virtual ditampilkan. Hal ini memungkinkan Anda secara eksplisit mengontrol perilaku scroll, atau perubahan tata letak saat keyboard muncul atau menghilang.

Bacaan lebih lanjut

Artikel ini hanya mencakup beberapa sorotan utama. Periksa link di bawah untuk melihat perubahan tambahan di Chrome 94.

Langganan

Untuk terus mengikuti info terbaru, berlangganan channel YouTube Chrome Developers, dan Anda akan mendapatkan notifikasi email setiap kali kami meluncurkan video baru.

Saya Pete LePage, dan segera setelah Chrome 95 dirilis, saya akan ada di sini untuk memberi tahu Anda apa yang baru di Chrome!