Skip to main content

Unofficial Python port of server-side rendering from AMP Optimizer

Project description

AMP Renderer

Python 3.6+ Build Status Coverage

Unofficial Python port of server-side rendering from AMP Optimizer. Supports Python 3.6 and above.

AMP Renderer performs the following optimizations:

  1. Inject the specific layout markup into each AMP element
  2. Insert the AMP runtime styles into the document
  3. Remove the AMP boilerplate styles, if possible
  4. Mark the document as “transformed” with the appropriate tags on the html element
  5. Insert img tags for images with the data-hero attribute

It also makes these formatting updates:

  1. Remove empty class and style tags for AMP HTML elements
  2. Convert tag names and attribute names to lowercase
  3. Convert numerical attribute values to strings
  4. Use double quotes ("") for attributes, and escape double quotes inside attribute values
  5. Remove whitespace between html attributes
  6. If desired, removes comments (disabled by default)
  7. 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, or heights
  • 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.

Install requrements:

make install

Sort imports (Requires Python >= 3.8):

make format

Lint (Requires Python >= 3.8):

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

  • Support sizes, media, and heights via CSS injection
  • Group CSS injections for media attributes by shared media queries to reduce necessary bytes
  • Support percent values in heights
  • Warn or fail if CSS injection puts the amp-custom element over the byte limit

Hero Images

  • Inject img tag for amp-imgs with the data-hero attribute
  • Enforce 2-image limit on data-hero
  • Autodetect hero images
  • Support hero image functionality for amp-iframe, amp-video, and amp-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.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

amp-renderer-2.0.1.tar.gz (22.5 kB view details)

Uploaded Source

Built Distribution

amp_renderer-2.0.1-py3-none-any.whl (22.5 kB view details)

Uploaded Python 3

File details

Details for the file amp-renderer-2.0.1.tar.gz.

File metadata

  • Download URL: amp-renderer-2.0.1.tar.gz
  • Upload date:
  • Size: 22.5 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/3.7.1 importlib_metadata/4.8.2 pkginfo/1.8.2 requests/2.26.0 requests-toolbelt/0.9.1 tqdm/4.62.3 CPython/3.9.9

File hashes

Hashes for amp-renderer-2.0.1.tar.gz
Algorithm Hash digest
SHA256 f3bc3a5739bdfbf5cf7867e4dc9d4ade106d350263558c85f43901e1e678e58d
MD5 b327aff4b2c390a11f8624d4ac11ed37
BLAKE2b-256 412cce83e3d26362d83113ace1ebd74c3834f728c266bc7a9a5803d47b229963

See more details on using hashes here.

File details

Details for the file amp_renderer-2.0.1-py3-none-any.whl.

File metadata

  • Download URL: amp_renderer-2.0.1-py3-none-any.whl
  • Upload date:
  • Size: 22.5 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/3.7.1 importlib_metadata/4.8.2 pkginfo/1.8.2 requests/2.26.0 requests-toolbelt/0.9.1 tqdm/4.62.3 CPython/3.9.9

File hashes

Hashes for amp_renderer-2.0.1-py3-none-any.whl
Algorithm Hash digest
SHA256 03db430eb0f6d7f0a8b48f3e953d05162ac1d626ad03dbbf6ce52688113a4dd4
MD5 c2d5fb9027f35eb9828594ec3a693acf
BLAKE2b-256 3258144a3e1b3942d8d8a4773728bb5f1b47cc0983907380ceafc5062e0eef68

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page