Baru di Chrome 74

Pete LePage

Di Chrome 74, kami telah menambahkan dukungan untuk:

Dan masih banyak lagi fitur lainnya.

Saya Pete LePage. Mari kita lihat yang baru untuk developer di Chrome 74.

Log perubahan

Bagian ini hanya mencakup beberapa sorotan utama. Lihat link di bawah untuk perubahan tambahan di Chrome 74.

Kolom class pribadi

Kolom class menyederhanakan sintaksis class dengan menghindari perlunya 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 mengatakan bahwa kolom class pribadi sedang dalam proses. Dengan senang hati kami sampaikan bahwa kolom class pribadi telah hadir di Chrome 74. Sintaksis kolom pribadi baru mirip dengan kolom publik, kecuali Anda menandai kolom sebagai pribadi menggunakan # (tanda pagar). Anggap # sebagai bagian dari nama kolom.

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

Ingat, kolom private bersifat pribadi. Class ini dapat diakses di dalam class, tetapi tidak tersedia di luar isi class.

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

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

prefers-reduced-motion

Beberapa pengguna melaporkan rasa mual saat melihat scrolling paralaks, zooming, dan efek gerakan lainnya. Untuk mengatasinya, banyak sistem operasi menyediakan opsi untuk mengurangi gerakan jika memungkinkan.

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


@media (prefers-reduced-motion: reduce)

Bayangkan saya memiliki tombol sign-up yang menarik perhatian dengan sedikit gerakan. Kueri baru ini memungkinkan saya menonaktifkan gerakan hanya untuk tombol tersebut.

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

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

Baca artikel Tom Move Ya! Atau mungkin, jangan, jika pengguna prefers-reduced-motion! untuk mengetahui detail selengkapnya.

Peristiwa transition CSS

Spesifikasi CSS Transition mewajibkan peristiwa transisi dikirim saat transisi diantrekan, dimulai, diakhiri, atau dibatalkan. Peristiwa ini telah didukung di browser lain selama beberapa waktu…

Namun, hingga saat ini, fitur 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 memodifikasi perilaku API dan fitur web lainnya secara selektif. Hal ini dilakukan melalui header Feature-Policy atau melalui atribut izin 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(...).
  • Selain itu, Anda bisa mendapatkan daftar domain yang digunakan di halaman saat ini yang mengizinkan fitur yang ditentukan dengan document.featurePolicy.getAllowlistForFeature().

Lihat postingan Pengantar Kebijakan Fitur untuk mengetahui detail selengkapnya.

Dan banyak lagi!

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

Google I/O akan segera hadir!

Dan jangan lupa, Google I/O akan berlangsung dalam beberapa minggu lagi (7 hingga 9 Mei) dan kami akan menghadirkan banyak hal baru yang menarik untuk Anda. Jika Anda tidak dapat hadir, semua sesi akan disiarkan secara live streaming, dan akan tersedia di saluran YouTube Chrome Developers setelah itu.

Langganan

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

Saya Pete LePage, dan segera setelah Chrome 75 dirilis, saya akan langsung memberi tahu Anda -- yang baru di Chrome.