Template Blogger Google AMP

in this post, I discussed Google AMP and released the AMP version of the VioMagz blogger template.

Template Blogger Google AMP

Since its appearance has been a long time, I have never even once talked about Google AMP on this blog. The reason is because I am not very interested in technology to make web pages become super fast from Google.

About Google AMP

Google AMP atau Accelerated Mobile Pages merupakan proyek open source dari google untuk membantu publisher/webmaster membuat halaman web versi mobile menjadi super cepat secepat kilat.

Google's AMP Component

1. AMP HTML is plain HTML with some restrictions on the use of tags and there are also some custom tags specifically for AMP pages
2. AMP JS is a JavaScript library to ensure AMP pages can function properly and are always fast when accessed.
3. Google AMP Cache adalah cache yang disediakan untuk menyimpan halaman-halaman AMP agar dapat diakses secepat kilat.

WordPress users can activate the AMP page by installing the official AMP plugin, while blogger / blogspot users can use a custom AMP template (for example the VioMagz AMP Template).

Execute all AMP JavaScript asynchronously

JavaScript is powerful, it can modify just about every aspect of the page, but it can also block DOM construction and delay page rendering (see also Adding interactivity with JavaScript). To keep JavaScript from delaying page rendering, AMP allows only asynchronous JavaScript.

AMP pages can’t include any author-written JavaScript. Instead of using JavaScript, interactive page features are handled in custom AMP elements. The custom AMP elements may have JavaScript under the hood, but they’re carefully designed to make sure they don’t cause performance degradation.

Excellence

1. The page loading becomes super fast
2. Ease server load
3. Increase ranking on google

Deficiency

1. The original AMP page did not appear on Google
2. Implementation has not been so easy
3. Limited use of elements

Template Blogger AMP VioMagz

Features and Excellence of the VioMagz AMP template.

1. AMP Valid page in the mobile version URL https://amp.viomagz.com;
2. Non-AMP page in the desktop version URL https://amp.viomagz.com/ atau https://amp.viomagz.com;
3. Structured and neat design;
4. etc.

Example Display AMP version

Template AMP Version

Load pages in an instant

The new Preconnect API is used heavily to ensure HTTP requests are as fast as possible when they are made. With this, a page can be rendered before the user explicitly states they’d like to navigate to it; the page might already be available by the time the user actually selects it, leading to instant loading.

While prerendering can be applied to all web content, it can also use up a lot of bandwidth and CPU. AMP is optimized to reduce both of these factors. Prerendering only downloads resources above the fold and prerendering doesn’t render things that might be expensive in terms of CPU.

When AMP documents get prerendered for instant loading, only resources above the fold are actually downloaded. When AMP documents get prerendered for instant loading, resources that might use a lot of CPU (like third-party iframes) do not get downloaded.