Interop 2026 dimulai

• Proyek tahunan Interop 2026 dimulai, dengan mesin browser utama bekerja sama untuk meningkatkan interoperabilitas standar web
• Pengujian dilakukan pada 20 area inti, dengan 15 di antaranya merupakan item baru
• Tahun ini mencakup peningkatan fitur yang nyata seperti ekstensi CSS attr(), WebTransport, JSPI for Wasm, dan IndexedDB getAllRecords()
• Selain itu, proyek ini menargetkan konsistensi fitur presentasi visual seperti Scroll-driven Animations, View Transitions, contrast-color(), dan Container Style Queries
• Proyek ini merupakan kolaborasi antara Apple, Google, Microsoft, Mozilla, Igalia dan lainnya untuk menyediakan platform bersama yang lebih andal bagi pengembang web

---

Ringkasan Interop 2026

• Proyek Interop adalah program kolaboratif di mana mesin browser utama menjalankan pengujian bersama untuk mengurangi perbedaan implementasi teknologi web antar-browser
  • Setiap fitur dievaluasi berdasarkan kesesuaiannya dengan spesifikasi standar web resmi
  • Pengukuran interoperabilitas otomatis dilakukan melalui Web Platform Tests (WPT)
• Safari telah lebih dulu mengimplementasikan sejumlah fitur, dan pada Interop 2026 kali ini fokusnya adalah menutup kesenjangan kompatibilitas yang tersisa
• Dari fokus utama tahun ini, 20% terdiri dari empat area: advanced attr(), IndexedDB getAllRecords(), WebTransport, dan JSPI for Wasm
• Dasbor resmi Interop 2026 - https://wpt.fyi/interop-2026

Area fokus utama 2026 (20 item)

• Dari total 20 item, 15 merupakan item baru dan 5 dilanjutkan dari Interop 2025
  • Item utama meliputi: Anchor Positioning, Container Style Queries, contrast-color(), Custom Highlights, peningkatan Dialog/Popover, Fetch Uploads & Ranges, Navigation API, Scroll-driven Animations, Scroll Snap, shape(), View Transitions, WebRTC, WebTransport, CSS Zoom, dan lain-lain
• Setiap item bertujuan merapikan spesifikasi, meningkatkan pengujian, dan memastikan konsistensi implementasi

Rincian fitur utama

• Anchor Positioning

  • Fitur untuk menempatkan elemen secara relatif satu sama lain, dan merupakan item yang berlanjut sejak 2025
  • Tahun ini fokusnya pada memperjelas spesifikasi, menstabilkan pengujian, dan meningkatkan keandalan

• Advanced attr()

  • Diperluas agar nilai atribut HTML bisa dimanfaatkan di berbagai properti CSS
  • attr() yang sebelumnya terbatas pada properti content kini dapat dikonversi menjadi berbagai tipe seperti warna, panjang, sudut, dan lainnya
  • Masalah keamanan telah diselesaikan sehingga implementasi bersama antar-browser kini didorong

• Container Style Queries

  • Menerapkan gaya bersyarat berdasarkan nilai properti kustom dari container
  • Didukung sejak Safari 18.0, dan melalui Interop 2026 ditargetkan perilaku yang konsisten di semua browser

• contrast-color()

  • Secara otomatis memilih warna hitam/putih yang kontras dengan warna yang ditentukan
  • Safari dan Firefox mulai mendukungnya pada 2025, dan proyek ini mendorong kompatibilitas lintas semua browser

• Custom Highlights

  • Menata gaya rentang teks tanpa mengubah struktur DOM melalui CSS Custom Highlight API
  • Dengan pseudo-elemen ::highlight() dan ::target-text, dapat digunakan untuk hasil pencarian, highlight kode, pengeditan kolaboratif, dan lainnya

• Peningkatan Dialog dan Popover

  • Menambahkan closedby, popover="hint", dan pseudo-class :open pada atribut <dialog> dan popover
  • Fitur peningkatan UI overlay untuk meningkatkan aksesibilitas dan pengalaman pengguna

• Fetch Uploads & Ranges

  • Menambahkan streaming upload, peningkatan FormData, dan dukungan header Range ke API fetch()
  • Memungkinkan transfer data yang efisien untuk unggahan besar, unduhan parsial, dan sebagainya

