Rangkuman 2024 Chrome untuk developer: Membayangkan ulang web dengan AI di DevTools, Gemini bawaan, dan kemampuan UI baru

Dipublikasikan: 13 Desember 2024

Saat internet baru dimulai, berada di internet berarti menunggu dengan sabar melalui dial-up yang lambat dan bermain-main dengan sedikit Perl dan HTML. Namun, web telah berkembang secara eksponensial dalam waktu yang terasa singkat. Baik Anda mendapatkan pengiriman bahan makanan pada menit-menit terakhir atau menggunakan AI untuk meringkas banyak artikel panjang, link kini menjadi portal menuju kemungkinan yang tak terbatas.

Itulah sebabnya banyak dari kita menyukai web. Untuk membantu Anda menarik perhatian lebih banyak orang di seluruh dunia, kami telah meluncurkan alat baru untuk semua developer web—baik Anda developer frontend atau full stack, pemula atau profesional.

Lihat rangkuman kemampuan inovatif kami tahun 2024 yang memungkinkan Anda membangun pengalaman web yang lebih imajinatif dengan lebih sedikit upaya.

AI bawaan di Chrome membantu developer menghadirkan fitur canggih dengan Gemini

Di Google I/O 2024, kami mengumumkan cara kami menggunakan AI untuk meningkatkan kualitas web dengan Gemini Nano yang dibuat langsung di Chrome. Hingga saat ini, lebih dari 13.000 orang telah bergabung dalam program pratinjau awal untuk membantu kami membentuk masa depan web. Kami sangat berterima kasih atas kontribusi Anda, dan kami tidak sabar menanti semua pengalaman AI inovatif yang akan Anda buat.

Untuk membantu Anda memanfaatkan AI secara maksimal, kami telah meluncurkan beberapa API bawaan ke uji coba origin, seperti Prompt API, Translator API, Summarizer API, dan Language Detector API eksperimental. Semua fitur tersebut memungkinkan Anda menjalankan tugas yang didukung AI di browser tanpa panggilan server, dan Anda tidak perlu mengelola dan men-deploy model AI Anda sendiri. Lebih dari 8.600 developer mendaftar untuk mengikuti Google Chrome Built-in AI Challenge untuk membuat aplikasi web atau Ekstensi Chrome menggunakan API ini. Kami akan mengumumkan pemenang pada pertengahan Januari, jadi nantikan pengumumannya.

PolicyBazaar menggunakan Language Detector API untuk mendeteksi bahasa saat pelanggan beralih bahasa selama percakapan.

AI di perangkat ditingkatkan dengan peningkatan WebAssembly (Wasm) dan WebGPU

Kami yakin bahwa web adalah runtime terbaik bagi Anda untuk membangun aplikasi yang mendukung AI yang dapat menjangkau semua orang. Untuk melengkapi pekerjaan kami pada API AI bawaan, kami juga telah melakukan peningkatan pada dua teknologi yang memungkinkan Anda menghadirkan model AI Anda sendiri ke web dan menjalankannya dengan cepat: WebGPU dan Wasm.

Kami telah memperkenalkan nilai floating point 16-bit di WebGPU dan produk dot bilangan bulat yang dipadatkan, yang memungkinkan penggunaan GPU perangkat yang lebih fleksibel dengan shader komputasi. Peningkatan mendatang yang direncanakan untuk WebGPU mencakup subgrup dan matriks subgrup. Fitur ini akan memungkinkan aplikasi berkomunikasi dengan cepat antar-thread GPU dan memanfaatkan perkalian matriks berukuran tetap secara maksimal. Kami juga akan memperkenalkan Memory64 ke Wasm pada tahun 2025 agar model AI yang lebih besar dapat ditangani dalam memori.

Grafik tolok ukur dari Transformers.js.
Tolok Ukur WebGPU dari Transformers.js menunjukkan bahwa WebGPU 32,51 kali lebih cepat daripada Wasm.

View Transition API membuat situs terasa lebih terhubung dari sebelumnya dengan navigasi yang lancar

Dengan kemampuan baru seperti transisi tampilan lintas dokumen, Anda dapat membuat navigasi yang lancar dan mulus di beberapa halaman. Anda hanya memerlukan beberapa baris CSS untuk menghilangkan "kedipan" muat ulang yang mengganggu tersebut. Navigasi yang lancar dan mirip native yang dihasilkan membantu Anda memberikan pengalaman yang lebih imersif sekaligus mempertahankan manfaat arsitektur multi-halaman.

Transisi tampilan memungkinkan navigasi lintas halaman yang lancar. Lihat demo transisi tampilan.

Posisi anchor dan popover CSS memungkinkan overlay interaktif tanpa JavaScript

Sekarang Anda dapat membuat tooltip, menu, dan overlay lainnya dengan popover dan menghubungkannya secara visual ke elemen pemicunya dengan CSS Anchor Positioning API. Yang Anda butuhkan hanyalah sedikit CSS dan HTML untuk memastikan overlay tetap ditambatkan dan terlihat bahkan saat orang men-scroll atau mengubah ukuran jendela. Pengguna Anda mendapatkan pengalaman web yang lebih andal dan dinamis, dan Anda tidak perlu lagi mengelola z-index dan perhitungan penempatan JavaScript yang rumit. Solusi ini saling menguntungkan.

Speculation Rules API memungkinkan navigasi yang hampir instan dengan melakukan pra-rendering halaman

Waktu pemuatan halaman berubah dari cepat menjadi hampir instan tahun ini dengan Speculation Rules API. API ini, yang hanya memerlukan beberapa baris JSON untuk diterapkan, memungkinkan halaman di- pra-render sepenuhnya di latar belakang sehingga siap digunakan kapan pun pengguna Anda siap.