Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Disable preloading runtime script/style by default #1248

Merged
merged 6 commits into from
Jun 30, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/optimizer/lib/DomTransformer.js
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,7 @@ const TRANSFORMATIONS_PAIRED_AMP = [
// Removes the boilerplate
// needs to run after ServerSideRendering
'AmpBoilerplateTransformer',
// Needs to come after AmpBoilerplateTransformer.
'RewriteAmpUrls',
// Adds amp-onerror to disable boilerplate early
// needs to run after BoilerplateTransformer and rewrite AMP URLs
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,13 @@
*/
'use strict';

const {appendChild, createElement, firstChildByTag, insertText} = require('../NodeUtils');
const {
appendChild,
createElement,
hasAttribute,
firstChildByTag,
insertText,
} = require('../NodeUtils');

/**
* Error handler script to be added to the document's <head> for AMP pages not using ES modules.
Expand Down Expand Up @@ -48,7 +54,7 @@ class AmpBoilerplateErrorHandler {
return;
}

if (html.attribs['i-amphtml-no-boilerplate'] !== undefined) {
if (hasAttribute(html, 'i-amphtml-no-boilerplate')) {
// Boilerplate was removed, so no need for the amp-onerror handler
return;
}
Expand Down
25 changes: 19 additions & 6 deletions packages/optimizer/lib/transformers/RewriteAmpUrls.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,14 @@
*/
'use strict';

const {createElement, firstChildByTag, insertAfter, insertBefore, remove} = require('../NodeUtils');
const {
createElement,
hasAttribute,
firstChildByTag,
insertAfter,
insertBefore,
remove,
} = require('../NodeUtils');
const {AMP_CACHE_HOST} = require('../AmpConstants.js');
const {findMetaViewport} = require('../HtmlDomHelper');
const {calculateHost} = require('../RuntimeHostHelper');
Expand Down Expand Up @@ -73,14 +80,18 @@ class RewriteAmpUrls {
let referenceNode = findMetaViewport(head);
const esm = this.esmModulesEnabled || params.esmModulesEnabled;
params.esmModulesEnabled = esm;
const preloadEnabled = !hasAttribute(html, 'i-amphtml-no-boilerplate');
const preloads = [];

while (node) {
if (node.tagName === 'script' && this._usesAmpCacheUrl(node.attribs.src)) {
node.attribs.src = this._replaceUrl(node.attribs.src, host);
if (esm) {
preloads.push(this._addEsm(node));
} else {
const preload = this._addEsm(node, preloadEnabled);
if (preloadEnabled && preload) {
preloads.push(preload);
}
} else if (preloadEnabled) {
preloads.push(this._createPreload(node.attribs.src, 'script'));
}
} else if (
Expand All @@ -89,7 +100,9 @@ class RewriteAmpUrls {
this._usesAmpCacheUrl(node.attribs.href)
) {
node.attribs.href = this._replaceUrl(node.attribs.href, host);
preloads.push(this._createPreload(node.attribs.href, 'style'));
if (preloadEnabled) {
preloads.push(this._createPreload(node.attribs.href, 'style'));
}
} else if (
node.tagName === 'link' &&
node.attribs.rel === 'preload' &&
Expand Down Expand Up @@ -137,10 +150,10 @@ class RewriteAmpUrls {
return host + url.substring(AMP_CACHE_HOST.length);
}

_addEsm(scriptNode) {
_addEsm(scriptNode, preloadEnabled) {
let result = null;
const esmScriptUrl = scriptNode.attribs.src.replace(/\.js$/, '.mjs');
if (this._shouldPreload(scriptNode.attribs.src)) {
if (preloadEnabled && this._shouldPreload(scriptNode.attribs.src)) {
const preload = createElement('link', {
as: 'script',
crossorigin: 'anonymous',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html amp i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta data-auto charset="utf-8">
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async src="https://cdn.ampproject.org/v0/amp-video-0.1.mjs" custom-element="amp-video" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async src="https://cdn.ampproject.org/v0/amp-video-0.1.mjs" custom-element="amp-video" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<link data-auto rel="canonical" href=".">
</head>
<body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html amp i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta data-auto charset="utf-8">
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/lts/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/lts/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0.js" crossorigin="anonymous"></script><script async src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.mjs" custom-element="amp-video" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/lts/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0.js" crossorigin="anonymous"></script><script async src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.mjs" custom-element="amp-video" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<link data-auto rel="canonical" href=".">
</head>
<body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html ⚡ i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://cdn.ampproject.org/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<meta name="viewport" content="width=device-width,minimum-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://cdn.ampproject.org/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<link rel="canonical" href="self.html"><style amp-custom>h1 { margin: 16px; }</style>
</head>
<body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html ⚡ i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://cdn.ampproject.org/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<meta name="viewport" content="width=device-width,minimum-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://cdn.ampproject.org/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<link rel="canonical" href="self.html"><style amp-custom>h1{margin:16px}</style>
</head>
<body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html ⚡ i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/lts/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://cdn.ampproject.org/lts/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://cdn.ampproject.org/lts/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/lts/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<meta name="viewport" content="width=device-width,minimum-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://cdn.ampproject.org/lts/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://cdn.ampproject.org/lts/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://cdn.ampproject.org/lts/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<link rel="canonical" href="self.html"><style amp-custom>h1{margin:16px}</style>
</head>
<body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<link as="script" crossorigin="anonymous" href="https://example.com/amp/rtv/123456789000000/v0.mjs" rel="modulepreload">
<meta name="runtime-host" content="https://example.com">
<meta name="amp-geo-api" content="/geo"><style amp-runtime i-amphtml-version="123456789000000">/* example.com v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script async src="https://example.com/amp/rtv/123456789000000/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://example.com/amp/rtv/123456789000000/v0.js" crossorigin="anonymous"></script><script async custom-element="amp-experiment" src="https://example.com/amp/rtv/123456789000000/v0/amp-experiment-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://example.com/amp/rtv/123456789000000/v0/amp-experiment-0.1.js" crossorigin="anonymous" custom-element="amp-experiment"></script><script async custom-element="amp-analytics" src="https://example.com/amp/rtv/123456789000000/v0/amp-analytics-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://example.com/amp/rtv/123456789000000/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async custom-element="amp-video" src="https://example.com/amp/rtv/123456789000000/v0/amp-video-0.1.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://example.com/amp/rtv/123456789000000/v0/amp-video-0.1.js" crossorigin="anonymous" custom-element="amp-video"></script>
<link rel="canonical" href="self.html"><style amp-custom>h1{margin:16px}</style>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html amp i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta data-auto charset="utf-8">
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script>
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script>
<link data-auto rel="canonical" href=".">
</head>
<body>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html amp i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1">
<head>
<meta data-auto charset="utf-8">
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link as="script" crossorigin="anonymous" href="https://cdn.ampproject.org/lts/v0.mjs" rel="modulepreload"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/lts/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0.js" crossorigin="anonymous"></script>
<meta data-auto name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"><style amp-runtime i-amphtml-version="123456789000000">/* ampproject.org/rtv v0.css */amp-img[i-amphtml-ssr]:not(.i-amphtml-element):not([layout=container])>*{display: block;}</style><script data-auto async src="https://cdn.ampproject.org/lts/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/lts/v0.js" crossorigin="anonymous"></script>
<link data-auto rel="canonical" href=".">
</head>
<body>
Expand Down
Loading