Wednesday 9 March 2016

Google Is About to Make Mobile Browsing Up to 85% Faster

Sometimes, browsing the Web on a smartphone can be slower than a snail riding a particularly lazy turtle. Not long ago, on February 24th, Google took its first step towards speeding up the Web browsing experience on mobile devices, and this new initiative is called Accelerated Mobile Pages (AMP).
But what does that mean? How does it work? Will it really result in 85% faster Web browsing for you? Or is it nothing more than overhyped and overblown marketing nonsense? We’ll break it down for you and even show you how you can test it out for yourself.

In a Nutshell, What Is AMP?

First announced back in October 2015, AMP is an open-source HTML framework developed by Google — in tandem with a few other companies — that’s meant to help developers create lightweight pages that run quickly on mobile devices. It’s ordinary HTML but with a few restrictions and a few extra features.
According to Google’s tests, AMP pages can load up to 85 percent faster than non-AMP pages on a 3G mobile connection. Here’s Google’s amusing and informative introduction to the whole concept:

What Good Is AMP for You?

As Google’s video shows, a slow website frustrates readers and publishers alike. When you open a site and it doesn’t load, the longer you have to wait, the more annoyed you become. If you wait too long, you’re likely to give up and move on.
Worst case scenario, you waste a chunk of your day waiting for content you didn’t even get to enjoy. Meanwhile, publishers didn’t get your eyeballs on their content or on the accompanying advertisements that help pay for the free content they tried to serve you. It’s a no-win situation for everyone involved.
If you were to block the ads to speed up the website’s loading, then you might get the content, but the publisher won’t get paid for it. In turn, publishers have less money to create content — so even if you like what they write and produce, they won’t be able to afford making more. Also a no-win situation.
Google’s goal with AMP is to turn those no-win situations into win-win situations. Ideally, advertisements and flashy interactive features won’t slow down your Web browsing experience, which should make them more palatable. And if the more ads you see, the more publishers can afford to keep creating free content for you to enjoy.

How Does AMP Work?

One way AMP will speed up mobile browsing is in how Google caches pages. Not only does AMP result in faster webpages, but publishers can also opt to have Google cache their content on Google’s servers. This is different from normal Google Search, where you click on a link to go directly to another website.
If you open up an AMP link from Google Search on a mobile device, you won’t be directed to the publisher’s website. You’ll stay on Google. This is faster for you because Google is ace at hosting and serving content, whereas most websites are hosted on slow servers. Plus, websites can go down for all kinds of reasons while Google rarely does.
In short, Google is a reliable host that has a distributed network of more than 1.8 million servers, spread over at least 12 data centers across North America, Europe, and Asia. For any article you click on, Google can probably serve you a cached copy of it faster than the publisher can.
Another way we can expect pages on mobile to be faster is thanks to the restrictions AMP places on HTML. For Accelerated Mobile Pages, HTML is optimized to restrict website developers from using features that slow websites down. So what can’t AMP developers use?
AMP HTML doesn’t allow forms, and it doesn’t allow JavaScript except for one special Google-provided JavaScript library that does work with AMP. It also forbidscertain CSS styles related to animations, which can severely slow down performance on mobile devices.
Other than that, websites can still be fully styled with all other CSS styles, which allows sites to showcase rich media, such as photos and videos, as they’ve always done up to this point.
Some HTML elements are changed, however, like the HTML image tag which is changed from <img> to <amp-img>. This is important because AMP images are loaded after everything else, which means viewers don’t have to wait for loading images before they can start reading the main content.

Is AMP Worth the Hype?

Some people are concerned that AMP will end up being a lot of work that results in little to no gain. Others blame website owners for slow websites and long loading times rather than the HTML itself.
Maybe those criticisms are legitimate, but I tried the following AMP demo and found that it does load lightning fast, so I’m inclined to think it will be worthwhile for some publishers at the very least. But don’t take my word for it. You can try the demo for yourself! All you need is a mobile device.

AMP Demo Instructions

Go to http://g.co/ampdemo on a mobile device and search for anything you like (but to really feel the effects, try searching for popular media or something in the news). I personally tried it with a search for “Game of Thrones”.
ampdemo-1
Scroll until you find a link (probably in a carousel module above the ordinary blue links) tagged with “AMP” and a lightning bolt icon. Click on it. Then, you’ll also be able to swipe left to instantly access more AMP articles from the search results that Google cached.
amp-html-google-cache
What you’re seeing in the GIF above are AMP HTML articles, which are basic and not too flashy. Also, take a look at the URL: it’s www.google.ca for every article. Since I selected an AMP HTML link from Google’s search, these are cached copies hosted on Google’s servers.

Does AMP Have Any Flaws?

One of the main drawbacks of AMP is that it limits JavaScript usage. Websites needJavaScript for all kinds of stuff, such as tracking readers and delivering interactive experiences, which they won’t be able to do as easily within the AMP HTML framework.
If you’re a privacy-concerned user and prefer that websites don’t track your behavior while your browse, then you might even see AMP’s limitation ofJavaScript as a welcomed feature.
But if you’re a Web developer or designer and you value the information you get from things like analytics tracking, then AMP HTML will make your job harder.
It’s also going to take time for the teams working on AMP to integrate features like image carousels, maps, social plug-ins, data visualizations, and videos. It might be a while before sites that make heavy use of these features will be able to take advantage of AMP, which will slow down AMP adoption rates.

Why AMP Truly Matters

AMP HTML is about to make the web faster on your phone! This is a good thing because we all know that slow Internet can be a wee bit more frustrating than no Internet at all.
Speeding up mobile sites also removes an oft-cited reason for users to block ads, which is good for content creators. Google’s search rankings also take into account page loading speeds, so websites that use AMP could see a boost in their rankings on search engines.
If you’re learning HTML and CSS for web development already, you can learn AMP on the AMP Project website. If you want to speed up your website but aren’t ready to convert to AMP, or just want it to be faster in general, check out these online tools to make your website faster.
Over 30 publishers — including sites like Facebook, the New York Times, Buzzfeed, the BBC, and the Huffington Post — have already integrated AMP HTML and more are expected to follow in the months to come. Have you noticed any differences? Consider switching to the fastest mobile browser for even faster speeds.
Have you noticed mobile websites loading quicker than usual lately? Are there any publishers you find still notoriously slow that could use a change?

Tricktune

Author & Editor

I am an allround web developer. I am a senior programmer with good knowledge of front-end techniques. I love structure and order and I also stand for quality. I love spending time on fixing little details and optimizing web apps. Also I like working in a team.

0 comments:

Post a Comment

Back to Top