, ,

Bagaimana Cara mempercepat loading blogger AMP maupun NON AMP.

Langkah awal mempercepat loading AMP Blogger maupun Blogger dengan template biasa (mengandung javascript).

Link dns-prefetch metatag merupakan metatags untuk mempercepat
loading external source. Dengan kata lain defer loading external sources.

Kali ini saya akan share bagaimana cara mempercepat lagi loading
AMP Blogger yang biasanya mengandung banyak
<amp-iframe>.

Ga pake lama, cekidot tutorialnya:

  1. Buka dashboard Blogger.
  2. Klik tab Layout --> klik Edit HTML.
  3. Kemudian, taruh kode dibawah ini dibawah <head> atau diatas </head>.
<link rel="dns-prefetch" href="https://cdn.ampproject.org"/>

Bila anda juga menggunakan fonts dari google cdn maka juga tambahkan:

<link rel="dns-prefetch" href="https://fonts.googleapis.com"/>

Dan bila anda juga menggunakan Fontawesome.css dari
https://netdna.bootstrapcdn.com/font-awesome/[VERSION]/css/font-awesome.css.

Maka juga tambahakan kode dibawah ini:

<link rel="dns-prefetch" href="https://netdna.boostrapcdn.com"/>

Bila digabungkan akan seperti ini:

<link rel="dns-prefetch" href="https://cdn.ampproject.org"/>
<link rel="dns-prefetch" href="https://fonts.googleapis.com"/>
<link rel="dns-prefetch" href="https://netdna.boostrapcdn.com"/>

Untuk HTML5 Markup seperti ini:

<link href="https://cdn.ampproject.org" rel="dns-prefetch" />
<link href="https://fonts.googleapis.com" rel="dns-prefetch" />
<link href="https://netdna.boostrapcdn.com" rel="dns-prefetch" />

Bedanya HTML biasa dengan HTML5 cuma href yang di
dahulukan.

Untuk kalian yang menggunakan template biasa

kalian juga bisa menerapkan teknik diatas cuman ganti saja href source nya dengan source external anda. Malah lebih joss bila kalian juga menerapkan defer load javascript. Baca
disini: Bagaimana cara defer javascript.

Selesai. Semoga tulisan saya ini membantu kalian. :) . Jangan lupa
share yah...