The AMP Project Roadmap

The ongoing development of AMP is conducted in working groups, each with knowledge or interest in a specific area of AMP.

To make their work visible to the community all groups provide regular status updates with details of what they have accomplished and what's up next.

All of the updates listed here are available as issues on GitHub and we'd love you to join the conversation there!

Select working groups

All User Interface & Accessibility AMP for Email Infrastructure Runtime Caching Viewers Stories Analytics Monetization Performance Bento

Bento

Status Update Thu Apr 01 2021

What was accomplished 🍱 ✅

amp-render bindable src PR merged
Collaboration with caching team on validator changes for developer preview components (still under experiment)
Storybook upgraded to version 6
Display locking removed from amp-accordion due to chrome team change in API
Early Bento feedback(technical/ product) here
Bento Compiler in security and privacy review
Presented on Shadow DOM on Deep Dive 4/6 - slides, video

All details on GitHub

What's next ⏩

Continue Validator work on all developer preview components (still under experiment)
amp-render support for object and amp-render
amp-sidebar toolbar feature in AMP mode
amp-twitter ongoing work
amp-next-page initial assessment

All details on GitHub

Bento

Status Update Tue Mar 02 2021

What was accomplished 🍱 ✅

Automated design review issue creation
Started validating developer preview components (still under experiment)
Wrapped up CLS investigations on carousel components
Introduced scheduling for Bento components, i.e. lightbox and sidebar
Merged Sidebar Toolbar feature in Preact mode
Now generating npm binaries during build/dist for npm publishing
amp-render initial implementation with support for remote, bindable src and amp-state protocol
Prototype for amp-twitter

All details on GitHub

What's next ⏩

Working with infra 👋 🏗️ to release npm binaries
Validate all developer preview components (still under experiment)
amp-sidebar toolbar feature in AMP mode
amp-render support for amp-script protocol and placeholder
amp-twitter ongoing work
Tune in for shadow DOM demo in next week's deep dive

All details on GitHub

Bento

Status Update Mon Mar 01 2021

What was accomplished 🍱 ✅

amp-fit-text server-side experiment to measure performance with v0
amp-render base implementation
amp-sidebar toolbar design
Investigating CLS in amp-carousel, amp-base-carousel, and related

Lessons learned 👩‍🎓

We have docs on how to format docs!

All details on GitHub

What's next ⏩

Bento npm publishing
amp-render
- loading from amp-script
- placeholder support
Fixing some carousel CLS issues
First look at amp-twitter
Video docking active development

All details on GitHub

Bento

Status Update Mon Mar 01 2021

What was accomplished ✅

Fix it week 🔨

amp-youtube supports currentTime and duration in imperative API https://github.com/ampproject/amphtml/pull/32804
amp-selector has stylistic support for hybrid disabled + selected state https://github.com/ampproject/amphtml/pull/32825
amp-accordion 0.1 and 1.0 respect pre-existing role attributes https://github.com/ampproject/amphtml/pull/32915
amp-timeago 0.1 and 1.0 migrated to latest timeago.js library (from third_party/ to node_modules) and now have support for 7 more languages
e2e tests for amp-sidebar https://github.com/ampproject/amphtml/pull/32837, amp-social-share https://github.com/ampproject/amphtml/pull/32881, and amp-accordion https://github.com/ampproject/amphtml/pull/32958
Documented media-based attributes and enabled on amp-fit-text https://github.com/ampproject/amphtml/pull/32824
BaseElement['props'] refactor to simplify children configurations https://github.com/ampproject/amphtml/pull/32936
objstr:
- used in more components https://github.com/ampproject/amphtml/pull/32893
- compiles down https://github.com/ampproject/amphtml/pull/32872
JSS:
- transform compiled output to export const className for filesize https://github.com/ampproject/amphtml/pull/32888
- collect z-index https://github.com/ampproject/amphtml/pull/32847
Shadow DOM polyfill https://github.com/ampproject/amphtml/pull/32820

