ampproject / ampproject/amphtml
[Amp optimizer] Import `amp-animation-0.1.js` when story contains `animate-in` attribute or `amp-story-animation`
- Dominant language
- JavaScript
- Stars
- 14.9k
- Forks
- 4.1k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
Stories run `animate-in` and `amp-story-animation` elements using [`amp-animation`](https://amp.dev/documentation/components/amp-animation/) but the component is lazy loaded if not imported in the document head. We want the amp-optimizer to add the script tag importing it when we know it will be necessary.
```html
```
### Alternatives Considered
Lazy loading `amp-animation` is what currently happens, but on throttled connections and slow devices, the lazy-loaded extension will take some time to load, delaying the `animate-in` animations, the `amp-story-animation` animations, and `finish` animations on `prefers-reduced-motion` devices.
Contributor guide
Research direction
Start by locating the amp-optimizer logic that processes AMP stories and the existing handling for extension imports. Check how stories containing animate-in or amp-story-animation are detected, then verify the generated document head includes the amp-animation script only when needed.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- performance, web-dev
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100