Ringkasan
Merry Pixmas: Keseruan Natal dengan Transformasi CSS 3D.
Apa yang kami suka?
Demo bertema Natal yang menarik dan berfungsi dengan baik di desktop dan perangkat seluler. Aplikasi ini bahkan dilengkapi dengan dukungan warna tema baru, dan manifes web untuk pengalaman layar utama yang meluncurkan layar penuh.
Tips pro: Goyangkan ponsel untuk menjadikannya salju!
Kemungkinan Peningkatan
Meskipun saya menyadari ini adalah demo, beberapa header cache yang ditentukan pada aset dan JavaScript yang tidak memblokir render dapat sedikit mengurangi waktu pemuatan yang dirasakan.
Tanya Jawab dengan Jim Savage
Mengapa web?
Di Tokyo, kami telah lama mendukung web responsif dan seluler, bukan native. Pixmas adalah hasil dari eksperimen HTML5 & CSS3 selama periode nonaktif di antara project. Kami selalu mencoba hal-hal baru untuk menjaga pengetahuan kami tetap terkini; jadi tentu saja, bagi tim developer front-end kami, penelitian apa pun akan berfokus pada web, bukan platform native.
Seiring berkembangnya browser, kita melihat lebih banyak fungsi seperti native; fungsi yang hanya tersedia melalui pengembangan native seperti geolokasi, akses kamera, penyimpanan database lokal, dll., yang semuanya berkontribusi pada pengalaman seperti native secara keseluruhan bagi pengguna, tetapi dengan manfaat pengembangan lintas platform dan iterasi yang cepat. Tentu saja pengembangan native masih memiliki keuntungannya, dan saat menangani project baru, banyak pertimbangan dilakukan untuk opsi web & native. Mungkin terdengar jelas, tetapi bagi klien, penting bagi kami untuk merekomendasikan platform terbaik untuk pekerjaan itu, daripada menyertakan setiap project ke dalam kode yang kami inginkan.
Apa yang bekerja dengan sangat baik selama pengembangan?
Menurut saya, dengan Pixmas, fokus utamanya adalah seputar Transformasi 3D dan seberapa jauh kita bisa benar-benar mendorong CSS, sehingga gaya ilustrasi piksel bekerja dengan sangat baik di browser, dan karena setiap pengembang {i>front-end<i} akan memberi tahu Anda bahwa perilaku alami browser cocok untuk persegi! Jadi, mengandalkan perhitungan gaya dan 3D pada masalah berbasis persegi bekerja dengan sangat baik. Membuat kubus dengan transformasi 3D & HTML jauh lebih mudah daripada bentuk primitif lainnya. Namun, interaksi dan animasi memerlukan sedikit coba-coba.
Yang paling mengejutkan kami adalah kelancaran dan performa browser 3D pada platform seluler, terutama di perangkat Android yang kurang dikenal.
Jika Anda bisa memiliki API untuk meningkatkan kualitas aplikasi Anda, apa itu?
Jika kita menulis Pixmas lagi, kita mungkin akan menggunakan API berbasis WebGL. Meskipun menyenangkan memanipulasi elemen DOM HTML dalam 3D melalui CSS, kemampuan sebenarnya untuk 3D berbasis web adalah teknologi akselerasi perangkat keras khusus seperti WebGL. CSS 3D tidak masalah untuk efek dan transisi halaman web dasar, tetapi performa browser benar-benar dibatasi saat membuat kode Pixmas.
Google memiliki beberapa project WebGL yang keren di Chrome Experiments.