General 🍱

LightboxGallery Preact implementation
component file restructuring for npm packaging
NPM binary generation with ES build
design review for deferred build and async pause systems
Use gulp get-zindex [--fix] to make sure css/Z_INDEX.md is up to date

All details on GitHub

Lessons learned 👩‍🎓

We can stop prettier from exploding the boilerplate code on HTML documents by disabling prettier for the <head> node.

What's next ⏩

amp-lightbox-gallery AMP layer
amp-sidebar active development
video docking active development
Analysis of amp-fit-text 0.1 -> 1.0 auto upgrade performance implications

All details on GitHub

Bento

Status Update Mon Feb 01 2021

What was accomplished

npm packaging in progress
Video docking in progress
Contributing to obj-str Babel transformations for an improved classname construction
Sidebar animations completed
Started the load experiment for Bento components in AMP using amp-fit-text
Progress on component isolation: measurements, pause/resume and deferred build. Presenting at tomorrow's design review.
aspect-ratio rollout is continuing
Started the project to refactor log writers.
Started work on lightbox gallery

Lessons learned

We've been rendering and testing visual diffs on different browser versions, which explains some flakes.

All details on GitHub

What's next

Fixit week
Working on the next set of Bento component priorities.
Continued progress on video docking, sidebar, and lightbox gallery.
Continued progress on component isolation

All details on GitHub

Bento

Status Update Mon Feb 01 2021

What was accomplished

🎉 We launched our dev preview!
🎯 amp-social-share:focus support through shadow DOM
⬆️ amp-date-countdown countUp feature
📦 Design doc for releasing Bento components on npm
✅ e2e tests now support sharing fixtures across component versions
⏰ Dispatch DOM events in Bento components
📝 Document imperative API for Bento mode
🛥️ Draft Preact docking implementation
📸 aspect-ratio rollout
🐛 Various bug fixes:
iOS web scrolling
non-zero line-height for [placeholder] elements
media attributes

Lessons learned

All details on GitHub

What's next

📝 Documentation / Deep Dive for delegatesFocus
📂 Demo changes in component file structure to prepare for releasing on npm
🛥️ Continued progress with media docking
💡 LightboxGallery design and implementation
🔖 Sidebar continued progress

All details on GitHub

Bento

Status Update Tue Jan 05 2021

What was accomplished

Most folks OOO
Bug fixes from year end bug bash
Imperative API
Work started on amp-sidebar

Lessons learned

box-styles propagation through display: contents 1-pager

All details on GitHub

What's next

Preparing amp.dev with high level Bento information and usage guides
Developer preview of our first 16 components
amp-truncate-text

All details on GitHub

Bento

Status Update Fri Jan 01 2021

What was accomplished

Ready for dev preview. Waiting for some amp.dev updates to go public.
Dev-preview related minor fixes.
Sidebar: RTL and styling fixes
We now have ResizeObserver polyfill across all of AMP
Initial resize-code refactoring.

Lessons learned

All details on GitHub

What's next

Continuing: Video docking
Start: lightbox gallery
Social share: focus outline work
Continuing: amp-truncated-text
Upgrading storybook
Start: npm packages for (P)react components

All details on GitHub

Bento

Status Update Mon Dec 07 2020

What was accomplished

Most of carousel baseline features completed
Accordion: display locking completed.
Imperative APIs: design completed.
Troubleshooting IntersectionObserver spec problems.

Lessons learned

All details on GitHub

What's next

Bug bash
Sidebar

All details on GitHub

Bento

Status Update Mon Nov 09 2020

What was accomplished

Video iframe code merged for Preact
Progress on docking
Static Storybook deployment
Implemented CE disconnect/connect as Preact mount/unmount
Built support for media attributes, including boolean media attributes
amp-bind is supported in the Storybook
Imperative API for accordion completed
Bind protocol for accordion completed
Continued progress on viewportCallback removal
Started lightbox implementation

Lessons learned

All details on GitHub

What's next

