Unofficial Python port of server-side rendering from AMP Optimizer
Project description
AMP Renderer
Unofficial Python port of server-side rendering from AMP Optimizer. Tested in Python 3.5 and above, but also supports Python 2.7.
AMP Renderer performs the following optimizations:
- Inject the specific layout markup into each AMP element
- Insert the AMP runtime styles into the document
- Remove the AMP boilerplate styles, if possible
- Mark the document as “transformed” with the appropriate tags on the
html
element - Insert
img
tags for images with the data-hero attribute
It also makes these formatting updates:
- Remove empty
class
andstyle
tags for AMP HTML elements - Convert tag names and attribute names to lowercase
- Convert numerical attribute values to strings
- Use double quotes ("") for attributes, and escape double quotes inside attribute values
- Remove whitespace between html attributes
- If desired, removes comments (disabled by default)
- If desired, trims whitespace around HTML attribute values (disabled by default, and not always a good idea)
AMPRenderer can be used on a block of arbitrary HTML, but when used on a full document, it will insert the AMP runtime styles and, if possible, remove the AMP boilerplate styles.
Boilerplate styles can be removed except in these cases:
- An AMP element uses an unsupported value for the
layout
attribute amp-audio
is used- There is at least one
amp-experiment
active - Transformation fails for one or more elements due to an invalid attribute value for
media
,sizes
, orheights
- Any render-delaying extension is used. Currently this means:
amp-dynamic-css-classes
amp-story
If boilerplate styles can’t be removed, the attribute no_boilerplate
will be set to True
after calling render
; otherwise it will be False
. Until render
runs, the no_boilerplate
attribute isn’t set at all.
Usage
If using Django, you can use the Django AMP Renderer middleware.
Otherwise, install via PyPI:
pip install amp-renderer
Minimal usage:
from amp_renderer import AMPRenderer
...
RUNTIME_VERSION = "012345678" /* Current AMP runtime version number */
RUNTIME_STYLES = "..." /* Current contents of https://cdn.ampproject.org/v0.css */
renderer = AMPRenderer(
runtime_version=RUNTIME_VERSION,
runtime_styles=RUNTIME_STYLES)
original_html = """
<!doctype html>
<html ⚡>
...
</html>
"""
result = renderer.render(original_html)
print(result)
Remove comments and/or trim attributes:
renderer.should_strip_comments = True
renderer.should_trim_attributes = True
result = renderer.render(original_html)
print(result)
The AMPRenderer class inherits from HTMLParser, and can be similarly extended.
Testing, etc.
Sort imports (Requires Python >= 3.6):
make normal
Lint (Requires Python >= 3.6):
make lint
Test:
make test
Discussion
There are still some aspects of the official AMP Optimizer implementation that haven’t been addressed yet. PRs welcome.
General
-
Tested against AMP Optimizer’s ServerSideRendering spec - Automatic runtime version management
Dynamic attributes
-
Supportsizes
,media
, andheights
via CSS injection - Warn or fail if CSS injection puts the
amp-custom
element over the byte limit - Group CSS injections for
media
attributes by shared media queries to reduce necessary bytes
Hero Images
-
Injectimg
tag foramp-img
s with thedata-hero
attribute - Enforce 2-image limit on
data-hero
- Autodetect hero images
- Support hero image functionality for
amp-iframe
,amp-video
, andamp-video-iframe
Performance
The Python AMP Renderer does not insert preload
links into the head
of the DOM object for hero images; This can be done by hand for more control over the critical path.
Since AMPRenderer adds the amp-runtime
styles to the document, you can also use the AMP Module Build by hand. To take advantage of this, rewrite the import scripts such that imports like this:
<script async src="https://cdn.ampproject.org/v0.js"></script>
...become 2-part imports based on Javascript Modules, like this:
<script type="module" async src="https://cdn.ampproject.org/v0.mjs"></script>
<script nomodule async src="https://cdn.ampproject.org/v0.js"></script>
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Hashes for amp_renderer-1.1.5-py3-none-any.whl
Algorithm | Hash digest | |
---|---|---|
SHA256 | 4ab82431763135cae536c78a992d981923a844a3d948ef3a1fcf5c14cf1cf134 |
|
MD5 | 66e010064e08b0dce64204e62676831b |
|
BLAKE2b-256 | 38261a2a1c507bacc4add8a7431a6c7fb757405fa25914467d70a731933ce914 |