Polymer dan Komponen Web adalah topik yang sangat panas akhir-akhir ini, dan karena ekosistem ini berkembang pesat, developer sering kali kesulitan untuk mengikuti semua perubahan terbaru.
Dalam ceramahnya di Chrome Dev Summit, Matt McNulty, manajer teknik untuk tim Polymer, menjelaskan apa itu Polymer, dan juga menguraikan peta jalan untuk Polymer 1.0.
Apa itu Polimer?
Pertama, apa itu Polymer?
Polymer adalah library yang membantu Anda mem-build elemen dan aplikasi dari komponen web. Komponen Web adalah rangkaian standar baru canggih yang memungkinkan developer memperluas kosakata HTML dengan elemen khusus mereka sendiri.
Karena Komponen Web dirancang sebagai primitif baru untuk browser, artinya Komponen Web sangat canggih tetapi tingkatnya sangat rendah dan memerlukan sedikit kode untuk digunakan.
Polimer mempermudah penggunaan Komponen Web dengan menerapkan "sugaring" pada sintaksis. Ini mengurangi jumlah kode boilerplate yang perlu Anda tulis, dan menambahkan gaya deklaratif sehingga membuat Komponen Web semudah menulis HTML.
Eksperimen Polimer
Polymer dimulai sebagai eksperimen untuk melihat apakah kami dapat mem-polyfill standar Komponen Web dan mendapatkan masukan dari developer sebelum teknologi ini dikirim di semua browser. Seiring dengan semakin banyaknya developer yang mulai menggunakan Polymer, Polymer berubah dari hanya polyfill, menjadi library aktual yang penuh dengan fitur produktivitas (data binding, pengamat perubahan atribut, penemuan node otomatis, dll). Namun, semua eksperimen memiliki hasil, jadi bagaimana kami melakukannya?
Meskipun banyak developer mengatakan bahwa mereka menyukai keekspresifan dan produktivitas saat bekerja dengan Komponen Web di Polymer, mereka juga menyatakan kekhawatiran seputar performa dan kompleksitas secara keseluruhan.
Hal ini menyoroti ketegangan alami yang dimiliki Polymer selama ini: menjadi eksperimen untuk memajukan platform web, sekaligus membuat sesuatu yang layak produksi dan dapat diandalkan oleh developer.
Perubahan Mendatang
Tim Polymer telah meninjau dengan cermat setiap fitur library untuk menyusun versi yang lebih ramping dan siap produksi, yang dapat dipercaya oleh developer.
Lapisan
Polimer telah difaktorkan ulang menjadi serangkaian lapisan. Fitur intinya cepat dan ramping, sedangkan fitur yang lebih canggih akan disertakan. Untuk sebagian besar kasus penggunaan, fitur inti harus mencakup kebutuhan developer.
Binding Data yang Disederhanakan
Sistem data binding Polymer juga telah dioptimalkan secara signifikan untuk performa. Dengan mengikuti pendekatan berlapis, binding dua arah kini diaktifkan, dengan default-nya adalah binding satu arah. Selain itu, jenis properti yang dipublikasikan telah dibuat eksplisit dan perubahan properti sekarang mengaktifkan peristiwa untuk membantu elemen dari library yang berbeda agar lebih mudah dikomunikasikan.
DOM Bayangan Leaner
Polyfill Shadow DOM adalah prestasi rekayasa yang luar biasa. Versi ini dirancang agar komprehensif dan sesuai spesifikasi, yang penting untuk menguji primitif platform secara menyeluruh, tetapi sayangnya menimbulkan sejumlah bottleneck performa untuk fitur yang tidak digunakan Polymer.
Rilis Polymer berikutnya akan mengambil pendekatan berbeda, dengan menggunakan lapisan gaya shim yang hanya mem-polyfill apa yang dibutuhkan Polymer.
Polymer yang ada akan aktif untuk komponen web non-Polymer generik.
Memindahkan ke webcomponents.org
Berbicara tentang polyfill, mereka juga mendapatkan rumah baru. Saat ini, banyak pengembang bingung tentang hubungan antara Polymer dan Komponen Web. Beberapa orang berpikir bahwa Anda harus menggunakan semua Polymer untuk menggunakan Komponen Web, padahal sebenarnya, Anda hanya memerlukan polyfill.
Untuk lebih memperjelas perbedaan ini, polyfill dipindahkan ke webcomponents.org dan sekarang diganti namanya menjadi webcomponents.js
.
Langkah ini dirancang untuk membantu penulis library lain memanfaatkan polyfill tanpa kebingungan. Tim Polymer akan terus berkontribusi pada polyfill, tetapi harapannya adalah bahwa perubahan ini akan membuat mereka menjadi lebih banyak sumber daya bersama bagi komunitas.
Hasil
Jadi, apa hasil dari semua perubahan ini?
Kecepatan
Di Chrome, Polymer kini 5x lebih cepat, dan di Safari peningkatan kecepatan 8x lipat.
Ukuran File
Ukuran file juga telah diperkecil 87%, dari 123 KB menjadi 15 KB (6 KB gzip).
Roadmap
Akan ada beberapa perubahan yang dapat menyebabkan gangguan API dalam rilis berikutnya, yang ditandai dengan nomor versi baru (0.8), tetapi tim ingin memperjelas bahwa ini bukan penulisan ulang. Memindahkan proyek Anda saat ini dari Polymer 0,5 ke 0,8 seharusnya cukup sepele.
Tim Polymer juga telah menguraikan roadmap untuk memberi developer kejelasan lebih lanjut seputar rilis mendatang.
Pratinjau 0.8 sekarang tersedia sebagai cabang di GitHub (meskipun masih sangat aktif dikembangkan dan kurang dalam dokumentasi). Beta 0,9 resmi direncanakan untuk Q1 2015, dengan 1,0 terjadi kira-kira di Q2.
Eksperimen Selesai
Dengan semua perubahan terbaru di Polymer, tim di baliknya meletakkan dasar untuk Komponen Web menjadi bagian integral dari setiap stack developer. Jika Anda baru mengenal Komponen Web, sekarang adalah waktu yang tepat untuk melihat dan membiasakan diri dengan teknologi transformatif ini. Jika Anda sudah menggunakan komponen (dan Polymer), masa depan akan terlihat cerah. Pantau Blog Polymer untuk mendapatkan semua info terbaru, dan daftar ke milis Polymer untuk mengajukan pertanyaan atau memberikan komentar. Selamat mencoba!