amp-video-iframe binding for video iframe
auto-advance in carousel
carousel thumbnails
carousel snapping features
DOM event support for accordion
Restructure accordion for better Preact semantics and support display locking
Preact and AMP bindings implementation of lightbox

All details on GitHub

Bento

Status Update Mon Nov 02 2020

What was accomplished

amp-accordion:
external API restructure
accessibility attributes
amp-base-carousel snap-align feature to view slides either at start or center of carousel viewport
amp-lightbox initial implementation
amp-selector:
keyboard-select-mode feature for Arrow key navigation and selection configuration
Preact unit tests
Ongoing fixes for resource loaders and intersection observers
Imperative API design and discussion
Documentation written for amp-instagram, amp-youtube, amp-lightbox
Removed viewportCallback from BaseElement
PR deploy bot integration with Storybook

Lessons learned

You can run Preact Devtools in Storybook by adding import 'preact/debug'; to the start of the story.
We make sure hidden is display:none in AMP but it is much more fragile (overridable) to use it in Bento mode.

All details on GitHub

What's next

Finalizing dev preview feature set and planning for beta
Continued progress on imperative API
amp-accordion:
display locking
final touches
amp-base-carousel:
e2e tests
orientation feature to configure the carousel as horizontal or vertical scrolling
dir="rtl" support
amp-selector integration with forms

All details on GitHub

Bento

Status Update Fri Oct 02 2020

What was accomplished

Prototypes created for mixed-length and streaming carousel types
Accordion: a11y support and styling.
Accordion: work started on imperative APIs.
Video iframes and YouTube components are code complete.
Started lightbox components. Presented in design review.
Replacing viewportCallback with IntersectionObserver throughout the runtime.

Lessons learned

All details on GitHub

What's next

Continue work on video docking
Continue work on stream and mixed-length carousel types.
Continue work on lightbox components.
Continue work on accordion imperative APIs, a11y, and structure.
Support media-query attributes.

All details on GitHub

Bento

Status Update Thu Oct 01 2020

What was accomplished

Design work has started on the AMP/JSX templates.
YouTube component is in progress.
More carousel features added such as controls and snapping.
DateCountdown component - code-complete.
Accordion: animations done.
amp-img SSR is launching and collecting metrics.
Instagram component completed.
Aspect ratio supported for layout=responsive. Unfortunately, it doesn't work for layout=intrinsic.
Did some evaluations and filed bugs on Goober - a potential alternative for JSS.

Lessons learned

Animations could potentially be easier solved with Web Animations API. The big benefit is that some CSS properties can be easier managed for setup and cleanup as the keyframes definition.

All details on GitHub

What's next

Video docking.
StreamGallery component.
Complete accordion features.
Make decision on auto-envelope for dev preview.
LIghtbox components.
Start reducing AMP Runtime reliance on the measuring code.

All details on GitHub

Bento

Status Update Wed Sep 02 2020

What was accomplished

amp-video complete.
MediaSession support for videos: close to be done.
VideoIframe component has been started.
Loading model is redone via loading prop.
layout=responsive implementation via aspect-ratio CSS completed
social-share: fixed error handling
social-share: refresh of all styles and icons completed
date-countdown: AMP mapping in progress
JSS support has been completed on the infra side.
finished analysis for JSS competitors: Emption, Goober, and Aphrodite.
Instagram: code complete, tests WIP.
Improved AMP mode in the storybook to make parameter selections sticky.
Shadow DOM support: automatically discover slot distribution changes.
Multi-attribute parsing supported where different input formats can map to a single Preact prop.
Fixed Closure bugs on destructured property typing.
Auto-envelope experimentation in progress to execute extensions w/o v0.js.

Lessons learned

All details on GitHub

What's next

Working on dev preview launch plans.
Start templates-via-JSX design.
Start YouTube component.
Start Accordion component.
Complete date-countdown and instagram support.

All details on GitHub

Bento

Status Update Tue Sep 01 2020

What was accomplished

