Masukan Script JS di Website atau Blog AMP
Dengan amp-script, Website berbasis AMP memungkinkan menggunakan JavaScript dari pihak ketiga seperti React Component
Kabar gembira bagi anda developer website berbasis AMP HTML. AMP Project sebagai pengembang AMP HTML baru-baru ini meresmikan komponen AMP terbaru yang diumumkan langsung via Twitter @amphtml.
AMP Project mengumumkan bahwa, komponen
<amp-script> akan segera bisa dipakai dan saat ini bisa digunakan dalam mode experimental. Apa fungsi amp-script?
Seperti yang kita tahu sebelumnya, sebuah dokumen AMP akan mengalami error validasi apabila kila memasang sebuah JavaScript pihak ketiga di dalam komponen website AMP.
amp-script', custom JavaScript pihak ketiga dapat digunakan di dalam halaman website berbasis AMP. Contoh, jika anda ingin menggunakan komponen React, anda bisa menggunakan <amp-script> untuk memanggilnya.
Tentu saja ini akan sangat berguna bagi anda yang ingin membuat website AMP dengan JavaScript. JavaScript bukan hanya salah satu bahasa tertua untuk web, itu hampir salah satu yang paling cepat berkembang. Jadi sekarang AMP akan mendukungnya, pengembang dapat lebih banyak mengadopsi AMP pada aplikasi web dan situs web mereka.
Cara Menggunakan amp-script
Saat ini,
amp-script masih dalam tahap experimental. (Baca: AMP Experimental). Jadi belum dapat digunakan dalam production.
Namun dalam halaman resmi amp.dev dijelaskan secara sederhana penggunaan
amp-script, contoh seperti di bawah ini.
<!-- hello-world.html -->
<amp-script layout="container" src="https://example.com/hello-world.js">
<button id="hello">Insert Hello World!</button>
</amp-script>
// hello-world.js
const button = document.getElementById('hello');
button.addEventListener('click', () => {
const el = document.createElement('h1');
el.textContent = 'Hello World!';
// `document.body` is effectively the <amp-script> element.
document.body.appendChild(el);
});