• IndexedDB getAllRecords()

  • Menambahkan metode getAllRecords() ke IDBObjectStore dan IDBIndex
  • Meningkatkan performa dengan dukungan pengambilan batch dan pencarian urutan terbalik

• JSPI for Wasm

  • Menjembatani kesenjangan async/sync pada WebAssembly melalui JavaScript Promise Integration API
  • Memungkinkan aplikasi C/C++/Rust yang sudah ada untuk dipindahkan ke web dengan lebih mudah

• Media Pseudo-classes

  • Menyediakan 7 pseudo-class CSS yang dapat diterapkan berdasarkan status <audio> dan <video>
    • Contoh: :playing, :paused, :muted, dan lainnya
  • Safari sudah mendukungnya, dan proyek ini bertujuan memperluas dukungan ke browser lain

• Navigation API

  • API kontrol navigasi baru yang menggantikan kerumitan history.pushState() saat mengembangkan SPA
  • Lulus 92.3% pengujian di Interop 2025, dan pada 2026 ditambahkan opsi precommitHandler

• Scoped Custom Element Registries

  • Memungkinkan pembuatan CustomElementRegistry per-scope untuk menyelesaikan masalah benturan global
  • Safari 26.0 menjadi implementasi pertama, dan proyek ini menargetkan konsistensi lintas browser

• Scroll-driven Animations

  • Memungkinkan kontrol animasi hanya dengan CSS berdasarkan posisi scroll
  • Dukungan dimulai di Safari 26.0, dengan dorongan menuju standardisasi interaksi berbasis scroll

• Scroll Snap

  • Mengontrol perataan dan perilaku snap di dalam container scroll
  • Dilakukan perbaikan berbasis pengujian untuk mengatasi ketidaksesuaian akibat perubahan spesifikasi lama

• shape()

  • Memungkinkan definisi bentuk kompleks berbasis kurva pada clip-path dan shape-outside
  • Didukung sejak Safari 18.4, dengan tujuan memastikan konsistensi ekspresi kurva responsif

• View Transitions

  • Menyediakan efek animasi saat perpindahan halaman
  • Berangkat dari kompatibilitas 90.8% pada 2025, lalu diperluas pada 2026 hingga transisi lintas dokumen

• Web Compat

  • Kumpulan pengujian untuk menyelesaikan masalah kompatibilitas yang muncul di situs web nyata
    • Termasuk pemuatan modul ESM, timing event scroll/animasi, properti user-select, dan lainnya

• WebRTC

  • Standar untuk komunikasi audio, video, dan data real-time
  • Terus ditingkatkan dari tingkat kelulusan 91.6% pada 2025

• WebTransport

  • API komunikasi dua arah berbasis HTTP/3 dengan dukungan latensi rendah dan multi-stream
  • Menawarkan kontrol yang lebih rinci daripada WebSocket dan struktur yang lebih sederhana daripada WebRTC

• CSS Zoom

  • Menyesuaikan skala elemen dan konten serta berdampak langsung pada layout
  • Setelah distandardisasi dari properti nonstandar, peningkatan konsistensi berlanjut dari 2025

Riset dan tugas selanjutnya

• Pengujian aksesibilitas

  • Peningkatan infrastruktur pengujian terus dilakukan untuk memastikan konsistensi accessibility tree antar-browser

• JPEG XL

  • Format gambar generasi berikutnya yang mendukung animasi, transparansi, dan kompresi lossless
  • Dukungan dimulai di Safari 17.0, dengan kemungkinan masuk sebagai item pengujian resmi di masa depan

• Pengujian mobile

  • Peningkatan infrastruktur pengujian untuk fitur khusus mobile seperti perubahan viewport dinamis

• WebVTT

  • Verifikasi berkelanjutan untuk menyelesaikan ketidaksesuaian antar-browser pada standar subtitle dan caption

Menuju web yang lebih interoperabel

• Interop 2026 mencakup area inti seperti fleksibilitas CSS, transisi visual, komunikasi real-time, dan transfer data
• Mendorong penyelesaian masalah ketidaksesuaian lama seperti Scroll Snap, shape(), dan Web Compat
• Tim WebKit bekerja sama dengan tujuan perilaku yang konsisten di semua browser
• Hasilnya, proyek ini menyediakan fondasi platform web yang lebih andal bagi pengembang