پلیمر دروازه ای به سوی آینده شگفت انگیز اجزای وب است. ما می خواهیم مصرف و ساخت عناصر سفارشی را آسان کنیم. در سال گذشته، تیم به سختی بر روی مجموعه ای از پلی پرها برای مشخصات در حال تکامل کار کرده است. علاوه بر این، ما یک کتابخانه مناسب برای ساختن اجزای وب ایجاد کرده‌ایم. در نهایت، ما مجموعه‌ای از UI و عناصر ابزار را برای استفاده مجدد در برنامه‌های شما ایجاد می‌کنیم. در اجلاس کروم Dev Summit در سال 2013، من به بخش‌های مختلف پلیمر و فلسفه مانترا «همه چیز یک عنصر است» پرداختم.
اسلایدها : http://html5-demos.appspot.com/static/cds2013/index.html
"همه چیز یک عنصر است" (از <select> تا عناصر سفارشی)
اسلایدها : http://html5-demos.appspot.com/static/cds2013/index.html#6
ساخت صفحات وب در دهه 1990 محدود، اما قدرتمند بود. ما فقط چند عنصر در اختیار داشتیم. بخش قدرتمند؟... همه چیز اعلامی بود . ایجاد یک صفحه، اضافه کردن کنترل‌های فرم و ایجاد یک «برنامه» بدون نوشتن جاوا اسکریپت بسیار ساده بود.
عنصر <select> فروتن را انتخاب کنید. قابلیت‌های زیادی در این عنصر تعبیه شده است، به سادگی با اعلام آن:
- قابل تنظیم از طریق ویژگی های HTML
- کودکان (مثلاً
<option>) را با یک رابط کاربری پیش‌فرض ارائه می‌کند، اما از طریق ویژگی‌ها قابل تنظیم است. - در زمینه های دیگر مانند
<form>مفید است - دارای یک API DOM: ویژگی ها و روش ها
- هنگامی که اتفاقات جالبی رخ می دهد، حوادث را آتش می زند
Web Components ابزارهایی را برای بازگشت به این دوران اوج توسعه وب فراهم می کند. یکی که در آن می‌توانیم عناصر جدیدی ایجاد کنیم، یادآور <select> ، اما برای موارد استفاده در سال 2014 طراحی شده است. به عنوان مثال، اگر AJAX امروز اختراع می‌شد احتمالاً یک تگ HTML بود ( مثلا ):
<polymer-ajax url="http://gdata.youtube.com/feeds/api/videos/"
params='{"alt":"json"}'></polymer-ajax>
یا عناصر پاسخگو که داده به صفت queryMatches متصل می شوند:
<polymer-media-query query="max-width:640px" queryMatches="">
این دقیقاً همان رویکردی است که ما در پلیمر داریم. به جای ساختن برنامه های وب یکپارچه مبتنی بر جاوا اسکریپت، بیایید عناصر قابل استفاده مجدد ایجاد کنیم. با گذشت زمان، یک برنامه کامل از ترکیب عناصر کوچکتر با هم رشد می کند. هک، و کل برنامه می تواند یک عنصر باشد:
<my-app></my-app>
ساخت اجزای وب با سس مخصوص پلیمر
اسلایدها : http://html5-demos.appspot.com/static/cds2013/index.html#37
پلیمر دارای چندین ویژگی برای ساخت برنامه های کاربردی مبتنی بر اجزای وب است:
- ثبت عنصر اعلامی:
<polymer-element> - وراثت اعلامی:
<polymer-element extends="..."> - اتصال دوطرفه داده‌های اعلامی:
<input id="input" value=""> - کنترل‌کننده‌های رویداد اعلامی:
<button on-click="" - خواص منتشر شده:
xFoo.bar = 5<-><x-foo bar="5"> - مشاهده ویژگی:
barChanged: function() {...} - PointerEvents / PointerGestures به طور پیش فرض
اخلاقیات داستان این است که نوشتن عناصر پلیمری تماماً در مورد بیانی بودن است. هر چه کد کمتری بنویسید بهتر است ;)
اجزای وب: آینده توسعه وب
اسلایدها : http://html5-demos.appspot.com/static/cds2013/index.html#26
اگر استانداردهای پشت کامپوننت های وب را فریاد نزنم، نادیده گرفته می شوم. به هر حال، پلیمر بر اساس این APIهای بنیادی در حال تکامل است.
ما در آستانه زمان بسیار هیجان انگیزی در توسعه وب هستیم. برخلاف سایر ویژگی‌های جدیدی که به پلتفرم وب اضافه می‌شوند، APIهایی که مؤلفه‌های وب را تشکیل می‌دهند براق یا رو به روی کاربر نیستند. آنها صرفا برای بهره وری توسعه دهندگان هستند. هر یک از چهار API اصلی به تنهایی مفید هستند، اما با هم، چیزهای جادویی اتفاق می افتد!
- Shadow DOM - سبک و کپسوله سازی DOM
- عناصر سفارشی - عناصر جدید HTML را تعریف کنید. به آنها یک API با ویژگی ها و متدها بدهید.
- HTML Imports مدل توزیع بسته‌ای از CSS، JS و HTML است.
- الگوها - الگوی DOM مناسب برای تعریف تکه های بی اثر نشانه گذاری که بعداً حذف می شوند
اگر می خواهید در مورد اصول API ها بیشتر بدانید، webcomponents.org را بررسی کنید.