A special Google project called AMP is designed to enhance the mobile browsing experience and like any other project, it’s important to read the fine print.
Suppose for a moment, hypothetically of course, that you are required to decide between two options presented to you: be lying down for two days in a dirt ditch, without any food or water, under a pile of building debris or to try and browse the mobile device at an incredibly slow website. Which option would you choose? The common assumption is that most people prefer to spend their time surfing very slowly using their mobile device. However, the most important message to be learned from this story is that in many cases in life, what matters is not the decision, but the very deliberation.
AMP Project – Google Takes matters into its own hands
Around February 2016, Google began an experimental project with a good goal: to improve the load time of mobile sites. why? Because more and more people are using mobile devices for browsing websites as an integral part of their daily routine. And why else? Because today’s mobile devices are not yet equipped with processors and memory components, which can allow us a smooth and pleasant browsing experience.
We all know this unpleasant feeling when the process of loading a website on a mobile device becomes very slow and cumbersome. From time to time, we can see while some of the page loads at a horrendous pace, another image suddenly appears on the side of the page and the overall layout of the page dependes on the elements we have already loaded on the screen.
AMP Project – Pros and Cons
The key benefit of creating AMP pages for the site is clear: loading time is significantly shorter, which can help publishers significantly reduce the landing page abandonment rate, and create greater user involvement
However, using AMP on the site has quite a few drawbacks:
First, technical knowledge and in-depth understanding of how websites are managed to optimize AMP on the site is required. An average website manager does not usually know concepts such as html, css, JavaScript, rendering, synchronous and asynchronous readings, image responsiveness, inline functions and many other concepts. If the website manager needs to invest time in deep learning of the AMP management configuration, it will waste a lot of time. The alternative, of course, is to approach a professional, a possibility that in many cases will be expensive and uncertain it will pay off over time.
Second, the experience of using websites that offer AMP is uneven: While landing on the first page of the site is a AMP landing page and it takes less than a second to provide a great experience for the user, we will not settle for landing page that is that does not appear to be professionally designed (we will immediately expand on This), and we want to send the user to more pages on the site. In this case, the additional pages on the site will again require the traditional loading processes, with all the disadvantages, including the horrifying slowness.
Additionally, since at AMP we give up some of the dynamic and advanced design capability, the pages look, sometimes, sloppy, and is not according to the design standard of the other site pages.
Diving in – the technical aspects of AMP
We understood the point. The AMP project offers, under certain restrictions, a fast and smooth surfing experience. But how exactly? What is the magic secret of AMP? How does Google and its partnership, technically, manage to make such a change in site load times on mobile devices? Well, here are some aspects to which the AMP project relates:
Asynchronous execution of Javascript functions
The use of javascript on modern websites has become an accepted standard in recent years. Javascript allows to expand the ability of the HTML language (the language in which websites are built), and allows running of different widgets. Javascript is running on the client side, which is the browser installed on the user’s device. During the entire run of javascript programs, calls are made to functions that perform sub-tasks from the overall task that the program should support. Generally, there are two types of calls to javascript functions: synchronous calls and asynchronous calls. Synchronous calls are serial calls, during which the page loads on the browser until a reply is returned from the active function. Asynchronous calls do not wait to the return of such an answer, and can run simultaneously.
How exactly is this related to AMP?
Well, one of the requirements of the AMP project is that different functions can only run in an asynchronous configuration. In this work configuration, the functions can run concurrently and significantly ease site load times. The big disadvantage, of course, is that we lack the capabilities of synchronous functions, such as receiving input from the user.
Set fixed sizes for images
When we, as users, use a responsive site, we expect the site to adapt to any size and screen configuration. We can zoom in on the site view, expand it, turn it from longitudinal rectangle to transverse rectangle and affect how different elements of the site are presented to us. This is why, usually, when loading responsive sites, the browser is required to make decisions and calculate real-time image usage and resolution. These decisions, as mentioned, are saved from the browser in the AMP project, in part because the desired sizes for the various images are pre-defined.
Restrictions on third-party scripts
The AMP project allows third party functions to be run only on iframes. Iframes are actually frames in which you can manage HTML code or, in other words, a web page within a web page. The result of this work configuration is to enable parallel loading of all functions on the page.
Using inline css
If you’ve come this far, you probably understand that as part of the realization concept of websites, the on-screen object management configuration is separated from the management configuration of their design. Anyone who has ever written a few lines of html knows that in order to conveniently and professionally design web pages, we make use of unique css files, containing modern design classes, which we write or import. This separation, between the page-building logic and its design, allows for very easy and fast website development.
However, it doesn’t really have to go that way.
Entire websites can be written in one html file, and the css commands designed for the, which is within the html file itself. In practice, the technical implication of this implementation configuration is that one https read can be sufficient to load the entire page.
In fact, AMP requires us to use css functions in inline configuration. In the same breath, as far as design is concerned, AMP also deals with reducing the time it takes to load heavy fonts. This is how a huge saving on page load times is achieved.
Graphic rendering of animations
Traditionally, various animations on websites have been managed through layer management, presentation, and concealment methods. The AMP project changes this configuration a bit, and requires animation to be implemented in the CSS files. This configuration, in fact, transfers the complex graphics processing of the animations from the browser’s responsibility to the device’s video card responsibilities.
Pre-loading pages
One of the surprising capabilities that the AMP project brings with it is the predictability of the following pages that the client is going to request. How does AMP do this? Perhaps through tracking user behavior, such as moving your mouse over menu titles, a familiar, pre-recorded track of page order and other methods that may be used. Pre-loading asynchronous pages and their correct prioritization can save a client’s future wait.
Plug-ins that will make your WordPress site supports AMP
AMP for WP – Accelerated Mobile Pages
AMP WP – Google AMP For WordPress
In conclusion
The AMP project is an ambitious project with good intentions, but there are quite a few restrictions. Days will tell if this application was successful or not, anyway, even if you decided not to make an effort to install AMP on your site, so it is important to make sure that your site’s loading speed is good, here is a guide to accelerating WordPress sites beyond AMP.
