2019-05-01+net

(Brent) #1

Resources


PWA EBOOK
This ebook, which was only
recently published in partnership
with Awwwards, provides the
most comprehensive resources
on how to start going about
building a PWA (https://www.
awwwards.com/PWA-ebook).

LIBRARIES AND MODULES
Workbox is also a great online
guide that has useful step-by-
step codelabs and an abundance
of best practices (https://
developers.google.com/web/
tools/workbox/).

STEP-BY-STEP GUIDES
To integrate AMP with PWA
for maximum results there
are some codelabs that are
relatively easy to follow here
(https://codelabs.developers.
google.com/codelabs/amp-pwa-
workbox/#0).

OTHER USEFUL RESOURCES
Lighthouse is an open-source,
automated tool for improving
the quality of your web apps.
It is already integrated into
the Chrome DevTools Audits
panel but if you prefer, it can
also be run from the command
line, as a Node module (https://
http://www.npmjs.com/package/
lighthouse), or by installing the
Chrome Extension (https://netm.
ag/2tEzAJA).

source tech solution called accelerated
mobile pages (AMP)? Originally started
as a project for developers to improve
performance for publishers, AMP has
progressed in its mission to “make
the web better for all”. There has been
success even for ecommerce businesses
integrating AMP logic, largely due to a
selection of pre-built and easy-to-use
components that enable more dynamic
and interactive experiences. AMP’s
framework helps you to be fast from the
beginning – and stay that way.
AMP puts content in front of users
quickly – loading 85 per cent faster than
standard mobile pages – and ensures
that you don’t break this code or sacrifice
on performance as long as your page
remains ‘AMP valid’. You can develop a
valid AMP page following the framework
built with AMP HTML, AMP JS and AMP
Cache (https://www.ampproject.org/learn/
overview/) and then using AMP Validator
to ensure it passes validation (https://
validator.ampproject.org/).


AMP delivers blazingly fast, smooth
landing pages. In terms of complexity,
the framework itself is quite simple
to code with most developers taking
less than a week to fully implement it
(https://www.ampproject.org/). If you are
interested in finding out more about AMP
components and learning from code labs,
there are some great tools and resources
that are readily available on the Google
Developers site on how to build AMP
(https://developers.google.com/google-ads/
amp/landing-pages).
It’s always important to test AMP for
impact. We recommend that you A/B
test AMP with respect to what effect it
has on your mobile performance with a
50/50 split test on traffic. This way you
can safely see the results that AMP has
for yourselves (https://support.google.com/
google-ads/answer/9124739).
AMP is best when served as an entry
point to your users, given that its USP
is near-instant delivery (0.8 seconds
average). This makes it the perfect

To p Audit your site and set concrete performance goals. Pay
close attention to the speed index and first contentful paint
Above If we look at the web, the amount of JavaScript and
image files shipped is steadily increasing
Right Requirements of the modern web are that it is light,
fast, smooth and highly engaging

Unite AMP and PWAs

Free download pdf