Mendukung perangkat foldable dengan Viewport Segments API

Alexis Menard

Dipublikasikan: 9 Juni 2025

Viewport Segments API menawarkan akses ke posisi dan dimensi wilayah area tampilan yang terpisah secara logis dengan JavaScript atau CSS, dan tersedia mulai dari Chrome 138.

Segmen area tampilan dibuat saat area tampilan dibagi oleh satu atau beberapa fitur hardware—seperti lipatan atau engsel di antara layar terpisah—yang berfungsi sebagai pembagi.

Segmen adalah area viewport yang dapat Anda perlakukan sebagai area yang berbeda secara logis saat mengembangkan situs atau aplikasi. API menarik ini memungkinkan Anda membuat atau mengoptimalkan antarmuka secara khusus untuk perangkat foldable. Misalnya, membuat pengalaman pengguna panel ganda, atau hanya menghindari tata letak konten di seluruh lipatan.

Dari uji coba origin yang kami jalankan tahun lalu, ada dua perubahan:

• Atribut JavaScript segments kini berada di objek window.viewport yang baru ditambahkan, bukan window.visualViewport.
• Perilaku properti segments saat perangkat tidak dilipat telah disesuaikan dengan perilaku CSS fitur ini. Saat perangkat tidak dilipat (atau tidak dapat dilipat), properti segments akan berisi array dari satu segmen yang merepresentasikan seluruh ukuran area tampilan.

Lihat demo perangkat foldable untuk melihat cara kerja API.