Baru di Chrome 74

Pete LePage

Di Chrome 74, kami telah menambahkan dukungan untuk:

Dan masih ada banyak lagi!

Saya Pete LePage. Mari selami dan lihat apa yang baru untuk developer di Chrome 74!

Log perubahan

Ini hanya mencakup beberapa sorotan utama, periksa link di bawah untuk perubahan tambahan di Chrome 74.

Kolom class pribadi

Kolom class menyederhanakan sintaksis class dengan menghindari kebutuhan akan fungsi konstruktor hanya untuk menentukan properti instance. Di Chrome 72, kami menambahkan dukungan untuk kolom class publik.

class IncreasingCounter {
  // Public class field
  _publicValue = 0;
  get value() {
    return this._publicValue;
  }
  increment() {
    this._publicValue++;
  }
}

Dan saya bilang bidang kelas pribadi sedang diperbaiki. Saya senang mengatakan bahwa bidang kelas pribadi telah diterapkan di Chrome 74. Sintaksis kolom pribadi baru mirip dengan kolom publik, tetapi Anda menandai kolom tersebut sebagai pribadi menggunakan # (tanda pagar). Anggaplah # sebagai bagian dari nama kolom.

class IncreasingCounter {
  // Private class field
  #privateValue = 0;
  get value() {
    return this.#privateValue;
  }
  increment() {
    this.#privateValue++;
  }
}

Ingat, kolom private hanya bersifat pribadi. Fungsi tersebut dapat diakses di dalam class, tetapi tidak tersedia di luar isi class.

class SimpleClass {
  _iAmPublic = 'shared';
  #iAmPrivate = 'secret';
  doSomething() {
    ...
  }
}

Untuk membaca lebih lanjut tentang class publik dan pribadi, lihat postingan Mathias tentang kolom class.

prefers-reduced-motion

Beberapa pengguna melaporkan mengalami mabuk perjalanan saat melihat scrolling paralaks, zoom, dan efek gerakan lainnya. Untuk mengatasinya, banyak sistem operasi menyediakan opsi untuk mengurangi gerakan bila memungkinkan.

Chrome kini menyediakan kueri media, prefers-reduced-motion - bagian dari spesifikasi Kueri Media Level 5, yang memungkinkan Anda mendeteksi saat opsi ini diaktifkan.


@media (prefers-reduced-motion: reduce)

Bayangkan saya memiliki tombol daftar yang menarik perhatian ke tombol itu sendiri dengan sedikit gerakan. Kueri baru memungkinkan saya mematikan {i>motion <i}hanya untuk tombolnya.

button {
  animation: vibrate 0.3s linear infinite both;
}

@media (prefers-reduced-motion: reduce) {
  button {
    animation: none;
  }
}

Lihat artikel Tom Move Ya! Atau mungkin, jangan, jika pengguna lebih memilih-pengurangan-motion! untuk mengetahui detail selengkapnya.

Peristiwa transition CSS

Spesifikasi Transisi CSS mengharuskan peristiwa transisi dikirim saat transisi diantrekan, dimulai, berakhir, atau dibatalkan. Peristiwa ini telah didukung di browser lain selama beberapa waktu...

Namun, sampai sekarang, versi tersebut tidak didukung di Chrome. Di Chrome 74, kini Anda dapat memproses:

  • transitionrun
  • transitionstart
  • transitionend
  • transitioncancel

Dengan memproses peristiwa ini, Anda dapat melacak atau mengubah perilaku saat transisi dijalankan.

Update API kebijakan fitur

Kebijakan fitur, memungkinkan Anda mengaktifkan, menonaktifkan, dan mengubah perilaku API dan fitur web lainnya secara selektif. Hal ini dilakukan melalui header Kebijakan Fitur atau melalui atribut izinkan di iframe.

Feature-Policy: geolocation 'self'

<iframe ... allow="geolocation self">
</iframe>

Chrome 74 memperkenalkan kumpulan API baru untuk memeriksa fitur mana yang diaktifkan:

  • Anda bisa mendapatkan daftar fitur yang diizinkan dengan document.featurePolicy.allowedFeatures().
  • Anda dapat memeriksa apakah fitur tertentu diizinkan dengan document.featurePolicy.allowsFeature(...).
  • Anda juga bisa mendapatkan daftar domain yang digunakan di halaman saat ini yang mengizinkan fitur tertentu dengan document.featurePolicy.getAllowlistForFeature().

Lihat postingan Pengantar Kebijakan Fitur untuk detail selengkapnya.

Dan banyak lagi!

Ini hanyalah beberapa perubahan di Chrome 74 untuk developer, tentu saja, masih banyak lagi. Secara pribadi, saya cukup antusias dengan KV Storage, layanan penyimpanan kunci/nilai yang sangat cepat dan asinkron, yang tersedia sebagai uji coba origin.

Google I/O akan segera berlangsung!

Dan jangan lupa - Google I/O tinggal beberapa minggu lagi (7 sampai 9 Mei) dan kami akan punya banyak hal menarik baru untuk Anda. Jika Anda tidak dapat hadir, semua sesi akan di-live streaming, dan setelah itu akan tersedia di channel YouTube Developer Chrome kami.

Langganan

Ingin terus mengetahui info terbaru tentang video kami, lalu subscribe ke channel YouTube Developer Chrome kami, dan Anda akan mendapatkan notifikasi email setiap kali kami meluncurkan video baru.

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