Initial amp-inline-gallery and amp-inline-gallery-pagination completed.
Improved style propagation from Web components to Preact components.
Started experimentation with auto-envelope for Bento: a smaller custom-element wrapper that could allow us to run Bento components w/o runtime.
amp-date-countdown design and initial work on Preact component completed.
JSS support completed and ready for use.
Completed design review for ad-frame components (amp-facebook-comments and amp-twitter).
Prototyping completed for ::part CSS.

Lessons learned

Using fake timer when testing Preact has to be done very carefully to avoid "stuck" global queues. Always call clock.runAll() in afterEach. A more stable solution is in research.
The ::part CSS could be very natural for Bento. However, our typical markup is incompatible with it and would need to be changed. However, that often limits some of the CSS/markup that we've been using.

All details on GitHub

What's next

Review light-DOM components, especially template-based ones.
amp-instagram support.
amp-date-countdown AMP/Bento bindings.
Working on "developer preview" plans.

All details on GitHub

Bento

Status Update Mon Aug 03 2020

What was accomplished

Video Manager Preact implementation in review
New Bento Storybook mode deployed to @ampproject/storybook-addon
Mutation Observer system imlpemented
Supported declarative shadow DOM spec (proof of concept)
Started work on auto-eveloped extensions prototype
JSS supported for Bento components and recompiled for AMP mode.
Imperative API support

Lessons learned

All details on GitHub

What's next

JSS design review on Sep 2nd
Inline gallery Bento implementation
amp-date-countdown Bento implementation
Continue video manager work

All details on GitHub

Bento

Status Update Mon Aug 03 2020

What was accomplished

Started Video Player implementation
Started work on advanced carousel components: inline-gallery and streaming-gallery
Context API: subscriber and component APIs in review
CSS design ready based on JSS framework
Model for container wrappers based on the contain CSS as an alternative to AMP's layouts.
amp-img SSR work in progress.
Main social-share redesign complete with more advanced customization.
New embedding mode with non-empty passthrough when a shadow DOM is given a slot only when children are available. This allows us to support text nodes as well as elements as children.
Renewed focus on unit and integration testing of both: Preact and AMP elements.

Lessons learned

Our carousel ecosystem is very advanced.
How useful display:none in React world?

All details on GitHub

What's next

Start using Context API
Storybook: Bento mode that does not reload the whole AMP page.
Continued progress on advanced carousels
Continued progress on video players
Prototype auto-enveloped extensions that can run without v0.js
CSS implementation for components and shadow DOM.

All details on GitHub

Bento

Status Update Thu Jul 02 2020

What was accomplished

Context API introduced to AMP for discovery phase, value propagation in progress
Using externs to define types for props, allowing direct prop access and destructuring in components
amp-social-share:
- update experiment name
- design documentation
- configurable color and backgroundColor for preconfigured providers
Video players design
amp-base-carousel:
- Initial Preact implementation with looping and smooth scrolling
- AMP layer and default arrow UI in progress

All details on GitHub

What's next

Continued progress on Context API
Add passthrough-non-empty for amp-social-share
Continued progress on Carousel
Prototype video players
Prototype extension "auto-envelope" for Bento and AMP modes

All details on GitHub

Bento

Status Update Mon Apr 06 2020

What was accomplished 🍱 ✅

amp-render bindable src PR merged
Collaboration with caching team on validator changes for developer preview components (still under experiment)
Storybook upgraded to version 6
Investigating a visual diff test that outputs CLS changes
Discussion with bento.dev and legal for naming
Reviewing element that may cause issues for existing / future bento migrations

All details on GitHub

What's next ⏩

Remove existing implementation of display locking per changes to chromium team's support
Working with infra 👋 🏗️ to release npm binaries
Validate all developer preview components (still under experiment)
amp-sidebar toolbar feature in AMP mode
amp-render support for amp-script protocol and placeholder
amp-twitter ongoing work
Tune in for shadow DOM demo in today's deep dive

All details on GitHub